उच्च रिज़ॉल्यूशन स्क्रीन का अनुकरण कैसे करें? [बन्द है]


93

क्या ब्राउज़र के लिए मेरी वेबसाइट को मेरी स्क्रीन से अधिक रिज़ॉल्यूशन में परीक्षण करने का कोई तरीका है?

जैसे: मेरे पास 1440 x 900 स्क्रीन है, और मैं 1920 x 1200, 1920 x 1080 आदि में वेबसाइट का परीक्षण करना चाहता हूं।


@ वास्तव में यह एक बहुत अच्छा सुझाव है। उभरने वाली चीज़ों जैसे कि 960.gs उभरना, क्योंकि यदि आप पिक्सेल आकार के साथ काम करते हैं, तो आपका डिज़ाइन हर जगह एक जैसा दिखता है, यह स्क्रीन के रिज़ॉल्यूशन के आधार पर स्क्रीन रियल एस्टेट की विभिन्न मात्राएँ लेता है। उच्च रिज़ॉल्यूशन में क्षैतिज रूप से दोहराए जाने वाले ग्राफिक्स का परीक्षण करने की आवश्यकता नहीं है जब तक कि आप किसी भी सीम लाइन को सुनिश्चित करने के लिए पूर्ण 2 और थोड़ा दोहराव देख सकते हैं। या आप बस कुछ अधिक रोचक उत्पादन करने के लिए सिकाडा सिद्धांत का उपयोग कर सकते हैं।
Endophage

1
@ एंडोफेज: मैं असहमत हूं। उचित रूप से द्रव लेआउट का निर्माण अक्सर उपयोगकर्ता फ़ॉन्ट आकार वरीयताओं के संबंध में बेहतर परिणाम देता है। हर जगह समान दिखना आवश्यक नहीं है, यह सिर्फ पिक्सेल-झाँक रहा है।
आप

@ आपको अभी तक एक द्रव लेआउट देखना है जो फ़ॉन्ट आकार बदलता है। ध्यान दें कि निश्चित पिक्सेल चौड़ाई अच्छी है क्योंकि मानव आंख एक निश्चित लंबाई पर लाइनों को स्कैन करने के लिए संघर्ष करती है (मेरा मानना ​​है कि यह लगभग 12px फ़ॉन्ट आकार में लगभग 20 शब्द पाया गया है, आप इसे खुद देख सकते हैं)। यदि आप फ़ोन रिज़ॉल्यूशन के बारे में बात कर रहे हैं, तो यह एक अलग कहानी है, लेकिन अगर आप डेस्कटॉप / लैपटॉप रिज़ॉल्यूशन के बारे में बात कर रहे हैं, अगर मेरे पास एक उच्च रिज़ॉल्यूशन वाली बड़ी गधे की स्क्रीन है और विंडो का आकार बदल रहा है, तो मैं प्रभावी रूप से परीक्षण कर रहा हूं विभिन्न संकल्प।
एंडोफेगे

1
@ इंडोफेज: इसलिए आपकी चौड़ाई के रूप में 40em, (या समान माप) का उपयोग करने की आवश्यकता है 960px। जब मैं आपका 12px फ़ॉन्ट आकार तय करता हूं, तो पिक्सल मेरे लिए बहुत छोटा नहीं होगा और दबाएं Cmd- +। इसके अलावा, मेरी ब्राउज़र विंडो मुश्किल से 960px है।
आप

@ आप वास्तव में, जब आप हिट करते हैं तो पिक्सेल स्केल हो जाएगा Ctrl/Cmd +क्योंकि यह एक ज़ूम फ़ंक्शन है। आप इसे यहाँ SO पर आज़मा सकते हैं। मुख्य सामग्री अनुभाग 960px चौड़ा है। 40em जैसी किसी चीज़ का उपयोग स्क्रीन रिज़ॉल्यूशन के साथ नहीं होगा। emआकारों का उपयोग करना मूल तत्व के फ़ॉन्ट आकार के सापेक्ष है जो कि शीर्ष स्तर पर 1em / 16px तक सभी तरह से विरासत में मिला है जब तक कि ओवरराइड नहीं किया जाता है (और माफी नहीं, यह मेरी पहले की टिप्पणी में 12 पीएक्स नहीं होना चाहिए)। ऊपर पढ़ें: kyleslifeffer.com/best-practices/…
Endophage

जवाबों:


76

[संपादित करें: पहले अपने ब्राउज़र के डिवॉल्ट्स की जाँच करें! जैसा कि @SkylarIttner ने टिप्पणी में बताया है, नीचे के समाधान को पोस्ट किए जाने के बाद से अधिकांश ब्राउज़रों में उत्तरदायी डिज़ाइन परीक्षण के लिए उपकरण रोल आउट किए गए हैं। वे अब सबसे अच्छा / सबसे आसान विकल्प होने की संभावना है।]

