Features of HTML5 in Hindi – HTML5 के कौन कौन से features हैं – HTML5 New Features

Features of HTML5 in Hindi – HTML5 के कौन कौन से features हैं – HTML5 New Features in Hindi? Hello friends! How are you? Welcome again to Guptatreepoint blog. दोस्तों मैंने अपने पिछले पोस्ट में बताया था की HTML क्या होता है और History of HTML के बारे में बताया था| लेकिन आज के इस पोस्ट में मैं आपको HTML5 के नए features के बारे में बताऊंगा| अपने पिछले पोस्ट में ही बताया था की HTML5 अभी 2018 में HTML का Latest version है जिसमें की बहुत सारे new features add किये गए हैं जिससे आपको code लिखने में आसानी होगी|

HTML5 में बहुत सारे ऐसे tags और attributes available किये गए हैं जिसके द्वारा आप आसानी से Graphics,  Audio, Video इत्यादि add कर सकते हैं| पहले के web page में direct audio या video add नहीं किया जा सकता था लेकिन HTML5 आपने के बाद आप <audio> …. </audio> tag के द्वारा आसानी से अपने web page पर audio add कर सकते हैं| इसमें और भी बहुत सारे ऐसे features available किये गए हैं जो की user के लिए काफी आसान हैं और web page design करने में कम code लिखना पड़ता है|

HTML5 क्या है – What is HTML5?

HTML5, HTML का latest version है जिसे 2014 में publish किया गया था| जैसा की मैंने अपने पिछले पोस्ट में बताया था की HTML or HyperText Markup Language एक ऐसा language है जिसका उपयोग web page बनाने के लिए किया जाता है|

HTML को बहुत सारे लोग programming language कहते हैं जो की गलत है| HTML एक programming language नहीं है बल्कि यह एक ऐसा language है जो की किसी भी document (web page) के अन्दर text के meaning, purpose और structure को identify करता है|

HTML5 और HTML4 में क्या अंतर है – Difference Between HTML4 and HTML5

जब भी हम HTML सीख रहे होते हैं तो ये सवाल का जवाब जानना हमारे लिए बेहद जरुरी होता है क्योंकि अधिकतर जगह पर यही difference पूछ दिया जाता है जो की सबसे basic difference है| इससे आप किसी भी website के बारे में पता लगा सकते हैं की वो HTML4 में बना है या HTML5 में|

जैसे जैसे किसी भी software का नया version update होता है तो developer उसे इस प्रकार update करते हैं ताकि पहले वाले version से ज्यादा option user को मिले और पहले वाले version से और भी आसान features user को नए version मिले| ठीक उसी प्रकार जब आप HTML4 में document type को declare करते थे तो उसमें document type declare करने का step बहुत ही lengthy था लेकिन HTML5 में इसको simple बना दिया गया| चलिए example देखते हैं|

HTML4 Document Type Declaration

HTML5 Document Type Declaration

अब आप ऊपर दिए गए दोनों syntax से ये जान पा रहे होंगे की HTML5 को बहुत ही आसान कर दिया गया है| अब चलिए example देखते हैं HTML4 और HTML5 में character set define करने का:

Defining Character Set in HTML4 or Older version of HTML

Defining Character set in HTML5

Features of HTML5 – HTML5 के features:

दोस्तों इस पोस्ट में हम कुछ features के बारे में बताऊंगा जो की important हैं और ज्यादा उपयोग होने वाले हैं लेकिन मैं इस पोस्ट में HTML5 के सभी नए features के बारे में short में बताऊंगा और उसको आने वाले पोस्ट में पूरी तरह से define करूँगा|

Simple

जैसा की मैंने ऊपर दो दो example दिए HTML4 और 5 का जिसमें आपने ये देखा की HTML5 में सभी syntax या tag को short कर दिया गया है जिससे user को आसानी से याद रह सके| सबसे पहले तो document type declaration को short किया गया है जो की HTML के web page में सबसे ऊपर में ही define किया हुआ रहता है| extra attributes को हटाकर के इसको simple बना दिया गया है जिससे कोई भी आसानी से सीख सके और याद रख सके|

Plugin की आवश्यकता बहुत कम होती है|

