HTML भाषा का विवरण. HTML भाषा का संक्षिप्त विवरण HTML भाषा और उसका उपयोग

HTML भाषा की बुनियादी संरचनाएँ.

HTML (हाइपरटेक्स्ट मार्कअप लैंग्वेज) - उस ब्राउज़र के लिए विशेष निर्देश जिसके साथ वेब पेज बनाए जाते हैं।

अर्थात्, वेब पेज HTML प्रारूप में दस्तावेज़ होते हैं जिनमें टेक्स्ट और विशेष HTML टैग (डिस्क्रिप्टर) होते हैं। कुल मिलाकर, HTML टैग टेक्स्ट को प्रारूपित करने के लिए आवश्यक हैं (यानी, इसे वांछित स्वरूप दें) जिसे ब्राउज़र "समझता है।" HTML दस्तावेज़ों को एक्सटेंशन वाली फ़ाइलों के रूप में संग्रहीत किया जाता है। एचटीएम या. html.

HTML टैग ब्राउज़र को वेब पेज की संरचना और स्वरूपण के बारे में जानकारी बताते हैं। प्रत्येक टैग में एक विशिष्ट निर्देश होता है और यह कोण कोष्ठक में संलग्न होता है। अधिकांश टैग में एक उद्घाटन और समापन भाग होता है और यह भीतर मौजूद पाठ को प्रभावित करता है।

HTML कोड से अधिक तेज़ी से परिचित होने के लिए, आप अपने पसंदीदा पेज को "HTML के रूप में" मोड में देख सकते हैं। ऐसा करने के लिए, ब्राउज़र में आपको मेनू आइटम "व्यू" - "एचटीएमएल के रूप में" का चयन करना होगा।

इसके बाद HTML कोड के सोर्स टेक्स्ट के साथ एक नई विंडो खुलेगी। तैयार HTML कोड को देखकर, आप सीखेंगे कि अधिक अनुभवी प्रोग्रामर द्वारा भाषा टैग का उपयोग कैसे किया जाता है। यह समय-समय पर उत्पन्न होने वाली विभिन्न समस्याओं को दूर करने का एक तरीका भी है।

वेब पेज कैसे बनाये जाते हैं

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

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

हाइपर-टेक्स्ट मार्कअप भाषा HTML सीखना बहुत आसान है। इसके अध्ययन की तुलना किसी भी भाषाई भाषा के अध्ययन से की जा सकती है। उदाहरण के लिए, यदि मूल इकाई में शब्द है, तो HTML में यह न्यूनतम इकाई टैग है। मूलतः, ये html वेब पेज मार्कअप भाषा में कमांड हैं। किसी भी वेब पेज, किसी भी साइट में टेक्स्ट, ग्राफिक्स आदि होते हैं और ये सभी खुशियाँ छोटे और अगोचर टैग द्वारा नियंत्रित होती हैं। टैग वे हैं जो पाठ और चित्रों को अर्थहीन गड़बड़ी के बजाय, एक कठोर संरचित संरचना बनाते हैं। यह टैग के लिए धन्यवाद है कि साइट पर पाठ विभिन्न आकारों और रंगों के साथ आगंतुक को प्रसन्न करता है; यह टैग ही हैं जो अद्भुत चित्रों को किसी भी स्क्रीन रिज़ॉल्यूशन और ब्राउज़र विंडो आकार में उनके लिए इच्छित स्थान पर खड़ा करने की अनुमति देते हैं। टैग की संभावनाएं अनंत हैं, उनकी संख्या बहुत बड़ी है

सख्त परिभाषा: टैग एक HTML तत्व है जिसमें कोण कोष्ठक में संलग्न पाठ होता है। टैग एक सक्रिय तत्व है जो इसके बाद आने वाली जानकारी की प्रस्तुति को बदल देता है। एक टैग में कई विशेषताएँ हो सकती हैं। आमतौर पर दो टैग का उपयोग किया जाता है - खोलना और बंद करना।

ब्राउज़र पर भेजे जाने वाले किसी भी HTML दस्तावेज़ में कुछ आवश्यक भाग शामिल होने चाहिए:

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

तो एक साधारण HTML दस्तावेज़ की संरचना कुछ इस तरह दिखती है:

HTML दस्तावेज़ संरचना

- दस्तावेज़ की शुरुआत

दस्तावेज़ का शीर्षक

दस्तावेज़ का मुख्य भाग

- दस्तावेज़ का अंत

HTML तत्व

अधिकांश, लेकिन सभी HTML टैग युग्मित नहीं होते हैं, ताकि एक प्रारंभिक टैग के बाद संबंधित समापन टैग हो, जिसके बीच में पाठ या अन्य टैग हों, उदाहरण के लिए:

प्रस्तावना

ऐसे मामलों में, दो टैग और उनके द्वारा अलग किए गए दस्तावेज़ का भाग एक ब्लॉक बनाते हैं जिसे HTML तत्व कहा जाता है। कुछ टैग, जैसे कि, स्वयं HTML तत्व हैं, और उनके लिए संबंधित अंतिम टैग गलत है। निम्नलिखित में, हम आवश्यक कोण कोष्ठक को छोड़कर, टैग को उनके नाम से संदर्भित करेंगे।

गुण

प्रत्येक टैग के लिए, कई संभावित विशेषताएँ परिभाषित की गई हैं। अधिकांश टैग एक या अधिक विशेषताओं की अनुमति देते हैं, लेकिन हो सकता है कि उनमें कोई विशेषता ही न हो। एक विशेषता विनिर्देश में निम्नलिखित क्रम में निम्नलिखित शामिल होते हैं:

विशेषता नाम, जैसे WIDTH, विशेषता मान का समान चिह्न (=), जो एक वर्ण स्ट्रिंग द्वारा निर्दिष्ट होता है, जैसे "80"।

