HTML क्या है अर्थ समझाइए | Explained in Hindi [PDF]

अलग-अलग चीजों की अलग-अलग भाषाएँ होती है। जिस तरह हिन्दी, इंग्लिश इंसानों की भाषाएं हैं ठीक उसी तरह HTML,  CSS और JAVASCRIPT इंटरनेट की भाषाएं हैं।

 

यह तो हम सब जानते हैं कि इंटरनेट, दुनिया भर के कंप्युटर्स का नेटवर्क है जो एक-दूसरे से जुड़े रहकर डेटा (email, SMS, Text, Videos) का आदान-प्रदान करता है। इस डेटा को अपने कंप्युटर से इंटरनेट पर भेजने (upload) या फिर इंटरनेट से डेटा को अपने सिस्टम पर रिसीव (download) करने के लिए कई Computer Languages की जरूरत पड़ती है, जिसमें से सबसे बेसिक लैंग्वेज HTML है।



 1). एचटीएमएल क्या है? (What is HTML Coding)

एचटीएमएल एक Mark-up Language है जो इंटरनेट पर मौजूद webpages को लिखने के काम आती है।

 

वेबपेजेस को लिखने के काम… मतलब?

 

मतलब ये कि वेबसाइट बनाने वाले लोग (यानि Web Developers) वेबसाइट को पहले HTML लैंग्वेज में लिखते हैं और फिर उसे Server पर अपलोड देते हैं। इसके बाद, जब हम उस वेबसाइट को अपने ब्राउजर की मदद से ओपन करते हैं तो उनके द्वारा लिखा गया HTML CODE हमारे ब्राउजर में आ जाता है और हमारा ब्राउजर उस HTML Code को ट्रैन्स्लैट करके हमें एक सुंदर सी वेबसाइट दिखा देता है।

मिसाल के तौर पर, इस वेबसाइट पर, जहाँ आप यह आर्टिकल पढ़ रहे हैं, कुछ इस तरह का HTML CODE लिखा गया है (Ctrl+ U to see) …

dark webpage with html code

जिसे आपका ब्राउजर ट्रैन्स्लैट करके कुछ इस तरह आपको दिखा रहा है…

darkmode webpage rendering in browser

 

विकिपिडिया HTML को इस प्रकार define  करता है-

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

 

एचटीएमएल का पूरा नाम (HTML FULL FORM)

HTML का फुल फॉर्म Hyper Text Markup Language है जिसमें HyperText का मतलब “एक पेज को दूसरे पेज से लिंक करना” होता है जबकि  MarkUp का मतलब tags से होता है। HTML में हर एक चीज TAGS की मदद से की जाती है इसलिए यह एक Markup language है। XML एक अन्य मार्कअप लैंग्वेज है।

 

↓ DOWNLOAD THIS ARTICLE (AS PDF)

 

एचटीएमएल का इतिहास (History of HTML)

एचटीएमएल को टिम बरनर्स ली ने खासतौर पर webpages को बनाने के लिए डिवेलप किया था। वे चाहते थे कि world wide web (www) में कोई एक ऐसी कॉमन भाषा जरूर हो जिससे कोई भी व्यक्ति website बना सके और उस भाषा को इंटरनेट का प्रत्येक ब्राउजर सपोर्ट करता हो।

 

1990 में टिम बरनर्स ली ने world wide web का पहला ब्राउजर बनाया जिसका नाम भी उन्होंने “WorldWideWeb” ही रखा। यह ब्राउजर webpages को बनाने, उन्हें access करने और edit करने के काम आता था और यह HTML को पूरी तरह से सपोर्ट करता था।

 

ed. Note- वेब की शुरुआत में webpages में सिर्फ HTML होती थी। लेकिन आजकल webpages में HTML के अलावा CSS और Javascript भी use की जाती है। Javascript और CSS के बिना भी हम webpages बना सकते हैं हालांकि बिना HTML के वेबपेजेस बनाना मुमकिन नहीं है। क्योंकि HTML पर ही वेब टिका हुआ है और CSS और JAVASCRIPT HTML TAGS के ऊपर ही काम करती है।

 