आप गलत कर सकते हैं, अगर मैं गलत हूं, तो केवल style="desired width & height"और src="your/test.site"केवल बच्चे के रूप में एक आइफ्रेम बनाएं <body>। साइट को इस रूप में प्रदर्शित करना चाहिए जैसे कि रिज़ॉल्यूशन निर्दिष्ट चौड़ाई / ऊँचाई थी और परिणाम की जाँच करने के लिए स्क्रॉल बार में।

तीसरे पक्ष का उपयोग करने के रूप में सुविधाजनक नहीं है, इसे स्वयं स्थापित करने के लिए, लेकिन बिना इंटरनेट कनेक्शन के स्थानीय रूप से परीक्षण करने में सक्षम होने का लाभ है।


5
क्यों ... मुझे कहना होगा, यह प्रतिभा है। +1
माफिया

बेशक! धन्यवाद! ^ ^
ओस्कर डुवॉर्न

मैं आपको पर्याप्त धन्यवाद नहीं दे सकता!
रहमान शरीफ

1
सभी सकारात्मक प्रतिक्रिया लोगों के लिए धन्यवाद। यह जानना अच्छा है कि चीजें कब मददगार होती हैं।
कोडी क्रुमरीन

1
इस अवसर में कि यह किसी की मदद करता है, यहाँ जो @Cody Crumrine का सुझाव देने के लिए नमूना कोड है और वह जीनियस है !! <iframe src = " site to test.com" width = "1024" height = "768"> </ iframe>
स्टुअर्ट

28

यह समाधान ऊपर प्रस्तावित लोगों की तुलना में तेज़ है:

http://www.infobyip.com/testwebsiteresolution.php

यह Browserhots.org की तरह बहुमुखी नहीं है, लेकिन यह बहुत तेज़ है (कुछ सेकंड v। 45 मिनट की कतार)।


यह कोई बुरा जवाब नहीं है। हालाँकि, वह साइट पूरी तरह से कुछ भी प्रदान करती है जिसे आप पहले से ही किसी डेस्कटॉप कंप्यूटर पर ब्राउज़र विंडो के आकार के अनुसार नहीं कर सकते। IMHO, टेबलेट और फ़ोन के लिए उस पृष्ठ के लिंक पूरी तरह से बेकार हैं ... क्योंकि थोड़ा आइपॉड स्क्रीन पर, मेरी 1000 पिक्सेल चौड़ी साइट पूरी तरह से ठीक प्रदर्शित करने के लिए मोबाइल सफारी द्वारा स्वचालित रूप से आकार बदल जाती है।
चंचल

4
@ Sparky672, मैं व्यक्तिगत रूप से अपने ब्राउज़र को मेरे स्क्रीन रिज़ॉल्यूशन से बड़ा होने के लिए आकार नहीं दे सकता। ओपी एक 1440 पर 1920 को देखने के लिए कह रहा था। शायद वहाँ एक रास्ता है, लेकिन क्या यह इन्फोबिप के समाधान के रूप में आसान है? माफी माँगता हूँ अगर मैं कुछ स्पष्ट देख रहा हूँ (मुझे लगता है कि मैं हो सकता है)।
काइल

2
धन्यवाद @ Sparky672 और कोई समस्या नहीं। लेकिन क्या आपको अपनी टिप्पणी को नष्ट नहीं करना चाहिए "वह साइट पूरी तरह से कुछ भी प्रदान नहीं करती है जो आप पहले से ही किसी भी डेस्कटॉप कंप्यूटर पर ब्राउज़र विंडो को आकार देकर खुद को नहीं कर सकते हैं" क्योंकि यह सच है?
काइल

1
@ Sparky672, ऊर्ध्वाधर के बारे में क्या?
काइल

1
मैं ऊर्ध्वाधर का उपयोग करता हूं यह देखने के लिए कि गुना से ऊपर और नीचे क्या गिरता है। मैं इसे स्टैट्सकाउंटर और माउसफ्लो के साथ जोड़कर देखता हूं कि दर्शकों का कितना प्रतिशत देखता है। आई लव यू स्पार्की! मुझे लगता है कि आप मेरे लहजे को गलत पढ़ रहे हैं। और मैं मददगार बनना चाहता था। कोई भी समाधान मैं 0 वोट और टिप्पणियों की एक सूची के साथ प्रदान नहीं करेगा। लेकिन ओह ठीक है ...
काइल

9

कुछ विचार:

ब्राउज़र ज़ूम, 1024x768 50% ज़ूम = 2048x1536 सिम्युलेटेड रिज़ॉल्यूशन का उपयोग करें, मुझे पता है कि क्रोम छवियों और पसंद को आकार देता है। चीजें पढ़ना मुश्किल हो जाता है, लेकिन मैं मान रहा हूं कि आप प्लेसमेंट और ऐसे परीक्षण कर रहे हैं।

इसके अलावा, आप सामान्य रिज़ॉल्यूशन स्क्रीनशॉट से अधिक लेने के लिए कुछ स्क्रीनशॉट प्रोग्राम का उपयोग कर सकते हैं (फ़ायरफ़ॉक्स पर फ़रिशोट मुझे ऐसा करने दें, लेकिन वास्तव में उच्च रिज़ॉल्यूशन के साथ मेमोरी के मुद्दे थे, और अब मुक्त नहीं है)।


6

एक समाधान, शायद ओवरकिल, Xvfb का उपयोग करना होगा : वांछित रिज़ॉल्यूशन और रंग की गहराई निर्धारित करें, अपने पेज को ब्राउज़र (ओं) में लोड करें और स्क्रीनशॉट (एस) लें।


4

प्रयास करें viewlike.us या screen-resolution.com । यह सभी संभव संकल्प नहीं हैं, लेकिन कम से कम सबसे आम हैं।

मैंने उनकी कोशिश नहीं की है, लेकिन यह बहुत सीधे आगे लगता है।


स्क्रीन-रिज़ॉल्यूशन इसे फेंकता है: "आपका स्क्रीन रिज़ॉल्यूशन बहुत छोटा है आपके द्वारा चयनित पॉप-अप आपके द्वारा उपयोग किए गए स्क्रीन रिज़ॉल्यूशन के लिए बहुत बड़ा है। आपका स्क्रीन रिज़ॉल्यूशन 1440 पिक्सेल 900 पिक्सेल है। आपने जो पॉप-अप विंडो खोलने की कोशिश की है, वह 1920 है। पिक्सेल्स बाय 1200. "
हैप्पीडेवलर

हमारे जैसा देखें यह फेंकता है: "निषिद्ध आपको इस सर्वर तक पहुंचने / पहुंचने की अनुमति नहीं है। इसके अतिरिक्त, अनुरोध को संभालने के लिए एक ErrorDocument का उपयोग करने की कोशिश करते समय एक 404 नहीं मिला। त्रुटि का सामना करना पड़ा। mod_bwlimited / 1.4 FrontPage / 5.0.2.2635 सर्वर viewlike.us पोर्ट 80 पर "
HappyDeveloper

2

यद्यपि यह आपको आपके परीक्षण का सटीक समाधान नहीं बताएगा, आप zoomज़ूम आउट करने के लिए Chrome या FF में उपकरण का उपयोग कर सकते हैं । यह काफी सटीक विचार देगा कि साइट उच्च रिज़ॉल्यूशन स्क्रीन पर कैसी दिखती है।


2

यदि आप अपनी साइट के एक स्थिर स्क्रीनशॉट को देखने के साथ ठीक हैं, तो मैं http://browsershots.org/ सुझाऊंगा

वे आपको वस्तुतः किसी भी ब्राउज़र / ओएस संयोजन में अपनी साइट के स्क्रीन शॉट्स देखने का विकल्प देते हैं, जिसमें स्क्रीन आकार निर्दिष्ट करने की क्षमता, और अन्य विकल्पों का एक पूरा गुच्छा शामिल है।

अच्छी तरह से बुकमार्क करने लायक।


1

आप wkhtmltoimage को आज़माना चाह सकते हैं , जो स्क्रीनशॉट को मनमाने प्रस्तावों पर ले सकता है।

इसके अलावा, केडीई 4 में स्क्रीन आकार से परे एक खिड़की को बढ़ाना संभव है। मुझे लगता है कि मैंने इसे विंडोज 7 में भी देखा है। अन्य OSes के बारे में निश्चित नहीं है।


1

IE9 आपको ब्राउज़र विंडो को एक मनमाने आकार में बदलने की अनुमति देता है: डेवलपर टूल के लिए F12 दबाएं, टूल्स पर जाएं आकार और अपना पसंदीदा आकार चुनें। फिर कुछ टूल का उपयोग करें जो ऑफ-स्क्रीन विंडो को कैप्चर कर सकते हैं यदि विंडो आपकी स्क्रीन से बड़ी है। इस लेख से लगता है कि स्नैगिट ऐसा कर सकते हैं। फिर बस पकड़े गए पिक पर एक नज़र डालें।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.