Semantic Elements, Responsive Forms, Media Controls, Web Accessibility (WCAG), and SEO Metadata.
Semantic tags describe their meaning to both the browser and search engine crawlers.
| Tag | Semantic Purpose |
|---|---|
<header> | Introductory brand header and main navigation menu |
<nav> | Section containing primary navigation hyperlinks |
<main> | Encloses the dominant, unique content of the page document |
<article> | Self-contained composition (blog post, news story) |
<section> | Standalone thematic grouping of content with a heading |
<aside> | Sidebar containing related links, ads, or quick facts |
<footer> | Document footer containing copyright, contact, and legal links |
<form action="submit.php" method="POST">
<div class="form-group">
<label for="email">Email Address:</label>
<input type="email" id="email" name="email" required placeholder="you@domain.com">
</div>
<button type="submit">Submit Inquiry</button>
</form><article>, <header>, <section>, and <footer>.