अगर वेबपेज को हम एक इंसान मानें तो HTML को हम उसका हड्डियों का ढांचा (Skeleton) मानेंगे; CSS को हम उसकी Skin मानेंगे और Javascript को उसका Brain और Nervous System मानेंगे

 

 

 

2). एचटीएमएल के प्रकार (HTML Versions)

i. HTML 1.0 (1993) –

एचटीएमएल के पहले वर्ज़न को 1993 में रिलीज किया गया था। इसमें बहुत ही basic text और image फीचर्स मौजूद थे। जैसे- <p> <image> | W3C (जो HTML की parent organisation है) इस वर्ज़न के बाद बनी थी इसलिए उनके पास इस वर्ज़न को लेकर कोई जानकारी नहीं है।

ii. HTML 2.0 (1995)-

इस वर्ज़न में एचटीएमएल को improve किया गया। इसमें <form> and <html> जैसे टैग्स को शामिल किया गया। हालांकि अब भी फॉर्म में  <button> <box> जैसे कुछ बेसिक फीचर्स ही मौजूद थे। इस वर्ज़न में HTML के standardisation पर काफी ध्यान दिया गया और इसे प्रत्येक ब्राउजर के लिए standard बनाने की पहल की गई।

iii. HTML 3.2 (1997)-

इस वर्ज़न में एचटीएमएल को बेहतर बनाया गया और उसमें HTML TAGS को सुंदर बनाने के लिए CSS सपोर्ट को ऐड किया गया।

iv. HTML 4.01 (1999)-

एचटीएमएल 3.2 में CSS सपोर्ट जोड़ा गया था हालांकि उसमें सिर्फ inline CSS लिख सकते थे यानि अलग से CSS फाइल बनाने का फीचर नहीं था। हालांकि 4.01 में यह फीचर जोड़ा गया।

v. HTML 5 (2014)-

एचटीएमएल का सबसे नया वर्ज़न। इसमें <email>, <password>, <audio>, <section> जैसे टैग्स को जोड़कर HTML को एक पावरफुल लैंग्वेज बना दिया गया।




3). HTML के तत्व या विशेषता क्या है? (HTML Features)

  1. HTML सीखने में कंप्युटर की सबसे ज्यादा आसान भाषा है। इसे आप एक दिन में आराम से सीख सकते हैं।
  2. यह इंटरनेट पर वेबपेजेस को बनाने की एक मात्र standardised भाषा है जिसे दुनिया का हर browser support करता है।
  3. HTML Platform independent भाषा है यानि आप चाहे android से web access कर रहे हों या फिर विंडोज़ से या फिर मैक से.. यह सबमें सपोर्ट करेगी।
  4. HTML 5 के द्वारा हम webpages में text, hyperlinks, images, videos और audio जोड़ सकते हैं।

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

  • वेब पेज बनाने में (Web page development)
  • वेब डॉक्यूमेंट बनाने में (Web document Creation)
  • वेब चलाने में (Internet navigation)
  • वेब पर इमेजेस को रीस्पान्सिव बनाने में (Responsive images on web pages)
  • क्लाइंट साइड स्टॉरिज में (Client-side storage)
  • ऑफलाइन कैपेबिलिटीस उपयोग में (Offline capabilities usage)
  • एचटीएमएल डाटा एंट्री भी सपोर्ट करती है (Data Entry support with HTML)

 

4). एचटीएमएल टैग क्या है (HTML Tags)

HTML एक मार्क-अप लैंग्वेज है और मार्क-अप मतलब TAG होता है। इसलिए HTML में हर काम tags की मदद से किया जाता है।

 

HTML टैग्स दो तरह के होते हैं-

