ब्रेडक्रंब नेविगेशन सर्वश्रेष्ठ अभ्यास और उदाहरण

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

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

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

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

ब्रेडक्रंब प्रकार

पथ

पथ-आधारित ब्रेडक्रंब चरणों या पथ को इंगित करते हैं, एक उपयोगकर्ता ने किसी वेबसाइट के वर्तमान पृष्ठ पर पहुंचने के लिए लिया है। इसके अलावा, उपयोगकर्ताओं को उन पृष्ठों के लिंक दिखाई देंगे जो उन्होंने वर्तमान पृष्ठ पर पहुंचने के लिए पहले देखे हैं। ब्रेडक्रंब नेविगेशन के तीन प्रकारों में से, पथ-आधारित ब्रेडक्रंब नेविगेशन कम से कम ऑनलाइन लोकप्रिय है। कारण, पथ-आधारित ब्रेडक्रंब नेविगेशन के समान कार्यक्षमता प्रदान करता है “आगे” तथा “वापस” एक ब्राउज़र पर बटन। अधिकांश वेबसाइटों के लिए स्थान-आधारित और विशेषता-आधारित ब्रेडक्रंब नेविगेशन बेहतर कार्यक्षमता प्रदान करता है.

स्थान

स्थान-आधारित ब्रेडक्रंब उपयोगकर्ता को इंगित करते हैं जहां वर्तमान पृष्ठ वेबसाइट के पदानुक्रम में खड़ा है। इस प्रकार के ब्रेडक्रंब नेविगेशन को आमतौर पर दो स्तर से अधिक गहराई या सामग्री वाली वेबसाइटों पर देखा जाता है। वेबसाइट में आगे बढ़ने पर उपयोगकर्ताओं को पृष्ठों, या श्रेणियों के लिंक प्रदान किए जाते हैं, जो एक के रूप में कार्य करते हैं “माता-पिता” या वे वर्तमान में देख रहे हैं पृष्ठ से एक स्तर ऊपर। उदाहरण के लिए, उपयोगकर्ता हो सकता है “बोले” हालाँकि, पेज “हम क्या करते हैं” पेज इसका जनक है “बोले” पेज जबकि “होम” पेज इसका जनक है “हम क्या करते हैं” पृष्ठ.

Clearleft Ltd

गुण

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

Cars.com

ब्रेडक्रंब का उपयोग क्यों करें?

• महान प्रयोज्यता

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

• आराम से पीछे हटना

  प्राथमिक नेवीगेशन को डिज़ाइन नहीं किया गया है, पीछे की ओर ब्रेडक्रंब हैं। चूंकि बैकट्रैकिंग बहुत लोकप्रिय है, इसलिए ऑनलाइन अतिरिक्त सहायता प्रदान करना एक लंबा रास्ता तय कर सकता है.

• अतिरिक्त क्लिकों को हटा दें

  ब्रेडक्रंब उपयोगकर्ताओं का उपयोग करने के लिए बिना किसी वेबसाइट के एक स्तर से अगले तक कूदने की अनुमति देता है “आगे” या “पिछड़ा” ब्राउज़र पर बटन। इसके अतिरिक्त ब्रेडक्रंब उपयोगकर्ताओं को लगातार मुख्य नेविगेशन का सहारा लेने की आवश्यकता को समाप्त करते हैं.

• उपयोगकर्ता पदानुक्रम दिखाता है

  किसी वेबसाइट का प्राथमिक नेविगेशन साइट के भीतर हर पृष्ठ की पदानुक्रम को प्रतिबिंबित नहीं करेगा। उपयोगकर्ताओं को ब्रेडक्रंब देने से उन्हें वेबसाइट के भीतर एक पृष्ठ के पदानुक्रम को देखने की अनुमति मिलेगी.

• दृष्टि से प्रसन्न करना

  न केवल ब्रेडक्रंब उपयोगकर्ताओं को अतिरिक्त प्रयोज्य प्रदान करते हैं, वे पृष्ठ पर बहुत जगह या स्थान लेने के बिना ऐसा करते हैं। ब्रेडक्रंब आपकी वेबसाइट के दृश्य डिजाइन में लागू करना आसान है और उपयोगकर्ताओं को एक बड़ा लाभ प्रदान करता है.

• अतिरिक्त मदद प्रदान करता है

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

• कम उछाल दरें

  आमतौर पर ब्रेडक्रंब प्राथमिक नेविगेशन की तुलना में अधिक विस्तृत नेविगेशन प्रदान करेगा। ऐसा करने पर, उपयोगकर्ताओं को वेबसाइट पर नेविगेट करने के तरीके के बारे में अधिक विकल्प दिए जाएंगे। उन्हें वेबसाइट के भीतर कुछ स्तरों को आसानी से वापस ट्रैक करने का अवसर देने से आपकी उछाल दर कम होगी.

• ब्याज बनाता है

  जब कोई उपयोगकर्ता किसी वेबसाइट के आंतरिक पृष्ठ पर लैंड करता है तो वे पहले से ही रुचि के एक पृष्ठ पर होते हैं। ब्रेडक्रंब अतिरिक्त पृष्ठों की जानकारी प्रदान कर सकता है और इसकी जानकारी उपयोगकर्ता को बिना वर्ग एक से शुरू किए बिना भी रुचि रखता है.

ब्रेडक्रंब सर्वश्रेष्ठ अभ्यास

• पृष्ठ के शीर्ष पर ब्रेडक्रंब का उपयोग करें

  ब्रेडक्रंब के लिए सबसे आम और सहज प्लेसमेंट एक पृष्ठ के शीर्ष के भीतर है। यह उपयोगकर्ताओं को एक सटीक तरीके से ब्रेडक्रंब खोजने और तदनुसार उपयोग करने की अनुमति देता है.

• ब्रेडक्रंब का लगातार उपयोग करें

  यदि आप ब्रेडक्रंब का उपयोग करने का निर्णय लेते हैं, तो सुनिश्चित करें कि आप उन्हें अपनी पूरी वेबसाइट पर उपयोग करते हैं। उपयोगकर्ताओं को कुछ पेजों पर ब्रेडक्रंब देना और अन्य को केवल भ्रमित करना और उन्हें निराश नहीं करना चाहिए. (इसका एक प्रमुख उदाहरण अमेज़ॅन है क्योंकि वे व्यक्तिगत उत्पाद पृष्ठों से ब्रेडक्रंब हटाते हैं।)

• ब्रेडक्रंब को ग्रेसफुल तरीके से डीग्रेड करना चाहिए

  ब्रेडक्रंब को हमेशा होम पेज से शुरू करना चाहिए और वर्तमान पृष्ठ पर नीचा दिखाना चाहिए। ऐसा करने में आपके ब्रेडक्रंब को एक समय में उच्चतम स्तर से निम्नतम स्तर एक चरण तक जाने की आवश्यकता होती है.

• ब्रेडक्रंब को उचित रूप से सिलें

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

• पृष्ठ स्पष्ट रूप से वर्गीकृत करें

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

• स्पष्ट रूप से प्रत्येक स्तर को अलग करें

  सुनिश्चित करें कि उपयोगकर्ता प्रत्येक ब्रेडक्रम्ब स्तर के बीच अंतर को भेदने में सक्षम हैं। स्तरों के बीच सबसे आम विभाजक 'वर्ण' (>) से अधिक है। अन्य अच्छे विभाजकों में सही डबल एंगल कोटेशन (»), स्लैश (/), और तीर (→) शामिल हैं। यदि एक सादे पाठ चरित्र का उपयोग कर रहे हैं, केवल एक का उपयोग करें. (>> अधिक आकर्षक और प्रभावी है >>)

• सिंगल आउट करंट पेज

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

• वर्तमान पृष्ठ को लिंक न बनाएं

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

• पेज शीर्षक के रूप में ब्रेडक्रंब का उपयोग न करें

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

• ब्रेडक्रंब प्राथमिक नेविगेशन को प्रतिस्थापित नहीं करते हैं

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

ब्रेडक्रंब के महान उदाहरण

विट्रा डायरेक्ट

ट्रेक बाइक

Illy

SiteInspire

मिया और मैगी

Intridea

मनुष्य द्वारा डिजाइन

रॉक्सी

Blik

SitePoint

लक्ष्य

वॉल-मार्ट

1-800-फूल

सर्वश्रेष्ठ खरीद

अमेजन डॉट कॉम

बार्न्स और नोबल

जमीन का अंत

सेब

गूगल

पीछा

AbsolutePunk.net

लाइटमैन ब्रदर्स प्रकाश

Guardian.co.uk

क्षेत्र 17

Wufoo

मध्य टेनेसी की लड़की स्काउट्स

ग्लासगो कलेक्टिव

जेठा

बेल कनाडा

Grooveshark

Devlounge

लेखक के बारे में - शाय होवे वर्तमान में शिकागो, IL में रहने वाला एक पेशेवर वेब और उपयोगकर्ता इंटरफ़ेस डिज़ाइनर है। वह अपने ब्लॉग पर वेब डिज़ाइन के बारे में Letcounthedays पर लिखते हैं और ट्विटर पर आपसे सुनना पसंद करेंगे। कृपया बेझिझक उसे नमस्ते बताओ!