मॉकअप में वेबसाइट की चौड़ाई के लिए एक मानक आकार है? वह आकार क्या है? क्यूं कर?
जवाबों:
मैं अपने ज्यादातर मॉकअप 1200px चौड़े शुरू करता हूं, जबकि मैं 1024px रिज़ॉल्यूशन के लिए डिज़ाइन कर रहा हूं। मैं 1000px के लिए मॉकअप के भीतर गाइड सेट करता हूं। ऊँचाई भिन्न हो सकती है। मेरे मॉकअप फ़ाइल को व्यापक बनाने का कारण यह है कि यह देखने के लिए कि इसके चारों ओर सांस लेने के कमरे के साथ डिजाइन कैसा लगता है। अधिकांश लोग इन दिनों 1024px से अधिक का उपयोग करते हैं।
क्या वेब पेज मॉकअप डिजाइन करने के लिए एक मानक चौड़ाई है?
हां नहीं शायद?
एक बार (नीचे देखें) वेब डिज़ाइन ने बड़े पैमाने पर एक ऐसा दृश्य बनाने का प्रयास किया जो अधिकांश स्क्रीन पर यथोचित रूप से फिट हो। पिछले पांच वर्षों में, यह उत्तरदायी वेब डिज़ाइन (RWD) को अपनाने के साथ काफी बदल गया है।
RWD एक तरह से डिज़ाइन बनाने का एक डिज़ाइन सिद्धांत है जो उन्हें डिवाइस के आकार की परवाह किए बिना किसी भी डिवाइस पर यथोचित रूप से फिट होने की अनुमति देता है।
वेब विकास में, मीडिया के प्रश्नों का उपयोग अक्सर कई कारकों के आधार पर शैलियों के विभिन्न सेटों को वेब पृष्ठों पर लागू करने के लिए किया जाता है। कुछ सामान्य कारकों में शामिल हैं:
क्योंकि शैलियों को विशिष्ट स्क्रीन आकारों के लिए लक्षित किया जा सकता है, इसलिए विशिष्ट श्रेणियों को लक्षित करने वाले डिज़ाइनों के कई सेट बनाना असामान्य नहीं है।
स्पष्ट होने के लिए, कोई सेट "मानक" नहीं हैं। कोई शासी निकाय या संस्था नहीं है जो कहती है कि "डिजाइनरों को इन साइज़िंग दिशानिर्देशों के अनुसार डिज़ाइन बनाना चाहिए", क्योंकि अंत में यह एक निर्णय कॉल है।
वेब विकास उद्योग ने आम तौर पर बार-बार होने वाले आम ब्रेकपॉइंट के एक सेट के साथ कहा है।
विशिष्ट विराम बिंदु वर्तमान स्क्रीन चौड़ाई के लिए हैं, और आमतौर पर हैं:
इकाइयों में px
इन विशिष्ट संख्याओं का कारण सुंदर सांसारिक हैं। मूल iPhone में 320 × 480 के आयामों के साथ एक स्क्रीन थी; मूल iPad में 768 × 1024 के आयामों के साथ एक स्क्रीन थी; बड़े स्क्रीन रिज़ॉल्यूशन के लिए 1600 × 1200 आम हैं।
हालांकि, कुछ या सभी ब्रेकप्वाइंट पर मॉकअप देखना आम बात है, यह एक विशेष पृष्ठ के कई रेंडरिंग प्रदान करने की आवश्यकता भी है जो मध्यवर्ती डिजाइन विभक्ति अंक दिखाते हैं।
एक द्रव-चौड़ाई COMP जो 768px चौड़ी पर स्टैक्ड आइटम दिखाता है, को 900px के लिए एक डिज़ाइन शामिल करने की आवश्यकता हो सकती है जहाँ आइटम दो स्तंभों में बदल गए हैं। यदि आप पाते हैं कि आपको इन मध्यस्थ ब्रेकपॉइंट्स के लिए कई डिजाइन प्रदान करने की आवश्यकता है, तो मैं अत्यधिक व्यक्तिगत घटकों को डिजाइन करने और ब्रेकपॉइंट्स दिखाने की सलाह दूंगा जहां एक घटक प्रति-घटक आधार पर बदलता है, मॉकअप में पेज के बाकी हिस्सों को शामिल किए बिना।
यह सामान्य डिज़ाइन नुकसान से बचने में भी मदद करता है जहां विशिष्ट UI घटक गायब हो जाते हैं या ब्रेकप्वाइंट के बीच बधाई नहीं होते हैं।
इस उत्तर का पुराना संस्करण निम्नलिखित है जिसे मैं पोस्टीरिटी की खातिर रख रहा हूं, लेकिन यह कुछ समय के लिए प्रासंगिक नहीं है
मुझे आश्चर्य है कि किसी ने भी अभी तक इसका उल्लेख नहीं किया है:
Google के पास एक अच्छा विकास उपकरण है जिसे कहा जाता है
यह बहुत ही अकेले अपने सवाल का जवाब देना चाहिए।
मेरे पास वर्तमान रुझानों पर कुछ नोट हैं:
वर्तमान में उपयोगकर्ताओं के विशाल बहुमत में 1024x600 (टैबलेट / नेटबुक) या बड़े के संकल्प हैं। आपको 24pxस्क्रॉल बार के बारे में निकालने के लिए याद रखना होगा , जो एक अच्छा 1000px चौड़ाई छोड़ता है। ऊंचाई के लिए: वेब उपयोगकर्ता लंबवत स्क्रॉल करने में बहुत अच्छे हैं, क्योंकि वे चूहों पर पहियों को स्क्रॉल करने के आदी हो गए हैं। प्रारंभिक ऊंचाई ज्यादातर प्रथम-छापों के लिए महत्वपूर्ण है।
उपयोगकर्ता क्षैतिज रूप से स्क्रॉल करने में बहुत अच्छे नहीं हैं, इसलिए 1000px से अधिक चौड़े लेआउट बनाने की अनुशंसा नहीं की जाती है।
इसके अलावा बड़ी स्क्रीन के साथ कई उपयोगकर्ताओं को अपने पूरे स्क्रीन का उपयोग नहीं करते अपने वेब ब्राउज़र के लिए। विशेष रूप से अब जब विंडोज 7 में आधी स्क्रीन पर एक विंडो को छोड़ने के लिए सरल ड्रैग-एन-डॉक कार्यक्षमता शामिल है।
संक्षेप में:
संक्षिप्त उत्तर: 800x600 के लिए 775x400, और 1024x768 के लिए 1000x500 का उपयोग करें।
दीर्घ उत्तर: आप कभी भी यह सुनिश्चित नहीं कर सकते हैं कि आपकी प्रस्तुति आपके क्लाइंट कंप्यूटर पर सही लगेगी (इसमें एक अलग ऑपरेटिव सिस्टम, ब्राउज़र, एक अलग कैलिब्रेटेड मॉनिटर या बड़े फ़ॉन्ट के साथ कम रिज़ॉल्यूशन बेहतर पढ़ने के लिए व्यवस्थित हो सकता है)। इस कारण से मैं अपने कंप्यूटर पर हमेशा प्रस्तुति दिखा सकता हूं यदि मैं कर सकता हूं।
अगर मैं इसे अपने पीसी पर आकार के मामले में नहीं दिखा सकता हूं तो मैं अपने व्यक्तिगत नियमों का उपयोग करता हूं (अपने माप को पवित्र के रूप में न लें, हर किसी के पास यह है:
सुरक्षित आकार के रूप में यह 800x600 के लिए अच्छा अनुकूलन है (स्क्रॉलबार और टॉपबार को हटाकर मैं 775x400 का उपयोग "लाइन के ऊपर" के रूप में करता हूं)। लेकिन अब व्यापक मानक के साथ अधिक सस्ती स्क्रीन के साथ मैंने 1024x768 (1000x500) के लिए डिज़ाइन करना शुरू किया
यह महत्वपूर्ण है कि ऊंचाई के लिए नहीं बल्कि चौड़ाई के लिए इसका अनुकूलन किया जाए। ऊँचाई यह एक माउस के साधारण स्क्रॉल के साथ हल करने योग्य है, अगर आपके पास मैक माउस नहीं है तो आप अधिक जानकारी देखने के लिए क्षैतिज रूप से स्क्रॉल नहीं कर सकते हैं। हालांकि यह जानना अच्छा है कि अधिक या कम स्क्रीन की निचली रेखा को किस स्थान पर रखा जा सकता है, भले ही इसका सटीक निर्धारण करना असंभव हो।
नोट: मैं 1000px पर भी इतनी कम ऊंचाई का उपयोग करता हूं क्योंकि लोगों को मूल ब्राउज़र (जैसे उदाहरण के लिए GoogleRank, और कई अन्य) पर बहुत सारे अतिरिक्त स्क्रॉल करने की आवश्यकता होती है, इसलिए मैं हमेशा सबसे खराब स्थिति के लिए डिजाइन करना पसंद करता हूं।
मेरे बुरे अंग्रेजी के लिए पीएस सॉरी :)
हमारे पास एक ट्रैकिंग कार्यक्रम है जो हमें हमारे उपयोगकर्ताओं के बारे में जानकारी बताता है। आधे से अधिक 1024x768 पर हैं। इसलिए मैं इसे "मानक" मॉनिटर आकार के रूप में उपयोग करता हूं।
हालाँकि, यह आपकी साइट के लिए आपका लाइव क्षेत्र नहीं है - लोगों के पास साइडबार हैं, वे हमेशा ब्राउज़र विंडो पूरी चौड़ाई नहीं खोलते हैं, आदि।
मुझे 960 ग्रिड सिस्टम पसंद है । नंबर लचीले हैं और वेबसाइट डाउनलोड करने के लिए बहुत सारे टेम्पलेट प्रदान करती है। मैं अपने मॉकअप के लिए इसका उपयोग करता हूं, और हर कोई अब तक बहुत खुश है।
मुझे बैक अप लेने के लिए आँकड़े देखने होंगे (जैसे कि यह एसओ ब्लॉग पोस्ट ), लेकिन 1024x768 ने स्क्रीन रिज़ॉल्यूशन के लिए मानक आम भाजक के रूप में लिया या लिया है। मैं 1000 px की चौड़ाई के साथ सामान्य दर्शकों के लिए वेब मॉकअप को स्क्रॉल करता हूं और 1024 px की चौड़ाई के साथ रिज़ॉल्यूशन के साथ स्क्रॉल और विंडो सीमाओं के लिए खाता हूं। अधिक विशिष्ट श्रोताओं के लिए, पक्का का अपनी टिप्पणी में अधिकार। पता लगाएँ कि लक्षित दर्शकों के लिए आदर्श क्या है।
ब्राउज़र आकार आज एक मुश्किल सवाल है क्योंकि लोग दो प्रकार के उपकरणों का उपयोग कर रहे हैं, उच्चतर और उच्च रिज़ॉल्यूशन वाले कंप्यूटर और अपेक्षाकृत कम रिज़ॉल्यूशन वाले फ़ोन।
यदि आप आज अधिकांश कंप्यूटरों की तुलना में एक साइट बनाने जा रहे हैं (सबसे अधिक 90% या अधिक) का न्यूनतम रिज़ॉल्यूशन 1024 है। यदि आप थोड़े कम कंप्यूटर चाहते हैं, लेकिन अभी भी 1200 की तुलना में अच्छा प्रतिशत उस सीमा में है।
यदि आप एक मोबाइल साइट बना रहे हैं, तो अधिकांश फोन क्षैतिज ब्राउज़िंग के लिए 480px पर अधिकतम हो जाते हैं, लेकिन उनमें से अधिकांश में बड़ी साइटों के लिए किसी प्रकार का रेंडरिंग सिस्टम भी होता है।
आकार के लिए सवाल आपके अपने दर्शकों के बारे में है, यदि आपका लक्ष्य डिजाइनरों का एक समूह है, तो आपके पास एक बड़ी साइट हो सकती है, अगर यह मध्यम आयु वर्ग के लोग नई कार बीमा की तलाश में हैं, तो आपको थोड़ा छोटा काम करना चाहिए, और यदि यह फोन के लिए है उपयोगकर्ताओं को अपने फोन पर देखने के लिए, अभी भी छोटे।
यह पूरी तरह से आपकी वेबसाइट पर निर्भर करता है, एक नियम के रूप में, मैं पुराने मशीनों पर उन ग्राहकों के लिए 1000 से अधिक नहीं जाना चाहूंगा। हालाँकि अध्ययन अब दिखा रहे हैं कि 1200 के लिए डिज़ाइन करना अब डिज़ाइन की दुनिया में स्वीकार्य है, इसलिए यह निश्चित रूप से विचार के लिए भोजन है।
आपकी योजना सबसे कम आम भाजक को हिट करने की होनी चाहिए और अगर ऐसा होता है जो 800x600 विंडोज 95 मशीन पर जो डायनासोर होता है, तो वह है जिसे आपको पूरा करना चाहिए।
इसके अलावा यह पूरी तरह से आपकी वेबसाइट के डिजाइन पर निर्भर करता है। मैं वर्तमान में अपनी एजेंसी के लिए एक वेबसाइट डिजाइन कर रहा हूं और यह 800 की चौड़ी होने जा रही है, यह वरीयता के लिए है, किसी को पूरा करने के लिए नहीं।
दुर्भाग्य से कोई मानक आकार नहीं है क्योंकि वेबपेज अब कई डिस्प्ले में एक्सेस किए गए हैं। हालांकि अधिक सुरक्षित होने के लिए, कृपया सबसे लोकप्रिय प्रस्तावों (उदाहरण के लिए, 1024x768) और लोकप्रियता के आधार पर डिजाइन पर शोध करें।
उत्तर है: नहीं, कोई 'मानक' नहीं है।