OPENING-CLOSING TAGS- ये टैग्स एक तरह शुरू होते हैं और दूसरी जगह खत्म होते हैं। इनके बीच ही कोड लिखा जाता है। e.g. <html> (we write code here) </html>

SELF-CLOSING TAGS- ये टैग शुरू होकर वहीं पर क्लोज़ हो जाते हैं. e.g. <input (code here) />, <br/>, <hr/>, <image/>

 

अब जानते हैं इन टैग्स को use कैसे करते हैं-

जब हम HTML 5 में कोई वेबपेज बनाते हैं तो उसकी पहली लाइन कुछ इस तरह लिखते हैं-

 

1. <!DOCTYPE html> 

यह लाइन लिखना optional है क्योंकि यह ब्राउजर को बताती है कि हम HTML का 5 वर्ज़न use करने जा रहे हैं।

2. <html>

इस टैग से ब्राउजर को पता चलता है कि यहाँ से html document शुरू हो रहा है। आखिर में हम इस टैग को </html> closing tag के साथ बंद कर देते हैं।

 

3. <head>

यह टैग वेबपेज के डॉक्यूमेंट के upper part को map करने के काम आता है। इसमें हम वो चीजें लिखते हैं जिन्हें हम सबसे पहले load करना चाहते हैं। जैसे- <title> </title> आखिर में इसे बन कर देते हैं।

 

4. <body>

यह सबसे important tag है और इसके अंदर हम अपने webpage का ज्यादातर हिस्सा लिखते हैं। और फिर इसे बंद कर देते हैं।

 

NOTE- कुछ टैग्स होते हैं जिनके अंदर हम दूसरे tags को लिख सकते हैं। जैसे- <html> के अंदर हम html के हर एक टैग को लिख सकते हैं। जबकि <head> के अंदर हम सिर्फ <title> टैग को। बॉडी के अंदर भी हम कई tags को लिख सकते हैं।

 

HTML COMMENTS- कई बार HTML डॉक्यूमेंट में हम ऐसा text लिखना चाहते हैं जो कोड नहीं है। उसे हम कमेंट्स के बीच लिखते हैं। e.g. <!– write comment here –> कमेंट्स को ब्राउजर ignore कर देता है क्योंकि यह वेबसाईट बनाने वाला खुद के notes के लिए लिखता है।

HTML ATTRIBUTES-

एचटीएमएल टैग्स को और बेहतर बनाने के लिए ATTRIBUTES की जरूरत पड़ती है। जैसे- <img tag में src=”” and width=”” height=”” attributes उपयोग होते हैं। इन्हें tags के अंदर ही लिखा जाता है।



5). एक बेसिक HTML DOCUMENT-

यह एक सिम्पल HTML webpage है जिसे आप अपने कंप्युटर पर चला सकते हैं।

 

इस html को कैसे run करें?

 

5). HTML EDITOR-

NOTEPAD हम सबके सिस्टम में होता है। उसमें आपको सही HTML CODE लिख लेना है। इसके बाद आपको उस फाइल को .html extension के साथ save कर देना है (mypage.html) और फिर जहाँ वह file saved है वहाँ पे जाके उसके naam पे क्लिक कर देना है। (note- एचटीएमएल फ़ाइल आपको browser के icon के रूप में दिखती है)

 

Note- Smartphone या टैबलेट पर भी आप notepad डाउनलोड करके इसी तरह से html सिख सकते हैं। या फिर आप online html editors की मदद से भी कर सकते हैं।

 

 

6). HTML5 Tags List

  1. <a> </a> = link tag
  2. <input/> = form input field
  3. <button> </button>= to display button
  4. <image/>= to display image
  5. <video> = for video
  6. <table> </table> = to create a table
  7. <audio> = to insert audio files
  8. <time> = for time
  9. <style> = to link CSS file with HTML
  10. <script> = to link javascript file with HTML

 

HTML वर्ल्ड वाइड वेब की सबसे आसान और fundamental language है। इसे आप tutorials की मदद से बेहद आसानी से 2 दिन में सीख सकते हैं-

 