सिंगल कोट्स ("80") या डबल कोट्स ("80") का उपयोग करके उद्धरणों में विशेषता मान संलग्न करना हमेशा एक अच्छा विचार है। किसी उद्धृत स्ट्रिंग में समान उद्धरण चिह्न नहीं होने चाहिए। इसलिए, यदि कोई तारीख दोहरे उद्धरण चिह्नों में संलग्न है, तो इसे बाद में संलग्न करने के लिए एकल उद्धरण चिह्नों का उपयोग करें, और इसके विपरीत। दोहरे उद्धरण चिह्नों को प्राथमिकता दी जाती है क्योंकि मानव आँख को एकल उद्धरण चिह्नों को उच्चारण चिह्न जैसे वर्णों से अलग करने में कठिनाई हो सकती है।

आप उन विशेषता मानों के उद्धरणों को भी छोड़ सकते हैं जिनमें केवल निम्नलिखित वर्ण शामिल हैं (नाम की तकनीकी अवधारणा देखें):

अंग्रेजी अक्षर (ए - जेड, ए - जेड) संख्याएं (0 - 9) समय अंतराल हाइफ़न (-)

तो WIDTH=80 और ALIGN=CENTER, WIDTH='80' और ALIGN='CENTER' के लिए कानूनी शॉर्टहैंड हैं। यूआरएल से लिंक करें, उदाहरण के लिए HREF=foo. htm स्वीकार्य है, हालाँकि, जब URL का उपयोग विशेषताओं के साथ किया जाता है तो इसे उद्धृत किया जाना चाहिए, उदाहरण के लिए HREF='http://www.hut.fi/'। कुछ ब्राउज़र ऐसे हैं जो लुप्त उद्धरणों या तत्वों को शुरुआती उद्धरणों और बिना समापन उद्धरणों की अनुमति देते हैं। हालाँकि, इस अभ्यास का उपयोग न करना ही बेहतर है।

पैराग्राफ, स्पेस कैरेक्टर, हेडिंग बनाना

वेब ब्राउज़र आमतौर पर उन न्यूलाइन वर्णों को ध्यान में नहीं रखते हैं जो उपयोगकर्ता द्वारा इसके गठन के चरण में पाठ में दर्ज किए जाते हैं। एक नया पैराग्राफ शुरू करने के लिए, एक टैग (टैग) का उपयोग करें

वेब ब्राउज़र विंडो में एक पेज खोलने के बाद, उसके टेक्स्ट के सभी पैराग्राफ को एक टैग (टैग) से चिह्नित किया जाता है

रिक्त रेखाओं द्वारा अलग किया गया, जिससे इसके लेआउट और स्वरूप में सुधार होता है।

डिफ़ॉल्ट रूप से, ब्राउज़र आमतौर पर बाएं संरेखण के साथ पैराग्राफ को प्रारूपित करता है। संरेखण को बाध्य करने के लिए, संरेखण विशेषता का उपयोग करें। इसकी सहायता से पैराग्राफ को बाएँ, दाएँ, मध्य तथा उचित रूप से संरेखित किया जा सकता है।

उदाहरण:

पैराग्राफ बायीं ओर संरेखित... अनुच्छेद दाईं ओर संरेखित है... अनुच्छेद मध्य संरेखित है... अनुच्छेद उचित है...

ब्राउज़र प्रदर्शन: पैराग्राफ संरेखित बाएँ पैराग्राफ संरेखित बाएँ पैराग्राफ पैराग्राफ संरेखित बाएँ पैराग्राफ पैराग्राफ संरेखित बाएँ पैराग्राफ पैराग्राफ संरेखित बाएँ पैराग्राफ पैराग्राफ संरेखित बाएँ पैराग्राफ पैराग्राफ संरेखित बाएँ पैराग्राफ पैराग्राफ संरेखित बाएँ पैराग्राफ पैराग्राफ संरेखित बाएँ पैराग्राफ पैराग्राफ संरेखित बाएँ पैराग्राफ पैराग्राफ संरेखित पैराग्राफ़ दाएँ पैराग्राफ़ से संरेखित, दाएँ पैराग्राफ़ से संरेखित, दाएँ पैराग्राफ़ से संरेखित, दाएँ पैराग्राफ़ से संरेखित, दाएँ पैराग्राफ़ से संरेखित, दाएँ पैराग्राफ़ से संरेखित, दाएँ पैराग्राफ़ से संरेखित, दाएँ पैराग्राफ़ से संरेखित, दाईं ओर संरेखित पैराग्राफ को केंद्र में संरेखित करें पैराग्राफ को केंद्र में संरेखित करें पैराग्राफ को केंद्र में संरेखित करें पैराग्राफ को केंद्र में पैराग्राफ को संरेखित करें पैराग्राफ को केंद्र में पैराग्राफ के साथ संरेखित करें पैराग्राफ को केंद्र पैराग्राफ में संरेखित करें पैराग्राफ को केंद्र पैराग्राफ में संरेखित करें पैराग्राफ को केंद्र में संरेखित करें पैराग्राफ को केंद्र में संरेखित करें अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित अनुच्छेद उचित

वेब ब्राउज़र स्वचालित रूप से पैराग्राफ के भीतर टेक्स्ट को एक नई लाइन में लपेट देते हैं। यदि कार्य शब्दों के किसी संयोजन को एक पंक्ति में रखना है तो इस कार्य के लिए टैग (टैग) का प्रयोग किया जाता है।

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

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

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

HTML एक वेबसाइट मार्कअप भाषा है. कई लोग इसे प्रोग्रामिंग समझते हैं, लेकिन ऐसा नहीं है। HTML में किसी भी प्रोग्रामिंग भाषा में पाए जाने वाले कोई भी वेरिएबल, गणना, सरणियाँ और अन्य तत्व शामिल नहीं हैं।

