HTML NOTES

Introduction Of HTML

Internet पर उपलब्ध सारा डेटा वेब डॉक्युमेंट्स के रूप में उपलब्ध है. इन डॉक्युमेंट्स को कम्प्यूटर सर्वर पर सेव कर दिया जाता है. जहाँ से URL के जरिए इन्हे कोई भी एक्सेस कर सकता है.

क्या आपने कभी सोचा है ये वेब डॉक्युमेंट कैसे बनाते है? किस भाषा में लिखा जाता है, कौन वेब डॉक्युमेंट्स को लिखता है?

यदि आपके पास कोई जवाब नहीं है तो कोई बात. क्योंकि इसका जवाब हम आपको दे रहे हैं.

वेब डॉक्युमेंट्स को HTML Language में लिखा जाता है. जो एक मार्कअप लैंगुएज है. यह वेब डॉक्युमेंट्स का आधार होती है.

अब सवाल आता है यह HTML क्या होती है – What is HTML in Hindi?

कितना आसान सुनाई पढता है. एक साधारण सवाल है. हाँ साधारण, लेकिन एक उपयोगी प्रश्न जो प्रत्येक HTML सीखने वाले को जानना जरूरी है. क्योंकि यह तो बुनियाद है.

हम जिस भाषा में कार्य कर रहे है या चाहते है उसके बारे में तो हमें पता होना ही चाहिए. आइए, जानते है कि HTML क्या है?

---

HTML क्या है?

HTML एक MarkUp Language है, जिसे वेब डॉक्युमेंट (वेब पेज) बनाने के लिए विकसित किया गया है. इसका विकास 90 के दशक में हुआ था. यह एक वेब पेज का आधार होती है और वेब पेज एक वेबसाइट का आधार होते है. HTML वेब डॉक्युमेंट को बनाने के किए ‘Tags’ का इस्तेमाल करती है.

HTML Full Form in Hindi

HTML की Full Form या पूरा नाम Hypertext Markup Language होता हैं. जिसमें प्रत्येक शब्द का अलग-अलग मतलब होता हैं. आइए अब प्रत्येक शब्द का अर्थ जानते हैं. और समझते है कि HTML को Markup Language क्यों कहा जाता हैं?

Hypertext

हाइपरटेक्स्ट वह तरीका है जिसके द्वारा वेब को Explore किया जाता है. यह एक साधारण टेक्स्ट ही होता है. लेकिन, Hypertext अपने साथ किसी अन्य टेक्स्ट को जोड़े रखता है. जिसे माउस क्लिक, टैप से या कुंजि दबाकर सक्रिय किया जाता है.

इसकी यही विशेषता इसे साधारण टेक्स्ट से अलग करती है. हाइपरटेक्स्ट को हाइपरलिंक कहते है.

HTML के Anchor (< a >) Tags के द्वारा किसी भी टेक्स्ट को हाइपरलिंक बनाया जा सकता है. इसके अलावा, इमेज्स, वीडियो, साउण्ड आदि को भी हाइपरलिंक बनाया जा सकता है. इस प्रकार का लिंक डेटा Hypermedia कहलाता है.

Hypertext की एक और विशेषता होती है कि यह रेखीय (linear) नही होता है अर्थात हाइपरटेक्स्ट को किसी भी क्रम में सक्रिय किया जा सकता है.

Markup

HTML वेब डॉक्युमेंट बनाने के लिए “HTML Tags” का उपयोग करती है. प्रत्येक HTML Tag अपने बीच आने वाले टेक्स्ट को किसी प्रकार में परिभाषित करता है. इसे ही Markup कहते है. “<i>” एक HTML Tag है जो अपने बीच आने वाले टेक्स्ट को तिरछा (italic) करता है.

इसे एक उदाहरण से समझते है.

हम एक शब्द लेते है, ‘TutorialPandit’ जिसे साधारण लिखा गया है. जो हमें आम टेक्स्ट की तरह ही सीधा “TutorialPandit” दिखाई दे रहा है. अब हम इसे HTML के द्वारा Markup करते है. और Markup मे हम इसे तिरछा करते है. जब TutorialPandit को इन दोनो चिन्हों <i> </i> के बीच इस तरह <i>TutorialPandit</i> लिखा जायगा तो यह शब्द इस तरह तिरछा “TutorialPandit” दिखाई देगा. अर्थात इसे तिरछा (italic) Markup किया गया है.

इस पूरी प्रक्रिया को ही मार्क अप करना कहता है. और वेब पर मौजूद सभी वेब डॉक्युमेंट इसी तरह फॉर्मेट किए जाते हैं.

