इष्टतम वेब पेज चौड़ाई क्या है?

एक वेब साइट डिजाइन करना और वेब पेज की चौड़ाई को इष्टतम चौड़ाई पर सेट करना एक बातचीत के लायक है। आप में से कई लोगों ने देखा है कि मैंने हाल ही में अपने ब्लॉग के डिज़ाइन की चौड़ाई बदली है। मैंने पृष्ठ की चौड़ाई को 1048 पिक्सेल तक धकेल दिया। आप में से कुछ लोग इस कदम से असहमत हो सकते हैं - लेकिन मैं कुछ आँकड़े और कारण साझा करना चाहता था कि मैंने विषय की चौड़ाई को इतना चौड़ा क्यों किया।

1048 पिक्सेल एक यादृच्छिक संख्या नहीं थी, हालांकि।

मेरे पृष्ठ की चौड़ाई के विस्तार में दो प्रमुख प्रभाव थे:

  • Youtube चौड़ाई बदलेंYoutube अब बड़े एम्बेड आकार प्रदान करता है। यदि आप यूट्यूब वीडियो पेज के साइडबार पर छोटे गियर पर क्लिक करते हैं, तो आपको बड़े आकार के साथ-साथ थीम के विकल्प भी पेश किए जाते हैं। चूंकि यूट्यूब पर हाई डेफिनिशन वीडियो आम होते जा रहे हैं, मैं उन वीडियो को अपने ब्लॉग में शामिल करना चाहता था और उन्हें जितना हो सके उतना विवरण के साथ प्रदर्शित करना चाहता था (पूरे पृष्ठ की चौड़ाई का उपभोग किए बिना)।
  • विशिष्ट विज्ञापन 125, 250 और 300 पिक्सेल चौड़ाई की चौड़ाई में आता है। 300 पिक्सेल विज्ञापन राजस्व साइटों पर अधिक से अधिक पॉपिंग करने लगते हैं और मैं उन्हें बड़े करीने से अपने साइडबार में शामिल करना चाहता था।

और निश्चित रूप से, पृष्ठ के बाईं और दाईं ओर, सामग्री और साइडबार में कुछ पैडिंग है ... इसलिए मेरी थीम के लिए जादुई संख्या 1048 पिक्सेल थी:

इष्टतम वेब साइट चौड़ाई

क्या मैंने अपने पाठक आँकड़ों की जाँच की?

हां बिल्कुल! यदि मेरे अधिकांश विज़िटर कम रिज़ॉल्यूशन स्क्रीन पर चल रहे हैं, तो मुझे निश्चित रूप से अपने पृष्ठ के विस्तार के बारे में दूसरे विचार रखने होंगे। चौड़ाई और प्रतिशतमेरे एनालिटिक्स पैकेज से स्क्रीन रिज़ॉल्यूशन आउटपुट करने के बाद (Google में यह विज़िटर> ब्राउज़र क्षमताएं> स्क्रीन रिज़ॉल्यूशन) है, मैंने परिणामों की एक एक्सेल स्प्रेडशीट बनाई और रिज़ॉल्यूशन फ़ील्ड से चौड़ाई को पार्स किया।

Google 1600 × 1200 के रूप में रिज़ॉल्यूशन प्रदान करता है, इसलिए आपको "x" के बाईं ओर से सब कुछ लेने की आवश्यकता है, इसे 1 से गुणा करके इसे एक संख्यात्मक परिणाम बनाएं ताकि आप इस पर अवरोही क्रमबद्ध कर सकें, फिर एक SUMIF करें और देखें कि कितनी विज़िट हैं आप जिस डिज़ाइन की चौड़ाई को देख रहे हैं, उससे अधिक या उससे कम है।

= वाम (A2, खोजें ( "x", A2,1) -1) * 1

क्या मैंने उन 22% पाठकों को छोड़ दिया जो छोटे रिज़ॉल्यूशन चला रहे हैं? बिल्कुल नहीं! एक लेआउट के बारे में अच्छी बात यह है कि आपकी सामग्री बाईं ओर और आपकी साइडबार दाईं ओर है कि आप यह सुनिश्चित कर सकते हैं कि आपकी सामग्री अभी भी अधिकांश ब्राउज़रों की चौड़ाई के भीतर है। इस मामले में, मेरे ९९% पाठक ६४० पिक्सेल से अधिक चौड़े चल रहे हैं, इसलिए मैं अच्छा हूँ! मैं नहीं चाहता कि वे साइडबार को पूरी तरह से छोड़ दें, लेकिन यह सामग्री के लिए गौण है।

