HTML हेडिंग एलिमेंट्स को समझना: आधुनिक वेब डेवलपमेंट के लिए सेमेंटिक हायरार्की बनाना
HTML हेडिंग्स मौलिक तत्व हैं जो वेब कंटेंट को संरचित करते हैं, इसे उपयोगकर्ताओं और सर्च इंजन दोनों के लिए सुलभ बनाते हैं। छह अलग-अलग हेडिंग स्तरों (H1 से H6 तक) के साथ, वेब डेवलपर्स संगठित, पदानुक्रमित कंटेंट बना सकते हैं जो उपयोगकर्ता अनुभव को बढ़ाता है और सर्च इंजन ऑप्टिमाइजेशन में सुधार करता है।
00:12में आपका स्वागत है इस विडियो में हम जानेंगे HTML heading आए हैडलाइन तत्वों की खोज करें वेबसाइटे अकसर कई हैडलाइन मुख्य शीर्शक और उपशीर्शक प्रदर्शित करती हैं जो HTML जैसे उपकरणों से संग्रचित हैं लंबे पार्ट में हैडलाइन तत्व प
00:42पर ये headline तत्व क्लिक करने योग्य सामगरी शीर्शक के रूप में कार्य करते हैं जो उपयोग करताओं को और विवरन देखने के लिए मार्ग दर्शन करते हैं
00:51headline तत्व हर जगह मौजूद है आए HTML तत्वों को शीर्शक headline चेहनित करने के लिए देखें
00:59शीर्शकों के लिए केवल एक तत्व नहीं है चेह हैं H1, H2, H3, H4, H5 और H6 आएए देखें कि ये ब्राउजर में कैसे प्रदर्शित होते हैं
01:12आप देख सकते हैं कि प्रतेक H1 से H6 शीर्शक ब्राउजर में अलग द्रिश्य प्रभाव डालता है
01:19पदानुक्रम की ये अवधारनाए गैर द्रिश्य विधियों पर भी लागू होती हैं जिससे ब्राउजर पेज की संग्रचना को समझ और व्यक्त कर पाते हैं
01:28H1 तत्व सबसे बड़ा, सबसे प्रभावशाली और प्रमुक शीर्शक है
01:33इसके विपरीत H6 तत्व सबसे छोटा, सबसे सूक्ष्म और कम से कम प्रमुक उपवपवप शीर्शक है
01:40जिसमें H2, H3, H4 और H5 महत्व और द्रिश्य वजन के क्रम में बीच में आते हैं
01:48कुछ पहलूँ में, HTML, शीर्शक तत्वों का उप्योग काफी सरल और समझने में आसान है
01:54विशिष्ट सामगरी के लिए उचित शीर्शक स्तर चने
01:58प्रारंब में उदघाटन टैग, जैसे H1, डाले और अंत में समापन टैग डाले
02:04हालांकि यह निर्धारित करना कठिन हो सकता है कि विभिन्न संदर्भु में
02:09H1, H2, H3, H4, H5 या H6 में से कौन सा शीर्शक स्तर उप्योग करना है
02:17आईए एक व्याभारिक उदाहरन देखें
02:20मेरे पास कई पार्ठ अनुछेद हैं
02:23प्रतेक पी टैग से चेहनित जिनके पहले दो शीर्शक है
02:27पहला शीर्शक H1 टैग से चेहनित है और दूसरा H2 टैग से
02:33सभी HTML में संरचित
02:35द्रिश्य रूप से H1, H2 से बड़ा दिखता है
02:40H1 मुख्य शीर्शक है और H2 इस सामगरी का उप्शीर्शक है
02:45जब हम CSS पैनल पर जाते हैं
02:49तो हम पहले से तयार CSS शैलिया लागू कर सकते हैं
02:54जिससे हम आधुनिक द्रिश्य डिजाइन देख सकते हैं
02:57बिना CSS के HTML पुराने वेब सौंदर्य जैसा दिखता है
03:03पर भ्रमित नहों
03:04हर वेबसाइट CSS का उप्योग करती है ताकि
03:08H1 और H2 जैसे HTML तत्व डिजाइनर की द्रिश्य द्रिश्टी के अनुसार दिखें
03:15हम केवल द्रिश्य रूप के आधार पर शीर्शक स्तर नहीं चनेंगे
03:20इसके बजाए हम HTML संरचना में इसके अर्थगत महत्व के आधार पर निर्णे लेंगे
03:26यह तारकिक है कि हमने मुख्य शीर्शक को H1 और उप शीर्शक को अगले स्तर H2 के रूप में निर्धारित किया
03:34आएए देखें कि New York Times अपने Dance section landing page को तीन स्तरों के HTML शीर्शकों के साथ कैसे संग्रचित करता है
03:43पेज का मुख्य शीर्शक, Dance, H1 शीर्शक के रूप में चेहनित है जो इसे प्रात्मिक फोकस बनाता है
03:50प्रतेक लेख शीर्शक, H2 शीर्शक के रूप में चेहनित है जो सभी लेखों के लिए X-Monster प्रदान करता है
03:58इसके अतिरिक छोटे की करशीर्शक जैसे Fall Preview, H3 शीर्शकों के रूप में कारे करते हैं जो सामगरी प्रकार को दर्शाते हैं
04:08हम देखते हैं कि कुछ लेख शीर्शक बड़े font में हैं, कुछ छोटे फिर भी सभी अर्थगत रूप से H2 है
04:15यह HTML का पदानुक्रमित तंत्र ब्राउजर को अर्थ प्रदान करता है, सामगरी के महत्व को सफष्ट करता है और सभी लेख शीर्शकों को H2 के रूप में एक्समान रखता है
04:26यह उन लोगों के लिए अत्यंत महत्वपूर्ण है, जो स्क्रीन रीडर के साथ वेब पेज नेविगेट करते हैं
04:33HTML, शीर्शक स्तरों, जैसे H1, H2 और H3 के साथ जान बूज कर पदानुकरम स्थापित करके, हम ध्वनी के माध्यम से साइट को खोजने के लिए एक आवशक श्रवन इंटर्फिस बनाते हैं
04:46हो सकता है कि हमारी टीम के सहयोगियों ने प्रतेक शीर्शक स्तर के लिए उपयोग के मामले पहले से निर्धारित किये हों और हमें उनकी सलाह का पालन करना चाहिए
04:55कई बड़ी टीमें अब डिजाइन सिस्टिम बनाये रखती हैं जिसका पालन करने पर वेब साइट में अधिक एक रूपता और अर्थकत स्पश्टता आती है
05:03जब हम अपनी टीम या स्वयं के लिए ऐसा सिस्टिम बना रहे हैं तो यह बहुत फाइदेमंद है कि हम कुछ समय यह योजना बनाने में लगाए कि हम पूरे वेब साइट में
05:14HTML, शीरशक स्तरो, H1, H2, H3, H4, H5 और H6 का उपयोग कैसे करेंगे
05:23हमारे पास इन 6 शीरशक स्तरों को लागू करने का काफी लचीलापन है
05:28कोई कठोर सूत्र नहीं है, हमारा लक्ष इन 6 स्तरों का उपयोग करके शीरशकों में स्पश्टर्थगत पदानुकरम स्थापित करना है