Language

HTML एक भाषा है. क्योंकि यह वेब डॉक्युमेंट बनाने के लिए code-words का इस्तेमाल करती है. जिन्हें Tags कहते है. और इन Tags को लिखने के लिए HTML का syntax भी है. इसलिए यह एक भाषा भी है. नीचे HTML का Syntax दिखाया गया है.

इसके तीन मुख्य भाग होते है. जो क्रमश: Element, Tags और Text है.

HTML Element, HTML Tag से मिलकर बनता है. Angel Bracket के बीच जो शब्द या अक्षर लिखा होता है, इसे HTML Tag कहते है. यह दो प्रकार का होता है. पहला, Opening tag और दूसरा Closing tag. और अंतिम भाग होता है टेक्स्ट जो HTML Tag के बीच लिखा जाता है.

इसे भी पढें: CSS क्या है?

---

HTML का इतिहास – HTML History in Hindi

आइए अब हम HTML की दुनिया में थोड़ा पीछे चलते है और इसके इतिहास को जानने कि एक कोशिश करते है.

HTML का विकास 90 के दशक में हुआ था और अभी भी जारी है. क्योंकि HTML एक लगातार विकास करने वाली भाषा है. इसके अब तक कई संस्करण आ चुके है.

यह भाषा माननीय Sir Tim Berners Lee के दिमाग की उपज है. सबसे पहले इन्होने ही HTML का उपयोग किया था.

वर्तमान समय में HTML के विकास का जिम्मा एक संस्था “World Wide Web Consortium (W3C)” के पास है. यह संस्था ही अब HTML का ख्याल रखती है. आइए जानते है अब तक आए HTML के संस्करणों के बारे में.

HTML

यह संस्करण SGML –Standard Generalized Markup Language का रूप था. HTML प्राथमिक संस्करण है.

इसके द्वारा टेक्स्ट को Structure किया जा सकता था. इसके लिए कुछ Tags का निर्माण किया गया था और इस संस्करण का कोई नाम नही था इसे सिर्फ HTML कहा गया. लेकिन HTML के अगले संस्करणो के नाम थे. इसलिए सुविधा के लिए इस संस्करण को HTML 1.0 भी कहा जाता है.

जो HTML Tags इस समय उपयोग में लिये जाते थे, कुछ Tags आज भी मौजूद है. जो हम HTML पर कार्य करते समय काम में लेते है.

HTML 2.0

HTML के प्राथमिक संस्करण के बाद एक समूह IETF – Internet Engineering Task Force द्वारा HTML के अगले संस्करण का नामकरण किया गया. यह HTML 2.0 संस्करण कहलाया जिसे 1995 में प्रकाशित किया गया था.

इस संस्करण में कुछ नयी विशेषताएँ जोड़ी गई जिसमें ‘Image Tag‘ सबसे महत्वपूर्ण था. लेकिन अभी Internet ज्यादा लोकप्रिय नही हुआ था.

HTML 3.0

इस समय तक HTML और इंटरनेट अपनी छाप छोड चुके थे और दोनो लोकप्रिय होने लगे थे. अब पहल से ज्यादा लोग इससे जुड चुके थे. अधिक से अधिक लोग HTML सीखना चाहते थे और Internet से जुडना भी चाहते थे.

इसलिए HTML के अधिक उपयोग के कारण इसमे कुछ उलझने पैदा हो गई थी. जो Standard इसमें तय किया था लोग उसमें परिवर्तन करने लगे थे. जिससे इसकी एकरूपता समाप्त होने लगी थी. इसलिए HTML का अगला संस्करण तैयार किया गया जो HTML 3.0 था. लेकिन इसे कभी भी प्रकाशित नही किया गया.

HTML 3.2

HTML 1.0 के प्रकाशन और HTML 3.0 की सिफारिश तक एक संगठन का उद्भव हो चुका था, जो HTML भाषा के लिए कार्य करने के लिए बना है. इसे W3C – World Wide Web Consortium के नाम से जाना जाता है.

W3C के द्वारा 1997 में HTML 3.0 की सिफारिशों के साथ HTML का अगला संस्करण HTML 3.2 का प्रकाशन किया गया. इसमें HTML के दोनों संस्करणों से ज्यादा विशेषता थी.