7). HTML सीखने के RESOURCES-

इंटरनेट पर एचटीएमएल सीखने के हजारों रिसोर्सेज मौजूद हैं जिनमें से सबसे पुराने और बेहतरीन resources हैं-

1. W3Schools (official w3 consortium learning platform)

2. Mozila Developers

3. freeCodeCamp



8). क्या HTML एक प्रोग्रामिंग लैंग्वेज है? (IS HTML PROGRAMMING LANGUAGE)

एचटीएमएल एक प्रोग्रामिंग लैंग्वेज नहीं है क्योंकि प्रोग्रामिंग लैंग्वेज में logical concepts होते हैं HTML में नहीं है। HTML एक सिम्पल मार्कअप लैंग्वेज है क्योंकि एचटीएमएल tags यानि markup पर आधारित है।

Navin Rangar

I write here.

52 thoughts on “HTML क्या है अर्थ समझाइए | Explained in Hindi [PDF]

  • June 16, 2022 at 11:37 pm
    Permalink

    Hmm it seems like your website ate my first comment (it was extremely long) so I guess I’ll just sum it up what I submitted and say, I’m thoroughly enjoying your blog. I as well am an aspiring blog writer but I’m still new to the whole thing. Do you have any helpful hints for novice blog writers? I’d genuinely appreciate it.

    Reply
  • June 30, 2022 at 12:14 am
    Permalink

    [url=https://viagrajtabs.monster/]sildenafil tablets 100mg australia[/url]

    Reply
  • July 3, 2022 at 8:33 pm
    Permalink

    [url=http://doxycycline.digital/]buy doxycycline tablets 100mg[/url]

    Reply
  • July 9, 2022 at 1:11 am
    Permalink

    [url=https://retina.boutique/]order tretinoin cream online[/url]

    Reply
  • July 9, 2022 at 2:34 am
    Permalink

    [url=https://cialis2022.online/]cheap generic cialis online canadian pharmacy[/url]

    Reply
  • July 12, 2022 at 9:54 am
    Permalink

    [url=https://albuterol.digital/]cheapest albuterol 90 mcg[/url] [url=https://propecia.email/]propecia cost india[/url] [url=https://tadalafilaim.com/]tadalafil for sale uk[/url] [url=https://zanaflex.guru/]zanaflex otc[/url] [url=https://aralen.us.com/]aralen india[/url]

    Reply
  • July 13, 2022 at 11:36 am
    Permalink

    [url=https://zovirax.store/]acyclovir 200 mg tablets price[/url]

    Reply
  • July 15, 2022 at 11:39 am
    Permalink

    I don’t normally comment but I gotta say regards for the post on this amazing one : D.

    Reply
  • August 12, 2022 at 9:20 am
    Permalink

    [url=https://prednisone.works/]generic prednisone tablets[/url]

    Reply
  • August 12, 2022 at 8:32 pm
    Permalink

    [url=https://hydrochlorothiazide.boutique/]hydrochlorothiazide online pharmacy[/url]

    Reply
  • August 12, 2022 at 9:45 pm
    Permalink

    [url=http://buygabapentin.store/]order gabapentin online without prescription[/url]

    Reply
  • August 13, 2022 at 11:37 pm
    Permalink

    [url=https://buysuhagra.store/]suhagra 50 mg price[/url] [url=https://cialisytabs.monster/]tadalafil soft 20 mg[/url] [url=https://promethazine.store/]phenergan over the counter in canada[/url] [url=https://viagraatab.quest/]viagra soft tabs 100mg pills[/url]

    Reply
  • August 14, 2022 at 6:51 pm
    Permalink

    [url=https://motilium.site/]motilium without prescription[/url] [url=https://hydroxychloroquine.media/]quineprox 80 mg[/url] [url=https://azithromycin.sbs/]azithromycin 788[/url] [url=https://femaleviagra.cfd/]female viagra paypal[/url] [url=https://trazodone.loan/]trazodone prescription uk[/url] [url=https://trental.cfd/]buy trental 400[/url]

    Reply
  • August 15, 2022 at 10:42 am
    Permalink

    [url=https://propranolol.site/]inderal 20 mg tablet[/url] [url=https://metformin.bid/]metformin hcl 1000[/url] [url=https://sumycin.site/]tetracycline cream[/url]

    Reply
  • August 16, 2022 at 2:44 am
    Permalink

    [url=https://hydroxychloroquine.media/]plaquenil generic brand[/url]

    Reply
  • August 16, 2022 at 5:41 pm
    Permalink

    [url=https://erythromycin.store/]erythromycin 50 mg[/url] [url=https://vardenafil.company/]generic 100 mg levitra[/url] [url=https://propecia.boutique/]where can i buy generic propecia[/url] [url=https://retinatretinoincream.com/]tretinoin 25 mg[/url] [url=https://tabssale.com/]carafate liquid price[/url]

    Reply
  • August 17, 2022 at 10:13 am
    Permalink

    [url=http://sumycin.site/]buy tetracycline cream[/url] [url=http://ciprofloxacin.site/]cipro 500 mg[/url] [url=http://amoxicillin.party/]amoxicillin capsules 250mg[/url] [url=http://escitalopram.fun/]lexapro uk prescription[/url] [url=http://lopressor.site/]lopressor for sale[/url] [url=http://viagrautab.monster/]viagra online canada[/url] [url=http://tizanidine.site/]tizanidine brand name[/url]

    Reply
  • August 19, 2022 at 1:03 am
    Permalink

    [url=http://buysildalis.store/]discount sildalis 120mg[/url]

    Reply
  • August 21, 2022 at 10:31 am
    Permalink

    [url=https://triamterene.cfd/]triamterene 37.5mg hctz 25mg caps[/url] [url=https://tamoxifen.fun/]how to buy nolvadex online[/url] [url=https://allopurinol.xyz/]allopurinol over the counter[/url] [url=https://glucophage.site/]buy metformin 500[/url] [url=https://sildenafil.site/]buy viagra online cheap usa[/url] [url=https://prednisolone.fun/]where can i buy prednisolone uk[/url] [url=https://diflucan.xyz/]over the counter diflucan[/url] [url=https://suhagra.fun/]suhagra tablet online[/url]

    Reply
  • August 22, 2022 at 9:37 am
    Permalink

    [url=https://prozac.media/]buy cheap fluoxetine online[/url]

    Reply
  • August 23, 2022 at 9:23 am
    Permalink

    [url=http://hydroxychloroquine.business/]hydroxychloroquine 900 mg[/url]

    Reply
  • August 23, 2022 at 12:47 pm
    Permalink

    [url=https://sildalis.fun/]sildalis without prescription[/url]

    Reply
  • August 25, 2022 at 6:58 am
    Permalink

    [url=https://strattera.cfd/]strattera 25 mg generic[/url] [url=https://chloroquinepills.quest/]chloroquine order[/url] [url=https://wellbutrin.works/]generic zyban cost[/url] [url=https://albenza.online/]albenza costs[/url] [url=https://vermoxmebendazole.store/]vermox tablet price in india[/url] [url=https://lisinopril.email/]lisinopril 3.5 mg[/url] [url=https://elavil.monster/]elavil 25 mg canada[/url]

    Reply
  • August 25, 2022 at 9:17 am
    Permalink

    [url=http://albuterol.fun/]how to buy albuterol tabs online without a prescription[/url]

    Reply

Leave a Reply

Your email address will not be published.

गूगल में नाम और फोटो डालें 7 Desi Indian Search Engines Vlogging क्या है और कैसे शुरू करें? TOP VLOGGERS IN INDIA- BY SUBSCRIBERS 4G vs 5G- कितना फर्क?