HTML 5 Element Tags in Hindi

HTML 5 Element Tags

HTML फ़ाइल elements से बनी है। ये element वेब पेज बनाने और उस वेबपेज में content को define करने के लिए जिम्मेदार होते हैं।

Table of Contents

HTML element किसी भी वेब डॉक्यूमेंट के सबसे बुनियादी बिल्डिंग ब्लॉक होते हैं। elements को ब्राउज़र द्वारा पहचाना जाता है जो यूजर्स को predefine तरीके से element के content प्रदान करते है।
HTML डॉक्यूमेंट HTML element द्वारा बनाए गए हैं।
HTML element open tag के साथ शुरू होते हैं और close tag पर ख़त्म होते हैं और इनके बीच में content लिखा जाता हैं:

सभी टैग predefine होते है और वेबपेज के structural properties को control करते हैं।
हालांकि कुछ HTML elements का presentational या cosmetic उपयोग हैं। प्रेजेंटेशन और डिजाइन उद्देश्य के लिए HTML elements का उपयोग तेजी से किया जाता है।
प्रेजेंटेशन और डिजाइन के उद्देश्य के लिए Cascading style sheet (CSS) का उपयोग किया जाता है।

Nested HTML Elements

HTML elements को नेस्टेड किया जा सकता है (elements में element शामिल हो सकते हैं)।
सभी HTML डॉक्यूमेंट में नेस्टेड HTML element होते हैं।

<!DOCTYPE html>
    <html>
             <body>
             <h1>My First Heading</h1>
             <p>My first paragraph.</p>
             </body>
   </html>

Empty HTML Elements

बिना किसी content वाले HTML elements को empty element कहा जाता है।
Close tag के बिना <br> एक empty element है (<br> टैग एक लाइन ब्रेक को परिभाषित करता है)।
Empty elements को इस तरह open tag में “बंद” किया जा सकता है: <br />।
HTML 5 को empty elements को बंद करने की आवश्यकता नहीं है। लेकिन यदि आप सख्त वेलिडेशन चाहते हैं, या आपको XML पार्सर द्वारा अपने डॉक्यूमेंट को readable बनाने की आवश्यकता है, तो आपको सभी HTML elements को बंद कर देना चाहिए।

Removed elements from HTML 5

ऐसे कई element हैं जिन्हें HTML 5 से हटा दिया गया है:

Removed Elements	Use Instead Elements
<acronym>	<abbr>
<applet>	<object>
<basefont>	CSS
<big>	CSS
<center>	CSS
<dir>	<ul>
<font>	CSS
<frame>
<frameset>
<noframes>
<isindex>
<strike>	CSS, <s> or <del>
<tt>	CSS

New Added Elements in HTML 5:

<article>: HTML 5 में <article> टैग का उपयोग किसी article को दर्शाने के लिए किया जाता है।

<aside>: HTML 5 में <aside> tag का उपयोग एक हाइलाइटर की तरह छोटे तरीके से वेब पेज की मुख्य वस्तु का वर्णन करने के लिए किया जाता है। <aside> टैग में मुख्य रूप से author की जानकारी, लिंक, संबंधित कंटेंट आदि शामिल हैं।

<figcaption>: HTML 5 में <Figcaption> टैग का उपयोग किसी डॉक्यूमेंट में figure element के कैप्शन को सेट करने के लिए किया जाता है।

<figure>: HTML 5 में <figure> टैग का उपयोग किसी डॉक्यूमेंट में illustrations, diagrams, photos और codes list जैसी स्व-सम्‍मिलित कंटेंट को जोड़ने के लिए किया जाता है। यह main flow से संबंधित है लेकिन इसका उपयोग किसी डॉक्यूमेंट की किसी भी स्थिति में किया जा सकता है|

<header>: इसमें header के साथ-साथ अन्य कंटेंट, जैसे कि नेविगेशन लिंक, कंटेंट की टेबल आदि शामिल हैं।

<Footer> HTML 5 में < footer> टैग का उपयोग HTML डॉक्यूमेंट के footer को define करने के लिए किया जाता है। इस सेक्शन में footer जानकारी (author information, copyright information, carriers आदि) हैं। footer टैग Body टैग के भीतर उपयोग किया जाता है। <footer> टैग HTML 5 में नया है। footer element को प्रारंभ टैग के साथ-साथ अंतिम टैग की भी आवश्यकता होती है।

<main>: यह किसी डॉक्यूमेंट या वेब ऐप के main content को डिलीट करता है।

<mark>: HTML 5 में <mark> टैग का उपयोग marked text को define करने के लिए किया जाता है। इसका उपयोग पैराग्राफ में टेक्स्ट भाग को highlight करने के लिए किया जाता है।

<nav>: HTML 5 डाक्यूमेंट्स में नेविगेशनल सेक्शन को declare करने के लिए <nav> टैग का उपयोग किया जाता है।

<section>: यह content के विषयगत समूह का सीमांकन करता है।

<details>: <details> टैग का उपयोग उस content / information के लिए किया जाता है जो प्रारंभ में छिपी हुई होती है, लेकिन यदि यूजर इसे देखना चाहे तो प्रदर्शित किया जा सकता है। इस टैग का उपयोग इंटरेक्टिव विजेट बनाने के लिए किया जाता है जिसे यूजर खोल या बंद कर सकता है। सेट ऐट्रिब्यूट्स को खोलने पर details टैग का Content दिखाई देता है।

