📖 Introduction
Agar aap HTML seekh rahe hain, to Semantic Tags ke baare me zarur jaana chahiye. HTML5 me semantic tags introduce kiye gaye the taaki webpage ka structure humans aur search engines dono ke liye clear ho.
Semantic HTML likhne se website zyada professional aur SEO-friendly banti hai.
HTML Semantic Tags Kya Hain?
Semantic tags wo HTML tags hote hain jo apne content ka meaning batate hain.
Examples:
-
<header> -
<nav> -
<main> -
<section> -
<article> -
<aside> -
<footer>
1. Header Tag
Website ya page ka top section.
<header>
<h1>Code With Sumit</h1>
</header>
2. Nav Tag
Navigation menu ke liye.
<nav>
<a href="#">Home</a>
<a href="#">Blog</a>
<a href="#">Contact</a>
</nav>
3. Main Tag
Page ka main content.
<main>
<h2>Learn HTML</h2>
<p>HTML is the foundation of web development.</p>
</main>
4. Section Tag
Content ko alag sections me divide karta hai.
<section>
<h2>HTML Tutorial</h2>
<p>Learn HTML step by step.</p>
</section>
5. Article Tag
Independent content ke liye use hota hai.
<article>
<h2>What is HTML?</h2>
<p>HTML is a markup language.</p>
</article>
6. Aside Tag
Sidebar ya extra information ke liye.
<aside>
Related Posts
</aside>
7. Footer Tag
Page ke bottom section ke liye.
<footer>
© 2026 Code With Sumit
</footer>
Semantic Tags Ke Benefits
✅ SEO Improve hota hai.
✅ Google content ko better samajhta hai.
✅ Accessibility improve hoti hai.
✅ Code clean aur readable hota hai.
Semantic vs Non-Semantic Tags
| Semantic | Non-Semantic |
|---|---|
<header> | <div> |
<footer> | <span> |
<article> | <div> |
<nav> | <div> |
Common Mistakes
❌ Har jagah <div> ka use karna.
❌ <header> aur <footer> use na karna.
❌ Semantic structure follow na karna.
Pro Tips
- Hamesha semantic tags use karein.
-
Har page me sirf ek
<main>tag rakhein. -
SEO ke liye proper heading structure (
<h1>,<h2>) follow karein.
Conclusion
Semantic HTML modern web development ka important part hai. Agar aap Frontend Developer banna chahte hain, to semantic tags ko zarur seekhein aur apne projects me use karein.
🔗 Internal Linking
👉 HTML Kya Hai? Complete Guide
👉 Top 10 HTML Tags Every Beginner Must Know
👉 HTML Forms Complete Guide
👉 HTML Tables Complete Guide
👉 HTML Div vs Span
👉 HTML Images Guide
🎯 Focus Keyword
HTML Semantic Tags in Hindi