HTML का उपयोग करके, एक डेवलपर केवल साइट का स्वरूप बना सकता है। यह समझना महत्वपूर्ण है कि कोई भी वेबसाइट बिना मार्कअप के मौजूद नहीं है। HTML वेब पेज बनाने का आधार है। अन्य सभी कार्यक्षमताएँ विभिन्न प्रोग्रामिंग भाषाओं द्वारा जोड़ी जाती हैं।

एक HTML दस्तावेज़ बनाना

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

एक नियम के रूप में, नोटपैड का उपयोग केवल उन मामलों में किया जाता है जहां हाथ में कोई अन्य उपकरण नहीं होता है। सबसे पहले, एक टेक्स्ट डॉक्यूमेंट बनाया जाता है और फिर उसे html फॉर्मेट में सेव किया जाता है। सभी साइट पेजों में html एक्सटेंशन होना चाहिए।

HTML भाषा पदानुक्रमित है. यानी HTML डॉक्यूमेंट की एक खास संरचना होती है. यह क्या है? आइए स्पष्टता के लिए इसे नीचे देखें।

HTML दस्तावेज़ संरचना. उदाहरण

संरचना हमेशा एक जैसी होती है. यदि आप कुछ बदलना चाहते हैं, तो ब्राउज़र उसे संसाधित नहीं कर पाएगा। परिणामस्वरूप, आपको वह नहीं मिलेगा जो आपने चाहा था।

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

HTML दस्तावेज़ संरचना - मुख्य टैग:

संपूर्ण साइट के ढांचे में ये तीन टैग शामिल हैं। चित्र पर ध्यान दें. इन सभी टैग में "/" चिह्न के साथ एक समापन टैग होता है। यदि आप हाथ से लिखते हैं, तो दोनों टैग एक साथ लगाने की आदत डालें - खोलना और बंद करना।

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

सिर अनुभाग

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

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

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

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

शैलियों को जोड़ना

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

फ़ाइल इस प्रकार कनेक्ट की गई है.

href विशेषता फ़ाइल का पथ निर्दिष्ट करती है। यदि पथ में कोई त्रुटि है, तो शैलियाँ लोड नहीं होंगी। प्रकार विशेषता भी आवश्यक है, जो इंगित करती है कि यह एक सीएसएस फ़ाइल है।

दूसरा विकल्प शैलियों को सीधे मुख्य अनुभाग में परिभाषित करना है।

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

यदि आप जो कक्षा बना रहे हैं उसका उपयोग केवल एक पृष्ठ पर किया जाएगा, तो यह विकल्प आपके लिए उपयुक्त है।

स्क्रिप्ट कनेक्ट करना

स्क्रिप्ट इस प्रकार जुड़ी हुई हैं।

यहां दो विशेषताओं की आवश्यकता है: प्रकार और स्रोत। पहले में हम इंगित करते हैं कि यह एक जावास्क्रिप्ट फ़ाइल है, और दूसरे में - फ़ाइल कहाँ स्थित है। यदि आप कोई टाइपो त्रुटि करते हैं, तो कुछ भी काम नहीं करेगा।

शरीर अनुभाग

HTML दस्तावेज़ की संरचना ऐसी है कि आपको ऐसी सामग्री रखनी होगी जो उपयोगकर्ता को केवल बॉडी सेक्शन में दिखाई देगी। टैग का नाम अपने आप में बहुत कुछ कहता है।

पृष्ठ का संपूर्ण मुख्य कोड यहां दर्शाया गया है, जिसमें असीमित संख्या में तत्व शामिल हो सकते हैं। लेकिन कोड जितना लंबा होगा, उसे संसाधित होने में उतना ही अधिक समय लगेगा।

आइए सबसे बुनियादी टैग देखें जिनका उपयोग मुख्य भाग में किया जा सकता है। बहुत सारे मुख्य नहीं हैं. जैसे-जैसे आपका ज्ञान और अभ्यास बढ़ेगा, आप बाकी सब सीख जाएंगे।

मुख्य टैग

HTML दस्तावेज़ की संरचना के लिए तत्वों को लिखने के अनिवार्य क्रम की आवश्यकता होती है। टैग को हमेशा किनारों पर कोष्ठक से घिरा होना चाहिए। इसके बिना ब्राउज़र को यह समझ नहीं आएगा कि यह एक टैग है। शुरुआती ब्रैकेट के बाद हमेशा तत्व का नाम (टैग) आता है। अगर आप बीच में जगह छोड़ दें< и именем, то браузер посчитает это текстом.

आइए एक छवि टैग का उदाहरण देखें। कृपया ध्यान दें कि यह टैग लिंक, पैराग्राफ और कई अन्य के विपरीत, समापन टैग नहीं है।

विशेषताओं का क्रम कोई मायने नहीं रखता. लेकिन इनका लेखन (डिज़ाइन) बहुत महत्वपूर्ण है। विशेषता नाम हमेशा पहले आता है, फिर बराबर चिह्न, फिर विशेषता मान उद्धरण चिह्नों में लिखा जाता है। मान भिन्न हो सकता है - डिजिटल या टेक्स्ट।

सभी टैग में src विशेषता उस फ़ाइल के पथ को इंगित करती है जिसे लोड करने की आवश्यकता है। सभी तत्वों पर ऑल्ट विशेषता एक संक्षिप्त विवरण निर्दिष्ट करती है। इस मामले में, फोटो बर्ड.जेपीजी एक विवरण के साथ भरी हुई है - एक पक्षी की तस्वीर।

इसके अलावा, आप आयाम, केवल चौड़ाई या ऊंचाई, शीर्षक, संरेखण, शैली वर्ग या बॉर्डर निर्दिष्ट कर सकते हैं।

आइए अन्य मुख्य टैग देखें जो बॉडी अनुभाग में निर्दिष्ट हैं।

	उद्देश्य
	इमेजिस
	टेक्स्ट को एक नई लाइन में लपेटें
…	थंबनेल
	काट दिया गया पाठ
	रेखांकित पाठ

आप अपने दिमाग में यह सब कैसे सोच सकते हैं?

नौसिखिया डेवलपर्स हमेशा तुरंत इस सब की कल्पना नहीं कर सकते। वेब पेज संरचना के कुछ उदाहरण देखें, और फिर आप निश्चित रूप से समझ जायेंगे।

HTML (हाइपरटेक्स्ट मार्कअप लैंग्वेज) शब्द का अर्थ है "हाइपरटेक्स्ट मार्कअप लैंग्वेज"। HTML का पहला संस्करण यूरोपीय कण भौतिकी प्रयोगशाला के एक साथी टिम बर्नर्स-ली द्वारा विकसित किया गया था।

पहला संस्करण बनने के बाद से HTML में कुछ बदलाव हुए हैं। कंप्यूटर की दुनिया में कई चीज़ों की तरह, HTML के संस्करण या विशिष्टताएँ भी क्रमांकित हो गईं। विशिष्टताएँ 2.0, 3.0 और 3.2 ज्ञात हैं। वर्तमान HTML विनिर्देश हमेशा W3C सर्वर पर पाया जा सकता है।

हाइपरटेक्स्ट मार्कअप लैंग्वेज (HTML) एक मानक भाषा है जिसे WEB वातावरण में हाइपरटेक्स्ट दस्तावेज़ बनाने के लिए डिज़ाइन किया गया है। HTML दस्तावेज़ों को विभिन्न प्रकार के वेब ब्राउज़रों द्वारा देखा जा सकता है। जब HTML का उपयोग करके कोई दस्तावेज़ बनाया जाता है, तो एक वेब ब्राउज़र दस्तावेज़ के विभिन्न तत्वों को उजागर करने और पहले उन्हें संसाधित करने के लिए HTML की व्याख्या कर सकता है। HTML का उपयोग दस्तावेज़ों को प्रारूपित करने की अनुमति देता है ताकि उन्हें किसी भी सिस्टम पर फ़ॉन्ट, लाइनों और अन्य ग्राफ़िक तत्वों का उपयोग करके प्रस्तुत किया जा सके जो उन्हें देखता है।

अधिकांश दस्तावेज़ों में मानक तत्व होते हैं जैसे शीर्षक, पैराग्राफ या सूचियाँ। HTML टैग का उपयोग करके आप इन तत्वों को नामित कर सकते हैं, वेब ब्राउज़र को इन तत्वों को प्रदर्शित करने के लिए न्यूनतम जानकारी प्रदान करते हैं, जबकि आम तौर पर दस्तावेज़ों की समग्र संरचना और सूचनात्मक पूर्णता को बनाए रखते हैं। HTML दस्तावेज़ को पढ़ने के लिए बस एक WEB ब्राउज़र की आवश्यकता होती है जो HTML टैग की व्याख्या करता है और दस्तावेज़ को स्क्रीन पर उसी रूप में प्रदर्शित करता है जैसा लेखक उसे देता है।