<Summary>: HTML 5 में <Summary> टैग का उपयोग <details> element के Summary को define करने के लिए किया जाता है। <Summary> element का उपयोग <details> element के साथ किया जाता है और यह यूजर को दिखाई देने वाली Summary प्रदान करता है। जब यूजर द्वारा Summary पर क्लिक किया जाता है, तो <details> element के अंदर रखी गई सामग्री दिखाई देती है जो पहले छिपी हुई थी। HTMl 5 में <Summary> टैग जोड़ा गया था। <Summary> टैग को टैग शुरू करने और समाप्त करने दोनों की आवश्यकता होती है।

<time>: पढ़ने योग्य डेटा / समय प्रदर्शित करने के लिए <time> टैग का उपयोग किया जाता है। इसका उपयोग machine-readable रूप में दिनांक और समय को एन्कोड करने के लिए भी किया जा सकता है। यूजर्स के लिए मुख्य लाभ यह है कि वे अपने कैलेंडर के birthday reminders और scheduled events को जोड़ने की पेशकश कर सकते हैं और सर्च इंजन स्मार्ट सर्च परिणाम उत्पन्न कर सकते हैं।

<bdi>: <bdi> टैग का पूरा नाम Bi-Directional Isolation है। यह एक टेक्स्ट को अन्य टेक्स्ट से अलग करता है जिसे अलग डायरेक्शन में फॉर्मेट किया जा सकता है। इस टैग का उपयोग तब किया जाता है जब कोई यूजर किसी unknown directions से टेक्स्ट जनरेट करता है।

<wbr>: HTML 5 में <wbr> का पूरा नाम word break है और इसका उपयोग टेक्स्ट के अन्दर position को डिफाइन करने के लिए किया जाता है जिसे ब्राउज़र में लाइन ब्रेक के रूप में जाना जाता है। इसका उपयोग ज्यादातर तब किया जाता है जब उपयोग किया गया शब्द बहुत लंबा होता है और इस बात की संभावना होती है कि ब्राउज़र टेक्स्ट को फिट करने के लिए गलत जगह पर लाइनें तोड़ सकता है।

<datalist>: HTML 5 फ़ाइलों में autocomplete feature प्रदान करने के लिए <datalist> टैग का उपयोग किया जाता है। इसका उपयोग इनपुट टैग के साथ किया जा सकता है, ताकि यूजर्स डेटा का चयन करके आसानी से फ़ॉर्म को भर सकें।

<keygen>: HTML 5 में <keygen> टैग का उपयोग key-pair generator फ़ील्ड को फॉर्म में निर्दिष्ट करने के लिए किया जाता है। <Keygen> element का उद्देश्य यूजर्स को प्रमाणित करने के लिए एक सुरक्षित तरीका प्रदान करना है। जब फॉर्म को सबमिट किया जाता है टैब दो key उत्पन्न होती हैं, private key और public key. Private key को local रूप से स्टोर किया जाता हैं, और public key को सर्वर पर भेजा जाता है। public key का उपयोग भविष्य के लिए authenticate user के लिए client certificate बनाने के लिए किया जाता है।

<output>: HTML 5 में <output> टैग का उपयोग क्लाइंट-साइड स्क्रिप्ट जैसे जावास्क्रिप्ट द्वारा की गई गणना के परिणाम को दर्शाने के लिए किया जाता है।

<Progress>: इसका उपयोग किसी टास्क की प्रोग्रेस को represent करने के लिए किया जाता है। यह भी define किया गया है कि किसी चीज को डाउनलोड करने के लिए कितना काम किया जाता है और कितना छोड़ा जाता है। इसका उपयोग Disk space या relevant query को represent करने के लिए नहीं किया जाता है।

<svg>: यह Scalable Vector Graphics है।

<canvas>: HTML 5 में <canvas> टैग का उपयोग जावास्क्रिप्ट का उपयोग करके वेब पेज पर ग्राफिक्स बनाने के लिए किया जाता है। इसका उपयोग paths, boxes, texts, gradient और images add करने के लिए किया जा सकता है। डिफ़ॉल्ट रूप से इसमें बॉर्डर और टेक्स्ट शामिल नहीं है।

<audio>: यह संगीत या ऑडियो content को define करता है।

<embed>: यह बाहरी एप्लीकेशन (आमतौर पर एक वीडियो प्लेयर) के लिए कंटेनरों को define करता है।

<source>: यह <video> और <audio> के source को define करता है।

<track>: यह <video> और <audio> के लिए tracks को define करता है।

<video>: यह video content को define करता है।

New Media Elements

Tag	Description
<audio>	यह audio content को डिफाइन करता हैं\|
<embed>	यह External (non-HTML) एप्लीकेशन के लिए कंटेनर को डिफाइन करता है
<source>	Media elements के लिए कई मीडिया रिसोर्सेस को डिफाइन करता है (<video> और <audio>)
<track>	Media elements के लिए text track को डिफाइन करता है (<video> और <audio>)
<video>	यह video और movie को डिफाइन करता हैं\|