इसमें बहुत सारे pre-defined attributes add कर दिए गए हैं जिससे ज्यादा JavaScript code लिखने की जरुरत नहीं पड़ती है या फिर किसी भी चीज को validate करने के लिए उतना code हमें नहीं लिखना पड़ता है| पहले हमलोगों  को अपने web page में audio और video add करने के लिए flash player की आवश्यकता पडती थी जो की site की loading speed बहुत ज्यादा कर देती थी इसके कारण HTML के इस version में <audio>, <video> जैसे बहुत सारे tag दिए गए जिससे आप आसानी से अपने web page में audio और video add कर सकते हैं|

• Plugin क्या होता है?

Secure

HTML5 में कुछ हद तक inbuilt security features दिया गया है जिससे इसमें बनने वाले सभी web page secure हो जाते हैं| यह origin based security use करती है|

Don’t Close Empty or Null tag

‘Empty’ or ‘Null’ element वैसे element को कहा जाता है जिसके पास कोई content नहीं होता है जैसे की img, hr, br. HTML के इस version में Empty tag or Null tag को close करने की जरुरत नहीं पड़ती है मतलब की पहले वाले version में आपको Empty or Null tag को slash के द्वारा close करना पड़ता था लेकिन नए version में आपको slash के द्वारा close करने की आवश्यकता नहीं है|

पहले वाले version में:

<img src=”abc.png”/>

<hr />    <br />

नए version में:

<img src=”abc.png”>

<hr>  <br>

required and Placeholder attribute in input tag

पहले वाले version में हमलोग को validation लगाने के लिए JavaScript का इस्तेमाल करना पड़ता था जैसे यदि हमें किसी भी textbox को user के द्वारा fill up करवाना जरुरी होता था तो उसके लिए हम JavaScript में validation code लिखते थे लेकिन अब आपको इतना code लिखने की जरुरत नहीं है अब simply एक नया attribute दिया गया है जिसका नाम है required. आप इसे input tag के अन्दर लिख सकते हैं जिस field को required करना हो| example:

 <input type=”text” placeholder=”Enter Your Name” required>

HTML के लेटेस्ट version में input tag के attribute में आप placeholder का इस्तेमाल कर सकते हैं जिसका काम textbox में predefined और inline text को show करना होता है| जैसे की आपने online form भरते समय देखा होगा की textbox में लिखा हुआ रहता है की Enter your name पर जैसे ही आप नाम लिखना शुरू करते हैं वो वहां से remove हो जाता है|

Deprecated Features in HTML5 – HTML5 से remove किये गए features:

HTML के नए version से कुछ कुछ features को remove कर दिया गया है लेकिन अभी भी ये सब features कुछ कुछ web browser सपोर्ट करते हैं और कुछ कुछ web browser सपोर्ट नहीं करते हैं| यदि आप इन सभी features को अपने web page में उपयोग करते हैं तो शायद कभी ऐसा हो की किसी दुसरे के web browser में ये function work ना करे|

• The Marquee Tag in HTML: Why We Want It Banned
• Invalid HTML
• How to Use <frame> Tags in Your HTML Code
• How To Use <frame> Tags In HTML
• Applets
• <xmp> HTML Tag
• <table width=””>
• <table summary=””>
• <table rules=””>
• <table hspace=””>
• <table height=””>
• <sound> HTML Tag
• <select readonly>
• <plaintext> HTML Tag
• <ol start=””>
• <noembed> HTML Tag
• <multicol> HTML Tag
• <multicol width=””>
• <multicol gutter=””>
• <multicol cols=””>
• <listing> HTML Tag
• <input language=””>
• <img suppress=””>
• <img start=””>
• <img nosave>
• <img naturalsizeflag=””>
• <img name=””>
• <img lowsrc=””>
• <img loop=””> Attribute: Make Videos Loop In Your HTML
• <img hspace=””>
• <img dynsrc=””>
• <img controls>
• <img border=””>
• <img align=””>
• <hype> HTML Tag
• <frameset> HTML Tag
• <form name=””>
• <font> HTML Tag
• <font weight=””>
• <font size=””>
• <font point-size=””>
• <font face=””>
• <font color=””>
• <center> HTML Tag
• <caption align=””>
• <body topmargin=””>
• <body text=””>
• <body stylesrc=””>
• <body scroll=””>
• <big> HTML Tag
• <bgsound> HTML Tag
• <basefont> HTML Tag
• <basefont size=””> HTML Attribute
• <basefont face=””> HTML Attribute
• <basefont color=””> HTML Attribute
• <applet> HTML Tag
• <applet width=””> HTML Attribute
• <applet vspace=””> HTML Attribute
• <applet name=””> HTML Attribute
• <applet mayscript=””> HTML Attribute
• <applet hspace=””> HTML Attribute
• <applet height=””> HTML Attribute
• <applet codebase=”””> HTML Attribute
• <applet code=””> HTML Attribute
• <applet border=””> HTML Attribute
• <applet archive=””> HTML Attribute
• <applet align=””> HTML Attribute
• <app> HTML Tag
• <a name=””> HTML Attribute

