साइट डिजाइन के नमूने

विषयसूची:

साइट डिजाइन के नमूने
साइट डिजाइन के नमूने
Anonim

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

आकर्षण प्रभाव

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

आइए ट्रेडिंग प्लेटफॉर्म दो साइटों का उदाहरण देखें:

उदाहरण साइटें
उदाहरण साइटें

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

रंग धारणा

रंग चुनते समय मुख्य नियम इसे ज़्यादा नहीं करना है। कभी-कभी दो या तीन सही ढंग से चयनित रंग भी पर्याप्त से अधिक होते हैं, इसका एक ज्वलंत उदाहरण fb.ru साइट है। कई वेब डिज़ाइनर अपनी html साइट डिज़ाइन करने के लिए "सुरक्षित" रंगों की तालिका का उपयोग करते हैं।

सुरक्षित रंगों की तालिका
सुरक्षित रंगों की तालिका

सुरक्षित इसलिए कहा जाता है कि यहां प्रदर्शित सभी रंग बिल्कुल सभी उपयोगकर्ताओं द्वारा एक ही तरह से प्रसारित किए जाएंगे। साइट पर डिज़ाइन बनाते समय इन रंगों को मानक कहा जा सकता है।

रंग अनुकूलता

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

पूरक रंग संयोजन
पूरक रंग संयोजन

टी. यानी वृत्त के अंदर का विपरीत रंग सबसे अनुकूल माना जाता है। यदि आपको 3 मिलान वाले रंगों का चयन करने की आवश्यकता है, तो रंग चक्र का भी उपयोग किया जाता है, केवल रंग व्यवस्था रेखा पहले ही बदली जाएगी।

त्रय - 3 रंगों का संयोजन
त्रय - 3 रंगों का संयोजन

और ऐसी कई मंडलियां हैं, आप अधिक मिलान वाले रंग चुन सकते हैं। उदाहरण के लिए, चार।

टेट्राद - चार रंगों का संयोजन
टेट्राद - चार रंगों का संयोजन

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

आंतरिक साइट संरचना

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

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

सबसे बड़ी गलती

औसत विश्लेषण के अनुसार, जो उपयोगकर्ता 15-30 सेकंड के भीतर साइट पर आवश्यक अनुभाग या जानकारी नहीं ढूंढ पाता है, वह मानता है कि यह अनुभाग या जानकारी साइट पर नहीं है और संसाधन छोड़ देता है। ज्यादातर मामलों में हमेशा के लिए। भयानक नेविगेशन वाली साइट का एक प्रमुख उदाहरण:

खराब साइट नेविगेशन
खराब साइट नेविगेशन

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

पंजीकरण फॉर्म

साइट पर एक और महत्वपूर्ण और भयावह कारक पंजीकरण फॉर्म है। कुछ लोग पंजीकरण विंडो में लगभग परदादा-दादी का डेटा एकत्र करने का प्रयास करते हैं।

गलत पंजीकरण फॉर्म
गलत पंजीकरण फॉर्म

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

सही पंजीकरण फॉर्म
सही पंजीकरण फॉर्म

यदि यह जानकारी पर्याप्त नहीं भी है, तो कोई भी बाद में आगंतुक से पंजीकरण प्रक्रिया के बाद अनुरोध करने की जहमत नहीं उठाता। इस दृष्टिकोण को पंजीकरण फॉर्म की तुलना में अधिक वफादार और मैत्रीपूर्ण माना जाता है, जो कि नौकरी आवेदन पत्र की तरह है।

वेबसाइट टेम्पलेट

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

यह उन संपूर्ण इंटरनेट पोर्टलों का भी उल्लेख करने योग्य है जो उनके आधार पर आपकी अपनी वेबसाइट को परिनियोजित करने की पेशकश करते हैं। इस मामले में, पक्ष और विपक्ष दोनों हैं:

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

अंतिम भाग

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

सिफारिश की: