HTML क्या है? इसे कैसे सीखें? | What is HTML in Hindi?

html-kya-hai-what-is-html-in-hindi.png

HTML क्या है? (What is HTML in Hindi?) यह कैसे काम करता है? HTML का अविष्कार किसने किया? इसके क्या फायदे हैं? HTML के बारे में ऐसे तमाम तरह के सवालों के जवाब और कई सारी जानकारी आज आपको यहाँ मिलने वाली है। उम्मीद है ये जानकारियाँ आपके काम आएँगी।

HTML का full form Hypertext Markup Language है। यह एक प्रकार की कंप्यूटर भाषा है जिसका उपयोग web page के structure को define करने के लिए किया जाता है।

वर्ल्ड वाइड वेब का अविष्कार होने के एक साल बाद ही एचटीएमएल का उपयोग होना शुरू हो गया था। आज इसे लगभग 30 साल हो चुके हैं और इस दौरान इसके कई versions आ चुके हैं और आज भी इसका उपयोग हो रहा है। इन्टरनेट पर मौजूद लगभग सारे वेबसाइट के pages एचटीएमएल से बने हुए हैं।

हमने आज इस आर्टिकल में इसके बारे में विस्तार से चर्चा की है, तो चलिए जानते हैं की HTML किसे कहते है? और इसका कैसे उपयोग किया जाता है?

HTML क्या है? What is HTML in Hindi?

यह एक markup language है जिसका उपयोग वेब पेज और web application के कंटेंट के लिए structure यानि ढांचा तैयार करने के लिए किया जाता है।

किसी पेज में heading, paragraph, image, links आदि कौन सी जगह पर होंगे यह HTML कोड से ही निर्धारित किया जाता है। इससे डॉक्यूमेंट को सही तरह से व्यवस्थित करने में मदद मिलती है।

क्या HTML प्रोग्रामिंग लैंग्वेज है?

इस सवाल को लेकर कई लोगों के बीच बहस छिड़ी रहती है लेकिन ज्यादातर लोगों का मानना है की यह programming language की श्रेणी में नही आता।

इसके पीछे कारण यह है की जिस प्रकार से की हम किसी अन्य प्रोग्रामिंग लैंग्वेज में dynamic functionality create कर पाते हैं वैसा HTML से नही कर सकते। यह एक मार्कअप लैंग्वेज है और इससे हम logical programs नही बना सकते।

एचटीएमएल का इतिहास – History of HTML in Hindi

  • सन 1989 में Tim Berners-Lee ने वर्ल्ड वाइड वेब यानि WWW का आविष्कार किया और इसके साथ ही उन्होंने Internet-based hypertext system पर काम करना शुरू कर दिया था।
  • सन 1990, Tim Berners-Lee ने HTML का आविष्कार किया इसके साथ ही वेब ब्राउज़र और सर्वर सॉफ्टवेयर को बनाया।
  • 1991 में इन्टरनेट में पहली बार एचटीएमएल के बारे में HTML Tags नाम का एक डॉक्यूमेंट रिलीज़ किया जिसमे लगभग 18 html elements के बारे में बताया गया था।
  • 1993 में HTML 1.0 release हुआ जिसे जानकारी साझा करने के लिए उपयोग किया जाता था इसे वेब ब्राउज़र में ओपन करके पढ़ा जा सकता था।
  • 1995 HTML 2.0 पब्लिश हुआ जिसे HTML1.0 को improve करके बनाया गया था।
  • 1997 में इसका अलग वर्शन HTML 3.0 आया जो की W3C के द्वारा बनाया गया और standardized किया गया था।
  • 1997 के अंत में HTML 4.0 लांच हुआ जिसे फिर से minor edits करके 1998 में रिलीज़ किया गया था।
  • 1998 में HTML 4.01 आया जो की बहुत ही successful version था और लगभग हर जगह उपयोग होने लगा।
  • 2014 में HTML 5 आया जो की अभी तक चल रहा है, इसमें कई सारे नये टैग्स को शामिल किया गया है।

HTML Tags क्या है?

HTML tags एक प्रकार के keywords हैं जो की वेब पेज के कंटेंट को पहचानने और उन्हें सही फॉर्मेट में दिखाने में वेब ब्राउज़र की मदद करता है।

जब वेब पेज ब्राउज़र में पहुचता है तो ब्राउज़र उसे ऊपर से नीचे स्कैन करता है और इन टैग्स की मदद से कंटेंट को समझकर उसे render करता है।

  • सारे टैग < > के अंदर लिखे जाते हैं, जैसे: <tag>
  • टैग्स के तीन हिस्से होते हैं: opening tag, content, closing tag
  • ओपनिंग टैग कुछ इस तरह होते हैं: <tag>
  • वहीँ क्लोजिंग टैग में ब्रैकेट के अंदर स्लैश का उपयोग किया जाता है जैसे: </tag>
  • इन दोनों के बीच में हमें अपने content को रखना होता है
  • कुछ टैग्स ऐसे भी होते हैं जिनके closing tag नही होते
  • अलग-अलग प्रकार के कंटेंट के लिए अलग-अलग प्रकार के टैग्स उपयोग किये जाते हैं
  • आप एक वेब पेज में जितने चाहें उतने टैग्स अपनी जरुरत के अनुसार उपयोग कर सकते हैं

अब हम आपको एचटीएमएल टैग्स के कुछ उदाहरण देने वाले हैं:

<h1> Heading </h1>
<p> Paragraph </p>
<b> Bold </b>
<i> Italic </i>
<u> underline </u>

  ये कुछ basic tags के example हैं, हमने एचटीएमएल सिखाने के लिए विस्तार से अलग आर्टिकल लिखा है जिसमे आप और भी टैग्स के बारे में पढ़ सकते हैं।

Basic Structure of HTML in Hindi

हर वेब पेज में एचटीएमएल का उपयोग होता है, और हर जगह इसके कोड का basic structure लगभग एक जैसा होता है। कोडिंग करने से पहले आपको इस बारे में जानकारी होनी जरुरी है।

हर HTML document के मुख्यतः तीन हिस्से होते हैं:

  1. DTD (Document Type Declaration): <!DOCTYPE>
  2. Main container : <html>
  3. Head section: <head>
  4. Body section: <body>

पूरे पेज का स्ट्रक्चर कुछ इस प्रकार दिखाई देता है:  

structure-of-html

  आइये अब इन्हें समझते हैं:

DTD (Document Type Declaration): एचटीएमएल पेज के सबसे शुरुआत में हमें डॉक्यूमेंट का टाइप बताना होता है ताकि ब्राउज़र को यह पता चल सके की यह किस प्रकार का फाइल है और वह उसके अनुसार उसे प्रोसेस कर सके। इसके लिए <!DOCTYPE> एलिमेंट का उपयोग किया जाता है। HTML 5 version में यह बहुत ही आसान है, इसे कुछ इस प्रकार से लिखा जाता है:   <!DOCTYPE html> यह कोड आपको कैसे लिखना है यह निर्भर करता है की आप कौन से वर्शन का एचटीएमएल उपयोग कर रहे हैं और आपके फाइल का टाइप क्या है।

Main container: HTML element: DTD के बाद में हमें एक कंटेनर बनाना होता है जिसमे DTD को छोड़कर डॉक्यूमेंट के सारे कंटेंट रखे जाते हैं। इसके लिए <html> टैग का उपयोग किया जाता है।

Head section: Main container के अंदर हमें <head> tag का उपयोग कर एक हेड सेक्शन बनाना होता है। इसके अंदर हम उस वेब पेज के बारे में जानकारी लिखते हैं। यहाँ पर लिखी गयी जानकारी ब्राउज़र पर दिखाई नही देती। इस सेक्शन में पांच प्रकार की चीजें लिखी जाती हैं:

  1. Document का Title : वेब पेज का टाइटल लिखने के लिए <title> टैग का उपयोग होता है।
  2. Style declaration: <style> elements से हम CSS के codes लिख सकते हैं
  3. Client side Scripts: Functionality provide करने के लिए jQuery, जावास्क्रिप्ट आदि के कोड head section में लिखे जा सकते हैं इसके लिए <script> टैग use होता है।
  4. Meta elements: कुछ custom attributes के लिए <meta> का उपयोग होता है।
  5. Link elements: किसी external files या डॉक्यूमेंट को लिंक करने के लिए <link> का use किया जाता है।

Body Section: यह डॉक्यूमेंट का वो हिस्सा है जहाँ आप अपने वो सारे contents डालते हैं जिन्हें आप अपने यूजर दिखाना चाहते हैं जैसे: headings, paragraphs, images, bullet lists आदि।

HTML कैसे काम करता है?

किसी वेबसाइट के सारे html फाइल्स वेब सर्वर में मौजूद रहते हैं जब आप अपने कंप्यूटर या मोबाइल के वेब ब्राउज़र (जैसे: गूगल क्रोम, मोज़िला फायरफॉक्स, इन्टरनेट एक्स्प्लोरर आदि) से उस वेबसाइट के किसी पेज को एड्रेस डालकर खोलते हैं तो वह एचटीएमएल फाइल सर्वर से आपके कंप्यूटर में आता है और आपके ब्राउज़र में पहुँचता है।

