आज हम सीखेंगे HTML क्या है और इसका इस्तेमाल कहा होता है HTML का इस्तेमाल हम Blog तथा Website बनाने के लिए करते है HTML का पूरा नाम – Hyper Text Markup Language है.
Hypertext – एक page से दूसरे page में जाने के लिए link होता है जिसे हम hyperlink कहते है जैसे ही हम link पर click करते है तो दूर page पर पहुंच जाते है.
Markup – markup का इस्तेमाल webpage के भीतर tag तथा text को पारिभाषित करने के लिए होता है.
Language – HTML एक programming language है जिसका इस्तेमाल हम webpage बनाने के लिए करते है.
HTML के बहुत सारे version है अभी HTML का latest version HTML5 (2020) चल रहा है अगर आपको HTML की जानकारी नहीं है तो आप एक अच्छी Website नहीं बना सकते है.
Table of Contents
HTML से webpage का निर्माण कैसे करे और website बनाने की प्रक्रिया क्या है
किसी भी website का निर्माण करने के लिए html में हमें सबसे पहले 2 चीज़ों की आवश्यकता होती है.
- Text Editor
- Web Browser
HTML document को लिखने के लिए जिन text editor का इस्तेमाल किया जाता है वह है – Notepad, Notepad++, VS code और Sublime.
Web Browser जैसे – Google Chrome, Mozilaa Firefox, Safari, Internet Explore ये सब web browser है जिनका इस्तेमाल HTML का output जानने के लिए किया जाता है.
इसमें से आप किसी एक text editor तथा web browser को Google से download कर सकते है. अगर आपको सीखना है HTML page का निर्माण कैसे करे तथा HTML के फायदे क्या है तो आपको 3 से 4 दिन का समय लग सकता कि <tag> या <div> कैसे काम करता है जिसके बाद आपको HTML सीखने में बहुत आसानी होगी.
एक tag कैसे काम करता है यह आपने सीख लिया तो आप सारे tag का इस्तेमाल करना सीख जाएंगे क्योकि सारे tag का इस्तेमाल करने का तरीका एक ही होता है मगर काम अलग अलग होता है HTML tag को element भी कहा जाता है.
HTML tag क्या है और HTML tags का इस्तेमाल हिंदी में
बहुत सारे html tag है जिनका इस्तेमाल हम website बनाने के लिए करते है जो tag बहुत महत्वपूर्ण है या जिनका इस्तेमाल बहुत ज्यादा होता है उसके बारे में आगे detail में बताया गया है. html में कोई tag खुलता है तो वह बंद भी होता है जो tag खुलता है उसे हम opening tag कहते है जो tag बंद होता है उसे closing tag कहते है.
<p> = opening tag
</p> = closing tag
जैसे – <p>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <html>, <body>, <title>, <table>, <thead>, <button>, <textarea> आदि.
कोई tag ऐसे होते है जिनमे closing tag नहीं होते है जिन्हें हम opening tag के साथ ही / (slash) लगाकर बंद करते है जिन्हें empty tag कहा जाता है.
जैसे – <input/>, </br> आदि.
html tag को हम capital तथा small दोनों तरीकों से लिख सकते है.
1) HTML में Heading tag क्या है
जब आप कोई website या blog खोलते है जिसमें हमें heading दिखाई देता है heading हमेशा bold मोटे काले अक्षरों में होती है जैसे – HTML में Heading tag क्या है यह एक heading है. html में 6 प्रकार की heading होती है – h1, h2, h3, h4, h5, h6 जिसमें h1 सबसे बड़ी तथा h6 सबसे छोटी heading होती है.
h1 – h1 सबसे बड़ी heading होती है और इसका इस्तेमाल एक webpage में एक ही बार होता है.
h2 – यह h1 से छोटी होती है इसका इस्तेमाल एक webpage में 1 या 2 बार ही होता है.
h3 – ये h2 से छोटी और h4 से बड़ी होती है इसका इस्तेमाल जितनी बार चाहे हम कर सकते है.
h4 – यह h3 से छोटी और h5 से बड़ी होती है इसका इस्तेमाल भी हम जितनी बार चाहे कर सकते है.
h5 – h5, h4 से छोटी heading होती है इसका इस्तेमाल भी कितनी भी बार कर सकते है.
h6 – h6 सबसे छोटी heading होती है इसका इस्तेमाल जितनी भी बार चाहे कर सकते है.
इसके बाद जो सबसे ज्यादा इस्तेमाल किया जाने वाला tag है वह है <p> tag.
2) p tag क्या है
<p> tag का इस्तेमाल paragraph लिखने के लिए होता है जिससे हम अपने website पर कही पर भी paragraph लिख सकते है.
3) img tag क्या है
तीसरा जो सबसे ज्यादा इस्तेमाल किया जाने वाला tag है वह है img website में img tag का इस्तेमाल image लगाने के लिए किया जाता है. और src=”” का इस्तेमाल image का path देने के लिए किया जाता है src का मतलब source होता है और img के साथ alt=”” का इस्तेमाल किया जाना जरुरी है.
alt=”” tag का इस्तेमाल इसलिए किया जाता है क्योकि कभी हम अपने image का गलत path दे देते है या image folder में image नहीं होती है तो उस समय alt के अंदर जो text लिखा होता है वह हमे image नहीं दिखाई दे तो उस समय image की जगह show होता है.
दूसरा हम अपने blog में लगाई गयी image को rank करने के लिए करते है जिससे हमारा blog और image एक साथ rank होता है.
4) HTML में comment क्या होता है
चौथा सबसे महत्वपूर्ण tag है वह है comment tag इसका इस्तेमाल code को comment करने के लिए किया जाता है. जिसके बाद हमें code या उसका output हमें browser में नहीं दिखाई देता है comment को हम हमेशा bracket के अंदर रखते है जैसे –
अगर कोई 2 line या उससे ज्यादा का code है जिसको हमें comment करना है तो उसमें हम close bracket (–>) को last में रखेंगे जैसे –
5) HTML में <a> anchor tag का इस्तेमाल और hyperlink कैसे जोड़ते है
<a> का मतलब anchor होता है जिसका इस्तेमाल हम एक page से दूसरे page या दूसरी जगह जाने के लिए करते है. जैसे header में हम about us या contact पर click करने पर हम दूसरे पेज पर पहुंच जाते है.
<a> के साथ href=”” का इस्तेमाल किया जाता है जिसके अंदर हम दूसरे page में जाने का link देते है. जिसे हम hyperlink कहते है. जिससे हम about पर click करने पर about us वाले page में पहुँच जाते है.
6) div tag क्या है हिंदी में
div का मतलब division होता है इसका इस्तेमाल page या किसी section को divide या अलग करने के लिए किया जाता है. <div> का इस्तेमाल हमेशा <body> tag के अंदर होता है <div> के अंदर आप कुछ भी रख सकते हैं जैसे – image, text, video, <h1>, <p>, <table>, <span> आदि tags को.
HTML page का निर्माण कैसे करें और webpage बनाने का method
एक webpage बनाने के लिए उसे बहुत सारे अलग-अलग भागों में बांटा गया हैं जैसे – <Header>, <nav>, <section>, <body>, <aside>, <footer> आदि.
1) html
HTML में प्रत्येक tag एक container (बर्तन) की तरह कार्य करता है मान लीजिए एक बर्तन में हम पानी डालते है पानी डालते ही पानी बर्तन के हिसाब से अपनी जगह बना लेता है इसी तरह tag एक container की तरह कार्य करता है <html>, <head>, <body>, <div>, <h1>, <p>, <table> आदि ये सब tag है.
2) <!doctype>
doctype का इस्तेमाल html5 version के लिए किया जाता है इससे हमें यह पता चलता है की हम html5 में काम कर रहे है.
3) HTML
<html> tag का इस्तेमाल HTML में container यानि की box की तरह कार्य करता है जिसके अंदर हम webpage के code को लिखते है.
4) Head
<head> tag webpage का head section होता है जिसके अंदर हम <title> tag, CSS file का path, responsive meta link और meta tag के बारे में लिखा जाता है.
5) Title
<title> tag का इस्तेमाल हम जिस webpage में काम कर रहे है उसका title देने के लिए करते है title के अंदर लिखा हुआ text हमें तब दिखता है जब हम अपने webpage को browser में open करते है यह सबसे ऊपर tab के साथ दिखाई देता है.
6) Body
<body> tag webpage का body section होता है जिसके अंदर हम page बनाने के लिए code लिखते है <body> के अंदर हम जो भी code लिखते है वही से हमारा webpage start होता है जिसके अंदर हम image, text, video, button आदि चीजों को रखते है.
7) Header
यह webpage का <header> section होता हैं जो webpage के top में होता हैं जिसमें हम <nav> section को रखते है.
8) Nav
यह navigation section होता है जिसमें एक page से दूसरे page जैसे – about, contact, privacy policy में जाने के लिए link लगाते है जैसे हमारे page के ऊपर में लगा हुआ है जिसमें हम <nav> के अंदर सारे link को रखते है.
9) Section
<body> के अंदर <section> tag का इस्तेमाल किया जाता है इसमें हम किसी paragraph, images, video तथा detail को रख सकते है.
10) Aside
इसे हम <body> के अंदर left तथा right को रखते है जिसके अंदर हम किसी image, link, paragraph आदि चीजों को रख सकते है.
11) Footer
यह webpage last section होता है जिसे सबसे नीचे रखा जाता है जिसमें हम logo, address, location, navigation आदि चीजों को रखते है.
HTML web page structure
HTML code इसे आप copy कर अपने text editor में paste करें. उसके बाद उसे save पर click कर index.html नाम से save कर लें html में किसी भी homepage को हमेशा index.html के नाम से save किया जाता है .html, html file का format होता है
जिससे हमे यह पता चलता है की यह html file है जहा भी file save की है उसे web browser में open करें. जो भी हमने html code लिखा था उसका result हमे web browser में दिखाई देगा.
Note: – केवल html का उपयोग कर हम एक अच्छी website नहीं बना सकते है उसके साथ हमें CSS और bootstrap का उपयोग करना जरुरी है. CSS क्या है और Bootstrap क्या है आप यह से सीख सकते है CSS का उपयोग कर हम website में color , font , animation , image , gradient और भी आकर्षित बना सकते है.
HTML का आविष्कार और HTML किसने विकसित किया
HTML का आविष्कार सन 1993 में Sir Tim Berner-Lee ने किया था HTML में बहुत सारे version है अभी HTML का version html5 (2020) चल रहा है. जब html का आविष्कार किया गया तब इसे publish नहीं किया गया क्योकि इसमें बहुत सारी चीज़ें नहीं थी .
लेकिन अभी html की सारी जिम्मेदारी W3C (World Wide Web Consortium) के पास है html में किसी भी प्रकार का बदलाव या update ये सब W3C करती है.
HTML का पहला version html है जिसे SGML का नाम दिया गया था जिसमें text निर्माण करने का option दिया गया था उसके बाद इसे html 1.0 का नाम दिया गया.
उसके बाद next version html 2.0 का नाम दिया गया जिसमें बहुत सारी चीज़े add की गयी थी लेकिन जो important चीज़ थी वह img tag को add किया गया था.
html 2.0 version आने के बाद internet का इस्तेमाल भी ज्यादा होने लगा था इसके बाद इसी चीज़ को देखते हुए html 3.0 का निर्माण हुआ लेकिन इसमें कोई नई चीज़ add नहीं की गई थी तो इसे प्रकाशित नहीं किया गया W3C द्वारा सन 1997 में html 3.2 को प्रकाशित किया. जिसमें बहुत सारी attribute, tag और style को add किया गया था जो सभी version से अच्छा था.
इसके बाद html 4.0 को लाया गया जिसमें बहुत सारे चीज़े जैसे – structure का अलग section बनाना, stylesheet बनाना, frame और advance table का निर्माण करना आदि चीज़ो को add किया गया था.
html5 version
इसके बाद 2014 में html5 का version आया इसमें बहुत सारी चीज़े थी जिसमें video, audio, header, footer, nav, canvas, section आदि चीज़ों को add किया गया था जिसमें लोगों को काम करने में बहुत आसानी होती है जो अभी हम latest version इस्तेमाल करते है वह html5 है.
आप w3school की website पर जाकर basic से advance level तक webpage बनाना सीख सकते है.
HTML क्या है इसका इस्तेमाल और HTML से webpage का निर्माण कैसे करें इसके बारे में बताया गया है किसी भी प्रकार की सहायता के लिए नीचे आप अपने सवाल पूछ सकते हो.