ज्यादातर मामलों में, दस्तावेज़ का लेखक दस्तावेज़ की उपस्थिति को सख्ती से निर्धारित करता है। HTML के मामले में, रीडर (वेब ​​​​ब्राउज़र की क्षमताओं के आधार पर, कुछ हद तक, दस्तावेज़ की उपस्थिति को नियंत्रित कर सकता है (लेकिन इसकी सामग्री को नहीं)। HTML आपको यह चिह्नित करने की अनुमति देता है कि कोई शीर्षक या पैराग्राफ कहाँ होना चाहिए दस्तावेज़ एक HTML टैग का उपयोग करता है, और फिर इन टैगों की व्याख्या करने के लिए WEB- ब्राउज़र प्रदान करता है।

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

HTML दस्तावेज़ किसी भी टेक्स्ट एडिटर या विशेष HTML संपादकों और कनवर्टर्स का उपयोग करके बनाए जा सकते हैं। HTML दस्तावेज़ बनाने के लिए उपयोग किए जाने वाले संपादक की पसंद पूरी तरह से प्रत्येक लेखक की सुविधा और व्यक्तिगत प्राथमिकताओं पर निर्भर करती है। उदाहरण के लिए, नेटस्केप के नेटस्केप नेविगेटर गोल्ड जैसे HTML संपादक आपको WYSIWYG (आप जो देखते हैं वही मिलता है) तकनीक का उपयोग करके ग्राफ़िक रूप से दस्तावेज़ बनाने की अनुमति देते हैं। दूसरी ओर, अधिकांश पारंपरिक दस्तावेज़ निर्माण टूल में कनवर्टर्स होते हैं जो आपको दस्तावेज़ों को HTML प्रारूप में परिवर्तित करने की अनुमति देते हैं।

सभी HTML टैग "" (समकोण कोष्ठक) से शुरू होते हैं। आमतौर पर, एक प्रारंभ टैग और एक अंत टैग होता है। उदाहरण के तौर पर, यहां शीर्षक टैग हैं जो प्रारंभ और अंत टैग के अंदर पाठ को परिभाषित करते हैं जो दस्तावेज़ के शीर्षक का वर्णन करते हैं: दस्तावेज़ शीर्षक

HTML केस संवेदी नहीं है, इसलिए ऊपर दिया गया उदाहरण इस तरह दिख सकता है:

दस्तावेज़ का शीर्षक

अंतिम टैग प्रारंभ टैग के समान दिखता है, और कोण कोष्ठक के अंदर पाठ से पहले फॉरवर्ड स्लैश द्वारा इससे भिन्न होता है। इस उदाहरण में, टैग वेब ब्राउज़र को शीर्षक प्रारूप का उपयोग करने के लिए कहता है, और टैग हेडर टेक्स्ट को समाप्त होने के लिए कहता है।

कुछ टैग जैसे

(टैग जो पैराग्राफ को परिभाषित करता है) को अंतिम टैग की आवश्यकता नहीं होती है, लेकिन इसके उपयोग से दस्तावेज़ के स्रोत पाठ को बेहतर पठनीयता और संरचना मिलती है।

जब एक WEB ब्राउज़र एक दस्तावेज़ प्राप्त करता है, तो यह निर्धारित करता है कि दस्तावेज़ की व्याख्या कैसे की जानी चाहिए। दस्तावेज़ में दिखाई देने वाला सबसे पहला टैग अवश्य होना चाहिए। यह टैग वेब ब्राउज़र को बताता है कि आपका दस्तावेज़ HTML का उपयोग करके लिखा गया है। एक न्यूनतम HTML दस्तावेज़ इस तरह दिखेगा:

...दस्तावेज़ का मुख्य भाग...

दस्तावेज़ शीर्षलेख

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

कर्मचारियों की सूची दस्तावेज़ का शीर्षक

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

टिप्पणियाँ

किसी भी भाषा की तरह, HTML आपको दस्तावेज़ के मुख्य भाग में टिप्पणियाँ सम्मिलित करने की अनुमति देता है, जो दस्तावेज़ को नेटवर्क पर स्थानांतरित करने पर सहेजे जाते हैं, लेकिन ब्राउज़र द्वारा प्रदर्शित नहीं होते हैं। टिप्पणी वाक्यविन्यास:

टिप्पणियाँ किसी दस्तावेज़ में कहीं भी और किसी भी मात्रा में दिखाई दे सकती हैं।

दस्तावेज़ बॉडी टैग विंडो में प्रदर्शित HTML दस्तावेज़ घटकों की पहचान करते हैं। दस्तावेज़ के मुख्य भाग में अन्य दस्तावेज़ों, पाठ और अन्य स्वरूपित जानकारी के लिंक हो सकते हैं।

दस्तावेज़ का मुख्य भाग

दस्तावेज़ का मुख्य भाग और टैग के बीच होना चाहिए। यह दस्तावेज़ का वह भाग है जो आपके दस्तावेज़ की पाठ्य और ग्राफ़िक (शब्दार्थ) जानकारी के रूप में प्रदर्शित होता है।

अनुच्छेद टैग

अधिकांश वर्ड प्रोसेसर के विपरीत, HTML दस्तावेज़ में कैरिएज रिटर्न को आम तौर पर अनदेखा कर दिया जाता है। एक भौतिक अनुच्छेद विराम दस्तावेज़ के स्रोत पाठ में कहीं भी स्थित हो सकता है (इसे पढ़ने में आसान बनाने के लिए)। हालाँकि, यदि कोई टैग है तो ब्राउज़र केवल पैराग्राफ को अलग करता है

यदि आप पैराग्राफ को टैग से अलग नहीं करते हैं

आपका दस्तावेज़ एक बड़े पैराग्राफ़ के रूप में दिखाई देगा.

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

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

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

HTML दस्तावेज़ों में ग्राफ़िक्स का उपयोग करने के दो तरीके हैं। पहला दस्तावेज़ में ग्राफिक छवियों को एम्बेड करना है, जो उपयोगकर्ता को दस्तावेज़ के अन्य तत्वों के संदर्भ में छवियों को सीधे देखने की अनुमति देता है।

दस्तावेज़ डिज़ाइन में यह सबसे अधिक उपयोग की जाने वाली तकनीक है, जिसे कभी-कभी "इनलाइन इमेज" भी कहा जाता है।

कुछ WWW ब्राउज़र आपके WWW सर्वर पर कुछ क्रियाएं करने के लिए, परिणामी मान लौटाने वाला एक विशेष फॉर्म भरकर उपयोगकर्ता को अनुमति देते हैं। जब फॉर्म की व्याख्या वेब ब्राउज़र द्वारा की जाती है, तो विशेष जीयूआई स्क्रीन तत्व बनाए जाते हैं, जैसे इनपुट फ़ील्ड, चेकबॉक्स, रेडियोबटन, ड्रॉप-डाउन मेनू, स्क्रॉल करने योग्य सूचियां, बटन इत्यादि। जब कोई उपयोगकर्ता एक फॉर्म भरता है और "सबमिट" बटन पर क्लिक करता है (SUBMIT एक विशेष प्रकार का बटन है जिसे दस्तावेज़ का वर्णन करते समय निर्दिष्ट किया जाता है), उपयोगकर्ता द्वारा फॉर्म में दर्ज की गई जानकारी प्रसंस्करण और ट्रांसमिशन के लिए HTTP सर्वर पर भेजी जाती है CGI (कॉमन गेटवे इंटरफ़ेस) इंटरफ़ेस के अनुसार, सर्वर के अंतर्गत चल रहे अन्य प्रोग्रामों के लिए।

जब आप किसी फॉर्म का वर्णन करते हैं, तो प्रत्येक डेटा प्रविष्टि तत्व में एक टैग होता है। जब कोई उपयोगकर्ता किसी प्रपत्र तत्व में डेटा रखता है, तो जानकारी उस तत्व के VALUE अनुभाग में रखी जाती है। वेब की सबसे आकर्षक विशेषताओं में से एक HTML दस्तावेज़ में ग्राफिक्स और अन्य प्रकार के डेटा के लिंक शामिल करने की क्षमता है।

यद्यपि वेब पेज आपके कंप्यूटर स्क्रीन पर स्वरूपित दिखाई देते हैं, HTML को दस्तावेज़ों को स्वरूपित करने के लिए डिज़ाइन नहीं किया गया है क्योंकि किसी पृष्ठ पर कठोर डिज़ाइन और पाठ तत्वों की सटीक स्थिति ऐसी सीमाएँ बनाती है जो इंटरनेट पर स्वीकार्य नहीं हैं।

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

HTML भाषा का उपयोग करके किसी दस्तावेज़ का वर्णन करने की ख़ासियत स्रोत दस्तावेज़ को पुन: प्रस्तुत करने में पूर्ण सटीकता प्राप्त करने की मौलिक असंभवता से जुड़ी है। इरादा यह है कि दस्तावेज़ इंटरनेट पर व्यापक रूप से उपलब्ध होगा और इसलिए यह ज्ञात नहीं है कि इसका पुनरुत्पादन कैसे व्यवस्थित किया जाएगा। दस्तावेज़ को ग्राफिकल स्क्रीन पर प्रस्तुत किया जा सकता है, शुद्ध पाठ रूप में आउटपुट किया जा सकता है, या वाक् संश्लेषण कार्यक्रम द्वारा बस "पढ़ा" जा सकता है। इन सभी मामलों में HTML मार्कअप को ध्यान में रखा जाना चाहिए। इसीलिए ! HTML का उद्देश्य किसी दस्तावेज़ को फ़ॉर्मेट करना नहीं है, बल्कि उसके कार्यात्मक मार्कअप के लिए है. मार्कअप से तात्पर्य विशेष कोड के उपयोग से है जो दस्तावेज़ की शब्दार्थ सामग्री से आसानी से अलग हो जाते हैं और हाइपरटेक्स्ट को लागू करने के लिए उपयोग किए जाते हैं। इन कोडों का उपयोग HTML भाषा विनिर्देश द्वारा परिभाषित सख्त नियमों के अधीन है, उदाहरण के लिए, दस्तावेज़ आमतौर पर शीर्षकों से शुरू होते हैं। दस्तावेज़ के एक भाग की विशेषता "शीर्षक होना" दस्तावेज़ के स्वरूपण की विशेषता नहीं है, बल्कि इसकी सामग्री की विशेषता है। एक विशेष दस्तावेज़ रेंडरर (ब्राउज़र) हेडर के रूप में वर्णित दस्तावेज़ के भाग को प्रस्तुत करने का अपना तरीका चुनता है।

एचटीएमएल टैग

! स्रोत पाठ को चिह्नित करने के लिए उपयोग किए जाने वाले HTML भाषा कोड को टैग कहा जाता है और सीधे दस्तावेज़ पाठ में डाला जाता है।

टैग वर्णों का एक समूह है. सभी टैग कम-से-कम प्रतीक () से शुरू होते हैं। इन वर्णों की एक जोड़ी को कभी-कभी कोण कोष्ठक भी कहा जाता है। ओपनिंग एंगल ब्रैकेट के बाद एक कीवर्ड आता है जो टैग को परिभाषित करता है।

HTML में प्रत्येक टैग का एक विशेष उद्देश्य होता है। टैग नामों में अक्षरों का मामला कोई मायने नहीं रखता - या तो लोअरकेस या अपरकेस अक्षरों का उपयोग किया जा सकता है, हालांकि सामान्य दस्तावेज़ पाठ से टैग को अलग करने के लिए अपरकेस अक्षरों का उपयोग करना आम है।

टैग को दो बड़े समूहों में विभाजित किया जा सकता है।

एक ही समूह के टैग, जिन्हें कंटेनर कहा जाता है, उनके बीच संलग्न दस्तावेज़ के हिस्से को प्रभावित करते हैं। उनके दो घटक हैं: उद्घाटन (प्रारंभिक) और समापन (अंतिम)। समापन टैग का नाम शुरुआती टैग के समान है, लेकिन उसके पहले एक स्लैश (/ (स्लैश)) होता है। टेक्स्ट या अन्य टैग को उद्घाटन और समापन टैग के बीच रखा जा सकता है।

स्टैंडअलोन (एकल) टैग में अनुगामी घटक नहीं होता है। वे एक बार की कार्रवाई का कारण बनते हैं या, जब व्याख्या की जाती है, तो एक वस्तु को प्रदर्शित दस्तावेज़ में डाला जाता है। उदाहरण के लिए, टैग करें pict.gif फ़ाइल से चित्र सम्मिलित करने का कारण बनता है।

आमतौर पर, एक HTML टैग दस्तावेज़ के केवल भाग को प्रभावित करता है, जैसे कि पैराग्राफ। ऐसे मामलों में, युग्मित टैग का उपयोग किया जाता है: खोलना और बंद करना। प्रारंभिक टैग प्रभाव पैदा करता है, और समापन टैग प्रभाव समाप्त करता है। समापन टैग फॉरवर्ड स्लैश (/) से शुरू होते हैं।

कुछ टैग जहां दिखाई देते हैं वहां एक बार का प्रभाव प्रदान करते हैं। ऐसे में क्लोजिंग टैग की जरूरत नहीं होती और इसका इस्तेमाल नहीं किया जाता.

यदि गलती से किसी टैग में कोई ऐसा कीवर्ड शामिल हो जो HTML में नहीं पाया जाता है, तो टैग को पूरी तरह से अनदेखा कर दिया जाता है।

जब किसी दस्तावेज़ को ब्राउज़र में प्रदर्शित किया जाता है, तो टैग स्वयं प्रदर्शित नहीं होते हैं, लेकिन वे दस्तावेज़ को प्रदर्शित करने के तरीके को प्रभावित करते हैं।

टैग किसी दस्तावेज़ के एक विशिष्ट टुकड़े से जुड़े होते हैं और यह दर्शाते हैं कि वेब क्लाइंट द्वारा इन टुकड़ों की सामग्री को बाहरी रूप से कैसे दर्शाया और व्याख्या किया जाता है।

कार्यात्मक दृष्टिकोण से, HTML टैग को निम्नलिखित श्रेणियों में विभाजित किया जा सकता है:

दस्तावेज़ की संरचना और उसके बारे में जानकारी का वर्णन करने वाले टैग, उदाहरण के लिए, एनोटेशन, कीवर्ड की सूची, आदि;

किसी दस्तावेज़ के पाठ को तार्किक रूप से संरचित करने के लिए टैग का उपयोग किया जाता है, उदाहरण के लिए, शीर्षकों को हाइलाइट करना, पैराग्राफ में विभाजित करना, उद्धरण चिह्नों को हाइलाइट करना, सूचियाँ, तालिकाएँ बनाना आदि;

फ़ॉन्ट, रंग, आदि के मापदंडों का वर्णन करने वाले टेक्स्ट फ़ॉर्मेटिंग टैग;

हाइपरलिंक व्यवस्थित करने के लिए टैग;

टैग जो HTML फ़ाइल और बाहरी वस्तुओं के बीच संबंध स्थापित करते हैं, उदाहरण के लिए, ग्राफिक, ध्वनि फ़ाइलें, आदि;

प्रपत्र निर्माण टैग जो उपयोगकर्ता को जानकारी दर्ज करने और उसे वेब सर्वर पर सबमिट करने की अनुमति देते हैं;

HTML भाषा के मूल संस्करण में कई कमियाँ हैं:

ऐसे उपकरणों का अभाव जो आपको दस्तावेज़ की उपस्थिति को गतिशील रूप से नियंत्रित करने की अनुमति देते हैं;

ऐसे टूल की कमी जो आपको दस्तावेज़ में बदलाव किए बिना वेब दस्तावेज़ों के बाहरी डिज़ाइन को आसानी से बदलने की अनुमति देती है, उदाहरण के लिए, स्टाइल शीट;

ऐसे उपकरणों का अभाव जो आपको किसी तरह सामग्री को अर्थ के अनुसार संरचना करने की अनुमति देते हैं, उदाहरण के लिए, पाठ में पाई गई अवधारणाओं को वर्गीकृत करने के लिए।

वर्तमान में, कई HTML एक्सटेंशन हैं, साथ ही विभिन्न तकनीकों का एक सेट भी है, जो भाषा के मूल संस्करण की कमियों को दूर कर सकता है।

टैग विशेषताएँ

किसी टैग के प्रभाव को विशेषताएँ जोड़कर संशोधित किया जा सकता है। युग्मित टैग में, विशेषताएँ केवल शुरुआती टैग में जोड़ी जाती हैं।

! विशेषताएँ अतिरिक्त कीवर्ड हैं, जिन्हें टैग के परिभाषित कीवर्ड और अन्य विशेषताओं से रिक्त स्थान द्वारा अलग किया जाता है, और टैग को समाप्त करने वाले ">" वर्ण से पहले रखा जाता है। जिस तरह से कुछ विशेषताओं को लागू किया जाता है, उसके लिए विशेषता के लिए एक मान निर्दिष्ट करने की आवश्यकता होती है। विशेषता मान को विशेषता कीवर्ड से "=" (समान चिह्न) वर्ण द्वारा अलग किया जाता है और उद्धरण चिह्नों में संलग्न किया जाता है।

किसी तत्व के गुण उसके गुणों को परिभाषित करते हैं।

विशेषताओं वाले टैग के उदाहरण:

- दस्तावेज़ के लिए हल्के नीले रंग की पृष्ठभूमि सेट करता है,

पाठ - एक युग्मित टैग, ब्राउज़र को "कंटेनर" में संलग्न पाठ को आधार आकार (आकार = "+ 2") और लाल रंग (रंग = "लाल") के सापेक्ष बढ़े हुए वर्णों के साथ प्रदर्शित करने का निर्देश देता है।

विशेषता मान को उद्धरण चिह्नों में संलग्न किया जाना चाहिए, लेकिन कई मामलों में उद्धरण चिह्नों को बिना किसी नुकसान के छोड़ा जा सकता है।

मार्कअप भाषा के रूप में HTML की परिभाषा इस तथ्य पर आधारित है कि जब किसी दस्तावेज़ से सभी टैग हटा दिए जाते हैं, तो एक टेक्स्ट दस्तावेज़ प्राप्त होता है जो मूल हाइपरटेक्स्ट दस्तावेज़ की सामग्री के पूरी तरह से समकक्ष होता है। इस प्रकार, जब एक HTML दस्तावेज़ प्रस्तुत किया जाता है, तो टैग स्वयं प्रस्तुत नहीं होते हैं, लेकिन वे दस्तावेज़ के बाकी हिस्सों को प्रस्तुत करने के तरीके को प्रभावित करते हैं।

HTML बेसिक्स में HTML भाषा के बुनियादी नियम, HTML पृष्ठ की संरचना का विवरण और HTML तत्वों के बीच HTML दस्तावेज़ की संरचना में संबंध शामिल हैं।

एक HTML दस्तावेज़ एक नियमित पाठ दस्तावेज़ है जिसे या तो एक नियमित पाठ संपादक (नोटपैड) में या कोड हाइलाइटिंग (नोटपैड++, विज़ुअल स्टूडियो कोड, आदि) के साथ एक विशेष संपादक में बनाया जा सकता है। HTML दस्तावेज़ में .html एक्सटेंशन होता है।

एक HTML दस्तावेज़ में HTML तत्वों और पाठ का एक वृक्ष होता है। प्रत्येक तत्व को स्रोत दस्तावेज़ में एक प्रारंभ (उद्घाटन) और एक समाप्ति (समापन) टैग (दुर्लभ अपवादों के साथ) द्वारा पहचाना जाता है।

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

एकल टैग सामग्री को सीधे संग्रहीत नहीं कर सकते हैं; इसे एक विशेषता मान के रूप में लिखा जाता है, उदाहरण के लिए, एक टैग अंदर टेक्स्ट बटन के साथ एक बटन बनाएगा।

टैग को एक दूसरे के अंदर नेस्ट किया जा सकता है, उदाहरण के लिए,

मूलपाठ

. निवेश करते समय, आपको उस क्रम का पालन करना चाहिए जिसमें वे बंद हैं ("मैत्रियोश्का" सिद्धांत), उदाहरण के लिए, निम्नलिखित प्रविष्टि गलत होगी:

मूलपाठ

.

HTML तत्वों में विशेषताएँ हो सकती हैं (वैश्विक, सभी HTML तत्वों पर लागू, और उनकी अपनी)। विशेषताएँ तत्व के शुरुआती टैग में लिखी जाती हैं और इसमें एक नाम और मान होता है, जो प्रारूप विशेषता name='value' में निर्दिष्ट होता है। विशेषताएँ आपको उस तत्व के गुणों और व्यवहार को बदलने की अनुमति देती हैं जिसके लिए वे सेट हैं।

प्रत्येक तत्व को एकाधिक वर्ग मान और केवल एक आईडी मान निर्दिष्ट किया जा सकता है। एकाधिक वर्ग मानों को एक स्थान से अलग करके लिखा जाता है। वर्ग और आईडी मानों में केवल अक्षर, संख्याएँ, हाइफ़न और अंडरस्कोर शामिल होने चाहिए, और केवल अक्षरों या संख्याओं से शुरू होने चाहिए।

ब्राउज़र HTML दस्तावेज़ को देखता है (व्याख्या करता है), इसकी संरचना (DOM) बनाता है और इसे इस फ़ाइल (स्टाइल शीट, स्क्रिप्ट) में शामिल निर्देशों के अनुसार प्रदर्शित करता है। यदि मार्कअप सही है, तो ब्राउज़र विंडो एक HTML पृष्ठ प्रदर्शित करेगी जिसमें HTML तत्व - हेडर, टेबल, चित्र आदि होंगे।

व्याख्या प्रक्रिया (पार्सिंग) वेब पेज के ब्राउज़र में पूरी तरह से लोड होने से पहले शुरू होती है। सीएसएस को संसाधित करते समय और स्टाइल शीट को पृष्ठ तत्वों से संबंधित करते समय, ब्राउज़र शुरू से ही HTML दस्तावेज़ों को क्रमिक रूप से संसाधित करते हैं।

एक HTML दस्तावेज़ में दो खंड होते हैं - हेडर - टैग के बीच ... और सामग्री भाग - टैग के बीच ....

वेब पेज संरचना 1. HTML दस्तावेज़ संरचना

HTML दस्तावेज़ प्रकार घोषणा फ़ाइल में निहित नियमों का पालन करता है (दस्तावेज़ प्रकार परिभाषा, या DTD). DTD एक XML दस्तावेज़ है जो परिभाषित करता है कि कौन से टैग, विशेषताएँ और उनके मान किसी विशेष HTML प्रकार के लिए मान्य हैं। HTML के प्रत्येक संस्करण का अपना DTD होता है।

DOCTYPE ब्राउज़र द्वारा वेब पेज के सही प्रदर्शन के लिए जिम्मेदार है। DOCTYPE न केवल HTML संस्करण (उदाहरण html) बल्कि इंटरनेट पर संबंधित DTD फ़ाइल को भी निर्दिष्ट करता है।

...

टैग के अंदर के तत्व एक दस्तावेज़ ट्री बनाते हैं, तथाकथित दस्तावेज़ ऑब्जेक्ट मॉडल, DOM (दस्तावेज़ ऑब्जेक्ट मॉडल)। इस स्थिति में, तत्व मूल तत्व है।

चावल। 1. वेब पेज की सबसे सरल संरचना

वेब पेज तत्वों की परस्पर क्रिया को समझने के लिए, तत्वों के बीच तथाकथित "पारिवारिक संबंधों" पर विचार करना आवश्यक है। कई नेस्टेड तत्वों के बीच संबंधों को माता-पिता, बच्चे और बहन के रूप में वर्गीकृत किया गया है।

पूर्वज एक ऐसा तत्व है जिसमें अन्य तत्व शामिल होते हैं। चित्र 1 में, सभी तत्वों का पूर्वज है। साथ ही, तत्व इसमें शामिल सभी टैगों का पूर्वज है: ,

, , वगैरह।

वंशज एक तत्व है जो एक या अधिक तत्व प्रकारों के भीतर स्थित होता है। उदाहरण के लिए, और तत्व का वंशज है

और दोनों का वंशज है।

मूल तत्व एक ऐसा तत्व है जो निचले स्तर पर अन्य तत्वों से संबंधित होता है और पेड़ में उनके ऊपर स्थित होता है। चित्र 1 और में. टैग

केवल माता-पिता हैं.

चाइल्ड तत्व एक ऐसा तत्व है जो सीधे उच्च स्तर पर किसी अन्य तत्व के अधीन होता है। चित्र 1 में केवल तत्व हैं,

और के बच्चे हैं.

एक बहन तत्व एक ऐसा तत्व है जिसमें प्रश्न वाले तत्व के साथ एक सामान्य मूल तत्व होता है, समान स्तर के तथाकथित तत्व। चित्र 1 में समान स्तर के तत्व हैं, साथ ही तत्व भी हैं

वे एक-दूसरे की बहनें हैं।

1.1. तत्व 1.2. तत्व

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

1.2.1. तत्व

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

1.2.2. तत्व

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

पृष्ठ सामग्री और कीवर्ड का विवरण एक साथ कई भाषाओं में निर्दिष्ट किया जा सकता है, उदाहरण के लिए, रूसी और अंग्रेजी में:

टैग का उपयोग करके, आप खोज इंजन द्वारा किसी वेब पेज के अनुक्रमण को ब्लॉक या अनुमति दे सकते हैं:

निर्दिष्ट समयावधि के बाद पृष्ठ को स्वचालित रूप से पुनः लोड करने के लिए, आपको ताज़ा मान का उपयोग करना होगा:

पेज 30 सेकंड के बाद पुनः लोड हो जाएगा। विज़िटर को दूसरे पृष्ठ पर रीडायरेक्ट करने के लिए, आपको यूआरएल पैरामीटर में यूआरएल निर्दिष्ट करना होगा: