वेब पेज लेआउट तैयार करने के लिए 5 नियम

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



क्या आप डिजाइनर को इन सभी "एशटैमेल" और "त्सेज़" में जाने के बिना, अपनी कलात्मक श्रेणियों के साथ आगे सोचना जारी रखना चाहते हैं? लेआउट के लिए गुणवत्ता सामग्री के साथ लेआउट डिजाइनर प्रदान किया, जो लेआउट के समय और गुणवत्ता को प्रभावित करने वाले मुख्य कारकों में से एक है?



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



11/18/07। पहले, लेख को "वेब के लिए अच्छे डिजाइन के 5 नियम" कहा जाता था, लेकिन कुछ के लिए यह शीर्षक अवधारणाओं के विकल्प की तरह लग रहा था। यह लेख वेबसाइट डिज़ाइन के सौंदर्य संबंधी पहलुओं के बारे में नहीं है, बल्कि लेआउट के लिए डिज़ाइन तैयार करने के तकनीकी नियमों के बारे में है। उन सभी का शुक्रिया जिन्होंने मेरा समर्थन किया और जो लोग समझ गए थे कि मूल शीर्षक में क्या था।

नियम संख्या 1: ब्लॉक में जानकारी के गतिशील परिवर्तन को ध्यान में रखें।

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

नियम संख्या 2: पाठ एक अलग परत में होना चाहिए (रेखित नहीं)।

HTML डिजाइन करते समय, एनकोडर को पाठ के सभी गुणों (आकार, फ़ॉन्ट नाम, पत्र और लाइन रिक्ति, रेखा की ऊंचाई, आदि) को निर्धारित करने की आवश्यकता होती है। जब एक पाठ परत को रेखापुंज करते हैं, तो पाठ एक चित्र बन जाता है, जिसका अर्थ है कि यह ऊपर सूचीबद्ध सभी गुणों को खो देता है। चित्रा में, रेखापुंज पाठ का एक उदाहरण (गुणों के बारे में जानकारी गायब है)।

नियम संख्या 3: पाठ पर एंटी-अलियासिंग और धुंधलापन का उपयोग न करें।

दुर्भाग्य से, ब्राउज़र में से कोई भी इस संपत्ति का समर्थन नहीं करता है। इसलिए, यह देखने के लिए कि आपकी साइट पर क्या खींचा गया है, फ़ोटोशॉप में टेक्स्ट स्मूथिंग का उपयोग न करें (मान को 'कोई नहीं' पर सेट किया जाना चाहिए, यानी, बिना स्मूथ - चित्र देखें)। नियम उन चित्रों पर डिज़ाइन किए गए तत्वों पर लागू नहीं होता है जो चित्र होने की अपेक्षा करते हैं: लोगो, बैनर आदि।

नियम संख्या 4: केवल चित्रों के लिए कस्टम फ़ॉन्ट का उपयोग करें।

पाठ के लिए एक गैर-मानक फ़ॉन्ट का उपयोग करना (आंकड़ा देखें), आपको यह समझना चाहिए कि यह आगंतुक द्वारा स्थापित नहीं किया जा सकता है। इस मामले में, पाठ एक मानक फ़ॉन्ट (जो ब्राउज़र सेटिंग्स में परिभाषित किया गया है) में प्रदर्शित किया जाएगा। जैसा कि आपने योजना बनाई थी (आपके पास यह फ़ॉन्ट स्थापित है) सब कुछ आपके लिए प्रदर्शित किया जाएगा। उन तत्वों के लिए एक गैर-मानक फ़ॉन्ट का उपयोग करें जो साइट पर चित्र होंगे, अन्य मामलों में, विंडोज के साथ शामिल मानक फ़ॉन्ट का उपयोग करें।

कंप्यूटर पर एक उपयोगकर्ता के लिए एक फ़ॉन्ट डाउनलोड करना संभव है (हालांकि इसे अवरुद्ध किया जा सकता है) और sIFR तकनीक (लिंक के लिए लेव ईडिनोव के लिए धन्यवाद), हालांकि मैं इन दोनों तरीकों को स्थिर नहीं कह सकता। इससे मैं नियम नंबर 4 को अभी भी प्रासंगिक मानता हूं।

नियम संख्या 5: सभी डिजाइन तत्व स्वतंत्र परतों में होने चाहिए।

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



स्रोत: वेब विकास के बारे में ब्लॉग और इसे कैसे सुधारें।