Semantic HTML5
Semantic elements clearly describe their meaning to both browsers and developers.
Why Semantic HTML?
- SEO: Search engines understand your content better
- Accessibility: Screen readers can navigate properly
- Maintainability: Code is easier to understand
Semantic Elements
<header> - Page or section header
<nav> - Navigation links
<main> - Main content (only one per page)
<article> - Self-contained content
<section> - Grouped content
<aside> - Sidebar content
<footer> - Page or section footerExample Layout
<body>
<header>
<nav>...</nav>
</header>
<main>
<article>...</article>
</main>
<footer>...</footer>
</body>