आज का विषय है, HTML कैसे सीखें (Learn HTML in Hindi) Html का full form है, Hypertext markup language यह वेब पेज बनाने के काम मे आती है। Website का Structure बनाने में भी HTML का use सबसे ज्यादा होता है। अगर आपको अपनी खुद की website create करनी है तो Html language को सीखना आपके लिए बहुत जरूरी है।
HTML language को सीखने और इसकी मदद से web pages बनाने के लिए आपको HTML tags and HTML attributes के बारे जानना होगा। किसी भी web pages को बेहतरीन Structure देने में Html tags और Html attributes का ही इस्तेमाल किया जाता है। Html एक बेहद सरल markup language है। इस लेख HTML कैसे सीखे पर हम जानेंगे Html element’s व उनके Html attributes क्या है, और इनकी मदद से web pages कैसे बनाये। तो चलिए Step by step जानते है-
HTML कैसे सीखे – How to Learn HTML in Hindi
HTML Language को सीखने के लिए जरूरी है, Html tags व Html attributes का ज्ञान होना। दरअसल Html तो सिर्फ इस markup language का नाम है, बाकी सारा काम इन्ही tags व attributes का होता है। अगर आपने इन सारे Html tags व इनके attributes को जान लिया तो आप एक Html expert भी बन सकते है। इन सबका ज्ञान होने के बाद आपके लिए एक Website बनाना बाएं हाथ का खेल होगा। तो चलिए इस पोस्ट में अब जानते है। html tags व html attributes क्या है और इनका इस्तेमाल कैसे किया जाता है।
HTML Tag क्या है
किसी web page के structure को बनाने में इस्तेमाल किये जाने वाले codes को html tags या html element’s कहा जाता है। यह tags angular brackets (<>) के बीच एक simple text होता है।
उदाहरण के लिए: (<h1> ) यह एक Heading tag है। जिसे heading के starting word H से define किया गया है। ज्यादातर टैग्स को भी उनके first word से ही define किया जाता है। इन tags के opening व closing tag जरूर होते है। html file बनाते वक्त भी इसका खास ख्याल रखा जाता है कि, इस्तेमाल किये जाने वाले tag का पहले opening tag व अंत मे closing tag जरूर लिखा जाए तभी वह html file सही से कार्य करेगी।
अगर आपको किसी web page में heading लिखनी है। तो आप उसके opening tag <h1> से शुरूवात करेंगे। अब अपनी heading लिखने के बाद इसके closing tag </h1> को लिखकर इस Heading tag को बंद करेंगे। इसी तरह बाकी tag को भी opening tag से शुरू करके closing tag पर बंद किया जाता है। नीचे उदाहरण से समझे।
<H1> html kaise sikhe </h1>
निम्नतः Html tags दो प्रकार के होते है:
- Paired html tags
- Unpaired html tags.
Paired html tags: जिन tags के opening व closing दोनों tag होते है, उन्हें paired html tags कहा जाता है। ज्यादातर HTML tags paired ही होते है। निचे के उदाहरण में पर heading tag एक paired tag है। जिसका opening tag <h1> व closing tag </h1> है।
<H1> Learn HTML in Hindi </h1>
Unpaired HTML tags: इन tags के कोई opening व closing tags नही होते। यह एक तरह के singular html tags होते है। इन्हें इस तरह से लिखा जाता है। निचे के उदाहरण में एक line break tag (<Br>) है। Paragraph लिखते वक्त किसी एक line को समाप्त कर दूसरी line लिखने के लिये ऐसी tag का इस्तेमाल किया जाता है।
<Br>
इस लेख पर अब तक आप जान चुके होंगे कि HTML Tag क्या होते है और html element’s व इनके attributes क्या होते है। तो चालिये अब जानते है , कुछ html tags व उनके इस्तेमाल के बारे में की वह किस काम मे आते है।
कुछ Basic HTML Tags व उनके इस्तेमाल
1. DOCTYPE tag – यह tag किसी document के type को explain करती है। जैसे यहां पर इस documnet का type html है । इस tag को <!DOCTYPE> से define किया जाता है।
2. Html Tag – यह tag html language का main tag है। html tag को <html> से define किया जाता है। ऐसी tag से html document बनाने की शुरुवात की जाती है। बाकी सभी tags इसी html tag के opening व closing tag के भीतर लिखे जाते है।
3. Head Tag – एक web page के Head part यानी ऊपरी भाग को इसी tag की मदद से बनाया जाता है। head tag के भीतर ही उस web page के title, meta description and keyword tag को लिखा जाता है। इसे <head> से define करते है।
4. Body Tag – इस tag से web page के Content Area की शुरुवात की जाती है। Body tag को <Body> से define किया जाता है। Heading tag, Paragraph tag etc. इसी tag के अंदर लिखे जाते है। इस tag की मदद से एक web page के body area को design किया जाता है।
5. Title Tag – किसी web page का title लिखने के लिए इस tag का use किया जाता है। इस tag को <title> से define किया जाता है।
6. Heading Tag – Web page के Content में Heading लिखने के लिये इस tag का इस्तेमाल किया जाता है। heading tag को <h1> से define किया जाता है। एक Content में 6 heading tag का इस्तेमाल किया जा सकता है। जिनके tag क्रमशः <h1>, <h2>, <h3>, <h4>, <h5>, <h6> है।
7. Paragraph Tag – इसका इस्तेमाल Paragraph लिखने के लिए किया जाता है। एक content में आप कई Paragraph tag का use कर सकते है। इस tag को <p> से define किया जाता है।
8. Line Break Tag – Paragraph लिखते वक्त एक line को खत्म कर अगली line शुरू करने के लिये line break tag का इस्तेमाल किया जाता है। इस tag को <br> से define किया जाता है।
9. Bold Tag – किसी Important text को Bold (गहरा) करने के लिये bold tag का इस्तेमाल किया जाता है। इस tag को <B> से define किया जाता है।
10. Underline Tag – यह tag किसी latter को underline करने के लिए इस्तेमाल किया जाता है। इसे <u> से define किया जाता है।
11. Italic Tag – यह tag किसी latter को italic करने के लिए use किया जाता है। इसे <i> से define किया जाता है।
HTML Attributes क्या है?
HTML Attributes किसी Html elements (tag) के बारे में extra information provide करने के लिए इस्तेमाल किये जाते है। Html file में इन attributes को दो भागों में लिखा जाता है। इसका पहला भाग Attributes Name वह दूसरा भाग इसकी Value होता है। एक Html file में इन attributes का इस्तेमाल किसी Html elements के opening tag के साथ किया जाता है। निचे दिया उदाहरण देखे –
<h1 attrname= "value"> Html Kaise Sikhe </h1>
उप्पर दिए गए example में यह एक heading tag है। जिसे उसके opening tag h1 व closing tag h2 से दर्शाया गया है। अब जैसे हमने उप्पर आपको बताया कि, html attributes extra information provide करते है html elements के बारे में। तो अगर हमको इस html file की heading का color change करना होगा तो यहां पर हम उस attributes का use करेंगे जिससे Font color change किया जा सकता है।
ऐसे ही बहुत सारे attributes होते है, जिसकी मदद से हम html tags को extra configure कर सकते है। html file में इन attributes को हमेशा किसी html elements के opening tag के साथ लिखा जाता है। जैसा कि ऊपर example में बताया गया है। एक html attributes को उसके Name व उसकी value लिखकर दर्शाया जाता है।
उप्पर दिए गए उदाहरण में आप देख सकते है, heading tag के opening tag h1 के अंदर एक attribute example दिया गया है। यहां पर attr-name की जगह कोई भी html attributes का नाम हो सकता है। उसके बाद उसकी value को Quotation marks [ “ ” ] के अंदर लिखा जाता है। इसी तरह से बाकी HTML attributes को भी लिखा जाता है।
कुछ Basic HTML Attributes व उनका इस्तेमाल
1. Html href attribute – इस attribute का इस्तेमाल दो web page को आपस मे जोडने के लिए किया जाता है। इस attribute को <a> tag के opening tag में लिखा जाता है। <a> tag को hyperlink tag भी कहा जाता है। <a> tag का इस्तेमाल किसी text या image को link देने के लिए किया जाता है। यह tag दूसरे web page में जाने की अनुमति देता है। निचे दिए गए उदाहरण में a tag के opening tag के साथ href attribute को लिखा गया है। यहां पर href इस attribute का Name है, और https://nayaseekhon.com उसकी Value.
<a href= "https://nayaseekhon.com"> Nayaseekhon.com </a>
2. Html src attribute – अगर आप किसी image को एक html file में add करना चाहते है, और वह image आप अपने Computer या किसी Website से लेना चाहते है। तो इस image file का Source address set करने के लिये src attribute का use किया जाता है। अगर image file computer के उसी folder में हो जहाँ html file save की गई है, तो src attribute का use कुछ इस तरह से होगा।
निचे दिए गए उदाहरण में, HTML in Hindi एक image का file name है। यहाँ पर src attribute को image tag के opening tag में उसके Name – src व उसकी Value – HTML in Hindi.jpg के साथ लिखा गया है।
<image src= "HTML-in-Hindi.Jpg"> </image>
दूसरा उदाहरण, अगर image file computer के दूसरे folder में save हो तो src attribute का use कुछ इस तरह से होगा। इस example में image file कंप्यूटर के download folder में image folder के अंदर है। इसी तरह से आपके जिस भी folder में image file save हो उस folder का नाम slash लगाकर लिखे तभी आपकी image उस html file में show होगी।
<image src= "Download/image/HTML-in-Hindi.jpg"> </image>
तीसरा उदाहरण, अगर image file एक url के रूप में हो, तब src attribute का use कुछ इस तरह से होगा।
<image src= "https://nayaseekhon.com/HTML-in-Hindi.jpg> </image>
अंतिम राय
तो दोस्तो उम्मीद है, आपको यह पोस्ट पसंद आई होगी। Html सीखने के लिए यही जरूरी है, कि आप html element’s व उनके attributes को अच्छे से सीखे। आगे की पोस्ट में हम और details में इनके बारे में जानेंगे। अगर आपको यह पोस्ट HTML कैसे सीखे (Learn HTML in Hindi) अच्छी लगी हो तो इसे Like, Share, Comment करना बिल्कुल न भूले।
BHAI MUJHE html SIKHaNA HAI OE CSs SIKHANA HAI OR JS BHI PLEASE SIKHA DO
Saklen, HTML आप हमारी वेबसाइट से सीख सकते है, बाकि CSS के लिए यूट्यूब में फ्री टुटोरिअल उपलब्ध है।
Bro bahut websites mai web pages pr ek link button bna hota jese download button ya go etc. En button pe click karne pr yai ya ek dusre web page pe le jaate hai jha hamaari file mojud hoti hai to es tarah ke button kis tarah banaaye jaate hai I mean konse tag use kiye jaate hai kuch page pe image bhi link ki tarh kaarya karte hai yai kese hota hai
Puran, इसमें आपको इमेज के साथ लिंक इन्सर्ट करना होगा। अगर आपको स्टेप बाइ स्टेप जानना है, तो आप गूगल या यूट्यूब पर टुटोरिअल देख सकते है।
nice sir ji bahut hi saral tarike se samjhaya hai very nice sir
धन्यवाद MR, 😊 ख़ुशी है, कि जानकारी आपके काम आयी।
sir apka no mil skta h kya plz
Dinesh, आप मुझे व्हाट्सप्प और टेलीग्राम के जरिये सम्पर्क कर सकते है – क्लिक करे।
Wow ! THANK YOU very much FOR THE POST THIS ARTICLE .I was searching this type of post.I Read in detail and it is very useful post Your Website all content helpful and useful I,m big fan your site
Wow ! THANK YOU very much FOR THE POST THIS ARTICLE .I was searching this type of post.I Read in detail and it is very useful post Your Website all content helpful and useful I,m big fan your site
but my two question,1 what is server and, 2.what is alexa rank
Sir
Blog me navigate aur category ke liye HTML apply kaise kare.
Ram chandra, आप इस लिंक पर जाकर आप इसके टुटोरिअल से ये सीख सकते है – How to create navigation bar in html and css.
sir
Html sikhne ke liye kon kon se language ka aana bahut Jaruri hai
Ek question aur hai
Web design and data analytics me easy kon hai
Gautam, HTML सीखने के लिए आपको अंग्रेजी भाषा का थोड़ा ज्ञान होना चाहिए। अगर आप HTML सीख रहे है तो वेब डिजाइनिंग एक बेहतर विकल्प रहना।
Sir, I am a big fan of you, I see your post daily and get very good information.
Sir web design kai liye HTML language sikhni jaruri hai ya nhi ” Please Reply sir
Shahnawaz yeh to basic hai aapko sikhna hi chahiye.
sir muje html ke bare me jyada kuch pata nhi tha but pura html ke bare me mai padhi to muje bahut acha laga or bahut kuch sikhne ko v mila but muje eska program banane nhi ata hai to mai kaise sikhu..?
Monica, bahut sare free resources internet par available hai. ya aap youtube me video tutorial se bhi sikh sakti hai.
sir kya coding sikna bahut muskil hai please reply
Rohit agar aapka coding me intrest hai toh aapko ese sikhne me bahut maja aayega. lekin agar aap ese jabardasti sikh rahe hai toh aapko baki napasand kamo ko karne me utni dikkat nahi hogi jitni coding karne me hogi.
sir me aapko pichale 6 mahine se follow kar rha hun.
mene aapse bahut knowledge hasil kiya hai.
useful jankari dene thanks sir.
thank you so much sir😊
Very nice & useful post
Sir Coding Sikhne ke liye Online website kaun sa Hai
manish aap html hamari website se bhi sikh sakte hai. baki agr aaap english jante hai to w3school best hai.
thanks for sharing
welcome santosh ji.
Nice bhi gi