HTML की मूल बातें और विजुअल स्टूडियो कोड की स्थापना को समझने के बाद, अब एक वेबसाइट की मूल संरचना को समझने का समय है। इस ट्यूटोरियल में, हम केवल HTML पर ध्यान केंद्रित करेंगे। इसलिए, अब सीएसएस और जावास्क्रिप्ट के बारे में चिंता करने की कोई जरूरत नहीं है।
हमने पहले देखा है, विस्मयादिबोधक चिह्न लिखकर, हमें HTML कोड के पूरे बॉयलर टेम्पलेट मिलते हैं। यह हमारा समय बचाता है क्योंकि हमें टेम्पलेट कोड को मैन्युअल रूप से लिखने की आवश्यकता नहीं है। विजुअल स्टूडियो कोड का उपयोग करने का मुख्य कारण यह है कि यह कोड तह (HTML में विभिन्न वर्गों को कम से कम) की अनुमति देता है जो कभी-कभी भ्रम से बचने के लिए आवश्यक हो जाता है।
HTML कोड में कुछ खंड होते हैं जैसे DOCTYPE, मेटा टैग, हेड और बॉडी। सभी टैग जो हम एक HTML फ़ाइल में शामिल करते हैं, उन्हें पहले खोला जाना चाहिए और फिर कोणीय कोष्ठक द्वारा बंद करना होगा। आइए अब हम एक-एक करके अलग-अलग वर्गों को समझें।
- Doctype HTML- Doctype HTML यह बताता है कि यह एक HTML दस्तावेज़ है। इसलिए, हम ब्राउज़र को समझने के लिए विशेष रूप से परिभाषित कर रहे हैं कि यह एक HTML दस्तावेज़ है। दस्तावेजों के प्रकार के बारे में अधिक जानने के लिए, आप यहां जा सकते हैं।
- <html lang = "en"> - यह HTML टैग का शुरुआती हिस्सा है जो हमें बताता है कि दस्तावेज़ की भाषा अंग्रेजी में है।
- <head> - Head में सभी मेटा-टैग होते हैं जो किसी वेबसाइट की सामग्री का वर्णन करने के लिए उपयोग किया जाता है। मेटा का अर्थ है सूचना के बारे में जानकारी प्रदान करना। इसलिए, मेटा टैग का उपयोग हमारी वेबसाइट पर कीवर्ड और विवरण को परिभाषित करने के लिए किया जाता है। हेड में वेबसाइट का शीर्षक और सीएसएस और जावास्क्रिप्ट जैसी सभी बाहरी फाइलें होती हैं जिन्हें हम इससे लिंक करते हैं।
- <body> - इसमें वेबपृष्ठ की सभी सामग्री शामिल हैं। हालाँकि, शुरुआत में, हमारी वेबसाइट थोड़ी बदसूरत दिख सकती है लेकिन स्टाइलशीट को शामिल करने के बाद यह आकर्षक लगने लगेगी।
कभी-कभी हम एक विशेष बात लिखना चाहते हैं कि हम नहीं चाहते कि ब्राउज़र इसे कोड के हिस्से के रूप में ले। इसलिए, हम इसे इस प्रारूप में "<! - आपका पाठ ->" लिखकर टिप्पणियों में शामिल कर सकते हैं। हालाँकि, किसी भी पाठ को टिप्पणियों में बदलने के लिए एक शॉर्टकट है। आपको किसी भी ग्रंथ को टिप्पणियों में बदलने के लिए "Ctrl + / (आगे स्लैश)" दबाने की आवश्यकता है। टिप्पणियों को ब्राउज़र द्वारा पूरी तरह से अनदेखा किया जाता है और कोड में उन हिस्सों के रूप में माना जाता है जो डेवलपर अपनी समझ के लिए लिखते हैं। यह आवश्यक है क्योंकि समय-समय पर हमारे कोड लंबे हो जाएंगे और हम सब कुछ मिश्रण नहीं करना चाहते हैं। इसलिए, भविष्य में किसी भी चीज़ के संदर्भ में टिप्पणियां महत्वपूर्ण हो जाती हैं।
मेरा मानना है कि आप अब तक समझ गए होंगे कि किसी वेबसाइट का मूल ढांचा कैसा दिखता है। यदि आप स्टेप बाई स्टेप प्रक्रिया का पालन करते हैं तो आपको किसी भी प्रकार की कठिनाइयों का सामना नहीं करना पड़ेगा। अधिकतर, कोडिंग भाग निकाय अनुभाग के तहत किया जाएगा।
और यदि आपने अब तक प्लेलिस्ट को एक्सेस नहीं किया है, तो मैं प्लेलिस्ट के माध्यम से जाने का अनुरोध करता हूं क्योंकि यह सही जगह है जहां आपको वेब डेवलपमेंट से संबंधित सभी वीडियो हिंदी में मिलेंगे।
वीडियो में वर्णित / लिखे अनुसार कोड:-
<!-- This is doctype -->
<!DOCTYPE html>
<!-- Our HTML code starts here -->
<html lang="en">
<!-- Our Head tag starts here -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>This is title</title>
</head>
<!-- Our Body tag starts here -->
<body>
Yeh meri body ka content hai
</body>
</html>