Semantic HTML: For beginners Part 1
Source: Dev.to
Non‑semantic example
Imagine you’re a beginner at HTML, and because you want a quick non‑functional traveling app you write this in the body:
## Traveling App
## Easier to travel than ever
Book your flight today
©2026-2027 Traveling App All Rights Reserved.
This markup is not semantic and will not boost SEO.
Semantic version (assuming Tailwind is installed)
## Traveling App
## Easier to travel than ever
Book your flight today
©2026-2027 Traveling App All Rights Reserved.
This markup is semantic and will help improve SEO.
Why use semantic HTML?
- “ – contains the webpage title and subtitle.
- “ – wraps the primary content of the page.
- “ – holds copyright or licensing information.
- “ – a generic container without semantic meaning; use it only when no other element fits.
Using the appropriate semantic elements gives search engines and assistive technologies clearer information about the structure and purpose of your content.