HTML 3.2 के द्वारा अब HTML Document को और अधिक तरीके से बनाया जा सकता था. इस संस्करण में कई नये ‘Attribute’ को जोडा गया जो डॉक्युमेंट के structure से ज्यादा उसकि ‘style’ के लिए थे. लेकिन, इस समय तक HTML को पढ़ने वाले यानि ‘ Browsers ‘ बहुत धीमें थे. ये अभी भी HTML 3.2 के सभी विशेषताओं को सपोर्ट नही करते थे.

HTML 4.0

अब Internet काफि लोकप्रिय हो चुका था. अधिक से अधिक लोग HTML सीखना चाहते थे. और जो पहले से ही इससे जुड़े थे. वे HTML से ज्यादा चाहने लगे. इसलिए इस रिक्त स्थान को भरने करने के लिए HTML का अगला संस्करण HTML 4.0 का प्रकाशन किया गया.

और अब तक ‘Style Sheet’ भी अपना स्थान बनाने लगी थी. इसलिए इस संस्करण में कुछ और विशेषताएं जैसे; frame, script, stylesheet आदि को जोडा गया. और इसे पढने वाले ब्राउजर भी अब कुछ एडवांस हो चुके थे. तथा HTML के अधिकतर विशेषताओं को पढ सकते थे. यह HTML के इतिहास में एक बड़ा बदलाव था.

HTML 4.01

HTML का अगला संस्करण HTML 4.01 था जो HTML 4.0 का संशोधित संस्करण है. इसे W3C द्वारा 1999 में प्रकाशित किया गया था. आज लगभग वेबसाइट इसी संस्करण में बनी हुई है.

HTML 5

HTML का सबसे नवीनतम संस्करण HTML 5 है. इसमे HTML 4.01 कि विशेषताओं के अलावा XML कि विशेषताओं को भी जोडा गया है. यह संस्करण धीरे-धीरे अपनी पहचान बना रहा है. और काफि लोकप्रिय हो चुका है.

---

HTML का उपयोग कहाँ और कैसे किया जाता है?

HTML का उपयोग कहाँ किया जाता है?

यह एक साधारण और बेतुका सवाल लग सकता है. मगर, इसे गहराई से सोचने पर इसकी असलियत का पता चलता है.

आप पहले ही जान चुके है कि एचटीएमएल का उपयोग वेब डॉक्युमेंट बनाने के लिए किया जाता है. मगर, यह सिर्फ वेब डॉक्युमेंट बनाने तक सीमित नहीं है.

क्योंकि HTML वेब का आधार है. इसके बिना वेब का निर्माण की कल्पना भी नहीं की जा सकती है.

HTML Document बनाने के अलावा इसका उपयोग यहाँ भी खूब किया जाता है.

• Web Page Development
• Navigation
• Game Development
• Responsive Graphics
• Web Document Formatting

हमने ये तो जान लिया है कि HTML का उपयोग (HTML Uses in Hindi) कहाँ किया जाता है.

आइए, अब जानते है इसे कैसे इस्तेमाल करते है. अर्थात HTML से वेबपेज (वेब डॉक्युमेंट) कैसे बनाते है?

एचटीएमएल से वेबपेज बनाना बहुत ही आसान है. इसे हम एक उदाहरण से समझते है.

निर्देश:-

• नीचे जो HTML Code दिया गया है. उसे हू-ब-हू कॉपी कीजिए.
• फिर इस कोड को किसी टेक्स्ट एडिटर प्रोग्राम (नोटपेड) में पेस्ट कर दीजिए.
• इसके बाद इस फाइल को .html फाइल एक्सटेंशन लगाकर सेव कर दीजिए.
• सेव करने के बाद इस फाइल को किसी भी ब्राउजर में ओपन करें.
• आपका वेबपेज तैयार हो गया है.

HTML Example:

 <!DOCTYPE HTML>
<HTML>
<HEADER>
<TITLE>My First HTML Document</TITLE>
</HEADER>
<BODY>
<H1>This is Heading of Document</H1>
<P>This is first paragraph of this document.</P>
<P>This is second paragraph of this document. You can add as many paragraphs as possible like this.</P>
</BODY>
</HTML> 

HTML को सीखने के लिए आवश्यक Tools और Skills क़े बारे में जानीए.

HTML Codes लिखने के लिए और HTML से Website बनाने से पहले ये जानना जरूरी है कि आप और आपका Computer HTML Codes लिखने के लिए बिल्कुल तैयार है? क्योंकि HTML को लिखने और HTML से Website बनाने के लिए कुछ Technical Skills और Tools की जरूरत पडती है. जिनकी सहायता से HTML Codes को लिखा और देखा जाता है.
इस Lesson में हम आपको HTML Codes को लिखने के लिए आवश्यक Technical Skills और कुछ जरूरी Right Tools के बारे में ही बताऐंगे. ताकि यह पक्का हो सके कि आप और आपका कम्प्युटर HTML Codes से Webpage बनाने के लिए बिल्कुल तैयार है. इस Lesson को हमने निम्न भागों में विभाजित किया है.