ऊपर दिए गए सभी features HTML के नए version से remove कर दिया गया है इसलिए कभी भी web page design करते समय इन सभी tags और attributes का इस्तेमाल ना करें| इन सभी के बारे में हम आने वाले पोस्ट में details में देखेंगे|

News Features of HTML5:

1. HTML Media
2. <video> HTML Tag
3. <track> HTML Tag
4. <source> HTML Tag
5. <section> HTML Tag
6. <s> HTML Tag
7. <ruby> HTML Tag
8. <rt> HTML Tag
9. <rp> HTML Tag
10. <q> HTML Tag
11. <progress> HTML Tag
12. <output> HTML Tag
13. <nav> HTML Tag
14. <meter> HTML Tag
15. <menuitem> HTML Tag
16. <menu> HTML Tag
17. <mark> HTML Tag
18. <main> HTML Tag
19. <keygen> HTML Tag
20. <input step=””>
21. <input required>
22. <input placeholder=””>
23. <input pattern=””>
24. <input multiple>
25. <input min=””>
26. <input max=””>
27. <input list=””>
28. <input height=””>
29. <input formtarget=””>
30. <input formmethod=”
31. <input formenctype=””>
32. <input formaction=””>
33. <input form=””>
34. <input autofocus>
35. <input autocomplete=””>
36. <img srcset=””>
37. <img crossorigin=””>
38. <iframe sandbox=””>
39. <header> HTML Tag
40. <footer> HTML Tag
41. <figure> HTML Tag
42. <figcaption> HTML Tag
43. <embed> HTML Tag
44. <embed width=””>
45. <embed src=””>
46. <dialog> HTML Tag
47. <details> HTML Tag
48. <datalist> HTML Tag
49. <canvas> HTML Tag
50. <bdi> HTML Tag
51. <audio> HTML Tag
52. <audio volume=””> HTML Attribute
53. <audio src=””> HTML Attribute
54. <audio preload=””> HTML Attribute
55. <audio muted> HTML Attribute
56. <audio loop> HTML Attribute
57. <audio controls> HTML Attribute
58. <audio autoplay> HTML Attribute
59. <aside> HTML Tag
60. <article> HTML Tag
61. <a download> HTML Attribute

ये सभी list HTML के official website से लिए गए हैं इसलिए इस list का पूरा credit HTML के official website को जाता है| Read in details

Conclusion and Final Words

HTML के latest version में बहुत सारे features को remove भी किया गया है और फिर बहुत सारे features को add भी किया गया है| कुछ पुराने features जो की SEO Friendly नहीं थे इसलिए उन सभी features को remove किया गया| हालाँकि अभी भी वो features work करते हैं लेकिन कुछ कुछ web browser पुराने features को सपोर्ट नहीं करते हैं इसलिए जो features लेटेस्ट version से remove कर दिया गया है उसे इस्तेमाल करने से मना किया गया है|

अब आप सोच रहे होंगे की जो पुराने features थे वे सब काम कैसे होंगे दोस्तों मैं बता दूँ की उनके लिए CSS और JavaScript ही काफी है और जो features CSS और JavaScript से नहीं हो पाता है उस features के लिए नए features add किये गए हैं जो की SEO Friendly हैं|

मैंने इस पोस्ट में Features of HTML5 – HTML5 के नए features के बारे में short में बताया है| आने वाले पोस्ट में मैं इनके सभी features को details में बताऊंगा| तब तक के लिए धन्यवाद| और हाँ इस पोस्ट को अपने दोस्तों के साथ share करना ना भूले और साथ ही साथ आप अपना feedback जरुर दें| अगर इस पोस्ट में आपको कहीं पर भी कोई गलती नजर आती है तो मुझे इन्फॉर्म करें ताकि मैं उस गलती को सुधार सकूं| Guptatreepoint blog पर आने के लिए धन्यवाद|