9 टिप्पणियाँ

  1. 1

    मैं एक हाइब्रिड लेआउट और 100% सीएसएस कंटेनर की चौड़ाई का सुझाव देता हूं। जब तक आपको साइडबार के लिए एक निश्चित चौड़ाई मिल जाती है, हेडर, फुटर और मुख्य सामग्री क्षेत्र स्क्रीन की शेष चौड़ाई को फिट करने के लिए समायोजित हो जाएंगे। उपयोगकर्ता के मॉनिटर रिज़ॉल्यूशन की परवाह किए बिना, सभी की ब्राउज़र विंडो का 100% भरता है। फिर आपको मॉनिटर के प्रस्तावों के संबंध में पिक्सेल की गणना करने या उपयोगकर्ता के आँकड़ों पर नज़र रखने की ज़रूरत नहीं है।

    • 2

      मुझे वास्तव में हाइब्रिड लेआउट पसंद हैं, बॉब - लेकिन दुर्भाग्य से वे वास्तविक सामग्री के साथ कभी-कभी अच्छा नहीं खेलते हैं। शायद मैं आलसी हूँ, लेकिन मेरे लिए यह जानना आसान है कि मेरी साइट में अधिकतम और न्यूनतम 640px हैं। जब मैं पोस्ट लिख रहा होता हूं तो स्ट्रेचिंग गर्भधारण करना मुश्किल होता है।

      बस एक व्यक्तिगत प्राथमिकता मुझे लगता है!

  2. 3

    अनिवार्य रूप से, मैं आपके निष्कर्ष से सहमत हूं, लेकिन अगर मैं एक निश्चित चौड़ाई सेट-अप का उपयोग कर रहा हूं, तो मैं चौड़ाई को 960 पिक्सेल तक सीमित करता हूं।

    एक को वर्टिकल स्क्रॉल बार और दूसरे ब्राउज़र शॉर्टकट बार को देखना पड़ता है जो अतिरिक्त चौड़ाई लेते हैं। 960 पिक्सेल के भीतर रहकर, किसी को आश्वस्त किया जाता है कि 1024 पिक्सेल-चौड़ाई स्क्रीन रिज़ॉल्यूशन पर कोई बाएं से दाएं स्क्रॉल नहीं है।

    एंडी एबन

  3. 4
  4. 5

    बहुत अजीब। फ़ायरफ़ॉक्स में, आपकी साइट पर १०४ and में एक भयानक स्क्रॉलबार है, और जब तक आप १० ९ ० पर नहीं निकल जाते हैं, तब तक एक साफ़ नज़र नहीं आता है।

    Google रिज़ॉल्यूशन से महान आँकड़ों के लिए धन्यवाद

  5. 6

    चूंकि आपको अपना मिल गया है 1048px पर सेट, आपकी साइट 1024 स्क्रीन पर क्षैतिज स्क्रॉल बार बनाती है। मुझे लगता है कि आपके साइडबार और सामग्री क्षेत्र की चौड़ाई (और पैडिंग) से 100px दूर स्किम करना बेहतर होता, इसलिए यह 728×1024 पर फिट बैठता है। यही आज का सर्वोत्तम अभ्यास है।

    इसके खिलाफ एकमात्र मामला यह होगा कि यदि एनालिटिक्स संख्याएं इसका समर्थन करती हैं ... लेकिन चूंकि आपने अपने लेख में वह डेटा प्रदान नहीं किया है, तो मैं कहूंगा कि आप पृष्ठ का डिज़ाइन त्रुटिपूर्ण हैं।

  6. 7
  7. 8

    मुर्ख आदमी
    हर कोई पूरी स्क्रीन पर हर खिड़की का उपयोग नहीं करता है - वास्तव में, मैं दांव लगाऊंगा कि कुछ करें। 

    मेरे पास 80% विंडो में आपका ब्लॉग है ... और यह एक क्षैतिज स्क्रॉल बार है

    और क्या स्क्रीन बंद है ... देखते हैं ... कुछ भी नहीं।

    तो आपका स्क्रॉल बार व्यर्थ है।

    पाठकों को खोने का एक आसान तरीका !!

    • 9

      सामग्री पेज @ heenan73: disqus के भीतर केंद्रित है, पाठक को ठीक वही प्रदान करता है जिसकी उन्हें आवश्यकता है। अगर मैं पाठकों को खो रहा हूं, क्योंकि वे दोनों सामग्री देख सकते हैं और एक क्षैतिज स्क्रॉलबार देख सकते हैं ... निश्चित रूप से वे वे पाठक नहीं थे जिनकी मुझे तलाश है। हमारी सामग्री के भीतर निश्चित रूप से कुछ अनूठा है जो इसे 1217px तक धकेलता है इसलिए मैं इसे नीचे ट्रैक करने और इसे ठीक करने जा रहा हूं। यह पोस्ट वास्तव में पिछले विषय के बारे में लिखा गया था। इसे मेरे संज्ञान में लाने के लिए धन्यवाद!

तुम्हें क्या लगता है?

यह साइट स्पैम को कम करने के लिए अकिस्मेट का उपयोग करती है। जानें कि आपका डेटा कैसे संसाधित किया जाता है.