1. HTML लिखने के लिए आवश्यक Technical Skills

1. Computer Fundamentals का ज्ञान – Knowledge of Computer Fundamentals

HTML लिखने के लिए सबसे जरूरी है आपको Computer Fundamentals की Knowledge होनी चाहिए. इसके लिए आपको कुछ Computer Basics Functions के बारे मे अच्छी तरह से पता होना चाहिए. आपको कम्प्युटर को चालु करना, कम्प्युटर मे फोल्डर बनाना, कम्प्युटर में फाईल सेव करना, पहले से Save File को Open करना, किसी भी Computer Program को Run करना और उसे Close करना आदि Basics Tasks आना जरूरी है.
यदि आपको Computer Fundamentals की जानकारी नही है, तो आप हमारे Computer Tutorials को पढकर Computer Basics की जानकारी हिंदी में ले सकते है. क्योंकि हमारे Computer Tutorials Hindi भाषा में उपलब्ध है.

2. Keyboard की जानकारी – Knowledge of Keyboard

यदि आपको Computer Programming की जानकारी है तो आप अच्छी तरह से जानते होंगे? कि Programming Languages की Coding की जाती है. इसी तरह HTML Language की भी Coding की जाती है. इसी तरह HTML Coding को HTML Tags के माध्यम से किया जाता है. जिसके लिए हमे की-बोर्ड का उपयोग करना पडता है. इसलिए आपको कम्प्युटर की-बोर्ड की जानकारी भी होना जरूरी है.
आपको की-बोर्ड में उपलब्ध बटनों (Keys) के नाम पता होना चाहिए और Keyboard Keys का उपयोग करना भी आना जरूरी है. हमने Computer Keyboard और इसके उपयोग के बारे में एक Lesson अलग से बनाया हुआ है. आप इस Lesson को पढकर की-बोर्ड के बारे में पूरी जानकारी ले सकते है.

HTML लिखने के लिए जरुरी Right Tools

HTML के लिए जरुरी Right Tools के बारे में आपको सही जानकारी होना जरूरी है. क्योंकि कुछ लोग समझते है कि HTML Coding करने के लिए हमे बाहर से Tools खरीदने पडते है. लेकिन, ये बात बिल्कुल सही नही है. क्योंकि आपके कम्प्युटर में पहले से ही ये Tools उपलब्ध है. और आपको इनके लिए एक पैसा भी खर्च नही करना है.
तो आईए जानते है कि HTML Programing करने के लिए जरूरी Tools कौन-कौनसे है? और इन Tools का नाम क्या है? और ये Tools आपके कम्प्युटर में कहाँ उपलब्ध है?

1. Text Editor

HTML Document एक Simple Text File होती है. जिसके लिए हमें एक Simple Text Editor की जरूरत पडती है. आप इस कार्य के लिए Notepad का उपयोग कर सकते है. जो आपके Windows PC में पहले से ही Install होता है.
Notepad HTML Code लिखने के लिए एक Perfect Tool है. इसलिए आप HTML Document बनाने के लिए Notepad का उपयोग ही करें. HTML Coding के लिए Rich Text Editor जैसे MS Word का उपयोग बिल्कुल ना करें.

2. Web Browser

HTML Coding को पढने के लिए Web Browser की जरूरत पडती है. यदि आप एक HTML Document को Notepad में Open करेंगे तो आपको HTML Tags के अलावा कुछ नही दिखेगा.
इसलिए HTML Tags को समझने के लिए ब्राउजर का उपयोग किया जाता है. एक इंटरनेट ब्राउजर HTML Tags को समझता है और उसके अर्थ को हमे दिखाता है. जैसे हम HTML Document में Heading लिखना चाहता है. तो इसके लिए हम HTML Heading Tags का उपयोग करते है. Browser इस HTML Heading Tags को पढता है और इसे समझता है. इसके बाद हमे Heading दिखाता है.
आपके कम्प्युटर में पहले से ही एक सुरक्षित और उपयोगी ब्राउजर Install रहता है. जिसका नाम Internet Explore है. इसे सिर्फ IE के नाम से भी जानते है. आप इसके अलावा Google Chrome या फिर Mozilla Firefox का भी इस्तेमाल कर सकते है.