HTML file का extension .html या .htm होता है जिसे ब्राउज़र उपर से निचे बाएं से दायें स्कैन करता है और उसके अंदर मौजूद html elements और tags को पहचानने की कोशिश करता है और पूरे पेज के स्ट्रक्चर को समझता है। एलेमेंट्स के अनुसार यह निर्णय लेता है उस कंटेट को किस तरह से अपने यूजर के स्क्रीन पर दिखाया जाय।

एचटीएमएल के फायदे (Advantages of HTML)

चलिए अब हम html से होने वाले लाभ के बारे में जानते हैं:

  • इसे सीखना आसान है।
  • सभी वेब ब्राउज़र पर चलता है।
  • यह ओपन-सोर्स और बिलकुल फ्री है।
  • यह बहुत ही light-weight है।
  • यह search engine friendly है।
  • कोड का रिजल्ट हम तुरंत देख सकते हैं।
  • इसके कोड को एडिट करना बहुत ही आसान है।
  • कोडिंग करने के लिए हमें अलग से किसी सॉफ्टवेयर की जरुरत नही है इसके लिए हम किसी भी टेक्स्ट एडिटर का उपयोग कर सकते हैं।
  • इसके सारे standards W3C द्वारा निर्धारित किये जाते हैं।
  • इसे सर्वर साइड स्क्रिप्ट जैसे PHP आदि के साथ मिक्स किया जा सकता है।

एचटीएमएल में क्या कमियां हैं?

इसके कई सारे फायदे हैं लेकिन साथ इसमें कुछ limitations भी हैं जिसके बारे में निचे आप पढ़ सकते हैं:

  • इसेसे हम केवल static और plain web page बना सकते हैं, dynamic functionality के लिए आप JavaScript programming, PHP, ASP आदि का उपयोग कर सकते हैं।
  • हमें सारे पेज को अलग-अलग बनाने पड़ते हैं क्योकि हम इसमें लॉजिकल टास्क perform नही कर सकते।
  • केवल HTML से हम अपने वेब पेज को अच्छे डिजाईन नही कर सकते, इसके लिए CSS का उपयोग करना पड़ता है।
  • Interactive web pages नही बना सकते।
  • ब्राउज़र नये वर्शन को बहुत ही धीरे से एडाप्ट कर पाते हैं।
  • कुछ टैग्स ऐसे होते हैं जिसका रिजल्ट हमें अलग-अलग ब्राउज़र पर अलग दिखाई दे सकता है।
  • अगर ब्राउज़र पुराने हैं तो वे एचटीएमएल के नये टैग्स को समझ नही पाते हैं और उसे रेंडर नही कर पाते।

एचटीएमएल कैसे सीखें? How to Learn HTML in Hindi?

एचटीएमएल सीखना बहुत ही आसान है आजकल तो छोटे-छोटे बच्चे स्कूल में इसे सीख जाते हैं। अगर कोई व्यक्ति चाहे तो एचटीएमएल में कोडिंग कैसे किया जाता है इसे सिर्फ 20 मिनट में सीख सकता है।

हमने एचटीएमएल सिखाने के लिए एक 20 मिनट का HTML Tutorial बनाया है जिसे आप पढ़ सकते हैं और उसे प्रैक्टिस कर सकते हैं।   सीखने के लिए क्या करें:

  • HTML Tutorial को एक बार अच्छे से पढ़ें
  • किसी कोड एडिटर में इन कोड्स को लिखकर देखें
  • खुद का वेब पेज बनायें और अलग-अलग tags का उपयोग करें
  • किसी html site जैसे स्कूल या कॉलेज की static website को देखें और समझें
  • उस वेबसाइट की तरह अलग-अलग वेबपेज बनायें और सबमे अलग-अलग कंटेंट डालें
  • अब इन pages को आपस में लिंक करें

अगर आप इस तरह से प्रैक्टिस करते हैं तो बड़ी आसानी से HTML सीख जायेंगे और आपको टैग्स याद रखने की जरुरत नही पड़ेगी।  

हमें उम्मीद है की आपको यह आर्टिकल (HTML kya hai?) पसंद आया होगा। इस बारे में आप अपने सवाल या विचार निचे कमेंट में जरुर रखें।

Default image
Vivek Vaishnav
नमस्कार, मैं विवेक, WebInHindi का founder हूँ। इस ब्लॉग से आप वेब डिजाईन, वेब डेवलपमेंट, Blogging से जुड़े जानकारियां और tutorials प्राप्त कर सकते हैं। अगर आपको हमारा यह ब्लॉग पसंद आये तो आप हमें social media पर follow कर हमारा सहयोग कर सकते हैं|

Newsletter Updates

Enter your email address below to subscribe to our newsletter

One comment

  1. Very helpful information thanks for sharing

Leave a Reply

Copy link