एक वेब संरचना में पदानुक्रम के उदाहरण
वेबसाइट के लेआउट आरेख के बगल में एक कॉर्पोरेट संगठनात्मक चार्ट रखें, और आपको दो दस्तावेजों के बीच एक उल्लेखनीय समानता मिल सकती है। व्यवसाय, सरकारें और अन्य संस्थाएँ अक्सर वही पदानुक्रमित लेआउट पैटर्न का उपयोग करती हैं जो वेबसाइटें करती हैं। उदाहरण के लिए, एक निगम के सीईओ एक पदानुक्रमित मॉडल के शीर्ष पर बैठ सकते हैं, उसी तरह एक होम पेज वेबसाइट मॉडल के शीर्ष पर रहता है। प्रभावी रूप से डिज़ाइन की गई पदानुक्रम वे साइटें बनाती हैं, जिन्हें लोग देखना पसंद करते हैं।
वेबसाइट संरचनाएं
"वेब स्टाइल गाइड" नोट के लेखक के रूप में, "आपकी वेबसाइट के संगठन की सफलता काफी हद तक निर्धारित की जाएगी कि आपकी साइट की सूचना वास्तुकला आपके उपयोगकर्ताओं की अपेक्षाओं से कितनी अच्छी तरह मेल खाती है।" यदि लोगों को आपकी साइट पर घूमना आसान लगता है, तो वे इसकी समीक्षा करने में अधिक समय व्यतीत हो सकता है। उनके लिए यह करना आसान है कि साइट को एक तार्किक और अनुमानित लेआउट देना है, ताकि आगंतुक साइट के मदद दस्तावेज के बिना वेब पृष्ठों के माध्यम से नेविगेट कर सकें।
पिरामिड दृष्टिकोण
यह एक पिरामिड के रूप में एक वेबसाइट के बारे में सोचने में मदद कर सकता है। पिरामिड के शीर्ष पर साइट का पहला स्तर है, होम पेज है। एक प्रभावी पदानुक्रम में सामान्य जानकारी और लिंक होते हैं जो अन्य वेब पृष्ठों को इंगित करते हैं जिनमें अधिक विस्तृत जानकारी होती है। वे पृष्ठ मुख पृष्ठ के नीचे दिखाई देते हैं और पदानुक्रम में साइट का दूसरा स्तर बन जाते हैं। एक मूल साइट को केवल दो स्तरों की आवश्यकता हो सकती है, और एक होम पेज पर केवल "इस बारे में", "उत्पाद" और "जुड़ें" जैसे पृष्ठों के लिए लिंक हो सकते हैं। साइट आगंतुकों को वापस लाने का एक अच्छा तरीका देना हमेशा एक अच्छा विचार है। किसी भी पृष्ठ से होम पेज, जैसे कि होम पेज पर इंगित करने वाले हर पेज पर एक लिंक, बटन या मेनू आइटम शामिल है।
स्तर तीन और परे
Whitehouse.gov एक साइट का एक उदाहरण है जिसमें कई स्तर होते हैं जो एक जटिल पदानुक्रम बनाते हैं। होम पेज सरल है, लेकिन आप होम पेज से साइट पर किसी अन्य पेज पर पहुंच सकते हैं। इस प्रकार की पदानुक्रम कई स्तरों तक विस्तारित हो सकती है, जहां निचले स्तर उच्च स्तरों की तुलना में अधिक विवरण प्रदान करते हैं। तीन-स्तरीय पदानुक्रम का एक अच्छा उदाहरण एक पुस्तक समीक्षा साइट है। मुख पृष्ठ, एक स्तर पर, सामान्य जानकारी के साथ-साथ एक समीक्षा पृष्ठ पर इंगित करने वाले लिंक प्रदान कर सकता है। वह पृष्ठ, जो दूसरे स्तर बनाता है, उसमें पुस्तकों की सूची हो सकती है। जब आप किसी पुस्तक पर क्लिक करते हैं, तो "वॉर एंड पीस" नामक एक अन्य पृष्ठ उस पुस्तक की समीक्षा दिखा सकता है। यह पृष्ठ साइट के तीसरे स्तर पर होगा। यदि आप इस पदानुक्रम को आरेखित करते हैं, तो जिस तरह से आप एक ऑर्ग चार्ट बनाते हैं, आप शीर्ष पर एक बॉक्स बनायेंगे और उसमें "होम पेज" लिखेंगे। फिर आप "होम पेज" बॉक्स के नीचे अपना "रिव्यू" बॉक्स खींच सकते हैं और "होम पेज" बॉक्स के नीचे "वॉर एंड पीस" बॉक्स जोड़ सकते हैं।
पदानुक्रम दिखाने के लिए शीर्षकों का उपयोग करना
वेबसाइट पर पृष्ठों को व्यवस्थित करने के अलावा, आप पदानुक्रमित संबंधों को दिखाने के लिए पृष्ठ की सामग्री को व्यवस्थित कर सकते हैं। उदाहरण के लिए, हेडिंग लोगों को एक रूपरेखा के रूप में जानकारी प्रस्तुत करने में सक्षम बनाता है जो पचाने में आसान है। HTML कई हेडिंग टैग प्रदान करता है, जैसे h1, h2 और h2, जो किसी वेब पेज पर पदानुक्रम जोड़ने में आपकी सहायता कर सकते हैं। उदाहरण के लिए, आप पृष्ठ के प्रमुख शीर्षक और "उत्पाद" नामक एक अनुभाग के लिए एक छोटे h2 टैग के रूप में एक बड़े h1 टैग का उपयोग कर सकते हैं। फिर आप अपने उत्पादों का वर्णन करने वाले उप-उत्पाद बनाने के लिए उत्पादों के नीचे एक h3 टैग जोड़ सकते हैं। आपके पास अपने पृष्ठ में बुलेटेड सूचियों को जोड़ने का विकल्प भी है। इन सभी तत्वों को मिलाकर, आप एक विज़ुअल रूपरेखा बनाते हैं जिसे साइट विज़िटर एक नज़र में समझ सकते हैं।