HTML <div> एलिमेंट का उपयोग करना सीखें।
<div> एलिमेंट एक जेनेरिक कंटेनर एलिमेंट है जिसका उपयोग कंटेंट को विभाजित, समूहित और एनकैप्सुलेट करने के लिए किया जाता है।
आपको <div> एलिमेंट का उपयोग केवल तभी करना चाहिए यदि कोई सिमेंटिक HTML एलिमेंट संदर्भ के सापेक्ष उपयोग करने के लिए समझ में नहीं आता (या यदि आप सुनिश्चित नहीं हैं)।
सिमेंटिक मार्कअप तब होता है जब आप HTML एलिमेंट्स का उपयोग करते हैं जो आपके द्वारा अंदर रखे गए कंटेंट के अर्थ/कार्य का वर्णन करते हैं। <div> एलिमेंट एक जेनेरिक/अन-सिमेंटिक एलिमेंट है।
<div> एलिमेंट के उपयोग के मामले
मान लें कि आप अपनी वेबसाइट के लिए एक पुन: प्रयोज्य मॉडल कंपोनेंट कोड कर रहे हैं, जो आपके साइट विजिटर्स को आपके न्यूज़लेटर की सदस्यता लेने के लिए प्रोत्साहित करता है।
ऐसे कंपोनेंट को परिभाषित करने के लिए कोई पूर्व-मौजूदा सिमेंटिक HTML टैग नहीं है, इसलिए यह जेनेरिक <div> कंटेनर एलिमेंट का उपयोग करने का एक आदर्श उदाहरण है:
<div class="subscribe-modal"> <form id="contact" method="post" action=""> <fieldset> <h3>मेरे न्यूज़लेटर की सदस्यता लें</h3> <input name="email" id="email" type="email" placeholder="यहाँ अपना ईमेल पता दर्ज करें" required /> <input type="submit" name="submit" class="submit" value="सदस्यता लें!" /> </fieldset> </form> </div>
<div> टैग कंटेनर एलिमेंट्स को परिभाषित करने के लिए उपयोग किए जाने वाले कई HTML टैग्स में से एक है। कुछ सबसे अधिक उपयोग किए जाने वाले HTML कंटेनर एलिमेंट्स हैं:
<article>,<section>, <main> , <header>, <footer>,<form>।
यदि उपरोक्त कोई भी एलिमेंट आपके कंटेंट के लिए कंटेनर के रूप में उपयोग करने के लिए समझ में आता है, तो जेनेरिक <div> के बजाय उनका उपयोग करें।
क्यों? क्योंकि वे सभी सिमेंटिक एलिमेंट टैग्स हैं जबकि <div> एक अन-सिमेंटिक टैग है, जो कोई विशिष्ट संदर्भ प्रदान नहीं करता।
<div> एलिमेंट के बारे में जानने योग्य बातें
आप <div> एलिमेंट के अंदर किसी भी प्रकार का कंटेंट डाल सकते हैं।
हालांकि सिमेंटिक मार्कअप आम तौर पर अनुशंसित है, लेकिन ब्राउज़र्स के लिए आपके पेज को समझना और यूजर को रेंडर करना आवश्यक नहीं है।
हालांकि, यदि आप उन स्थितियों में जेनेरिक/अन-सिमेंटिक HTML एलिमेंट्स का उपयोग करते हैं जहां HTML में पहले से ही आपके उपयोग के लिए सिमेंटिक टैग्स हैं, तो यह आपके SEO को नुकसान पहुंचा सकता है।
आम तौर पर, मैं <div> एलिमेंट का उपयोग करूंगा यदि मुझे यकीन नहीं था कि किस HTML एलिमेंट का उपयोग करना है क्योंकि मैं गलत एलिमेंट के बजाय एक जेनेरिक एलिमेंट का उपयोग करना पसंद करूंगा। इसके अलावा, तकनीकी दृष्टिकोण से आप <div> एलिमेंट का वास्तव में गलत उपयोग नहीं कर सकते — केवल सिमेंटिक दृष्टिकोण से।