Semantic HTML

Using tags that say what content is, not only how it looks.

<header>, <nav>, <main>, <article>, <section>, <footer>, <button>, and headings <h1>–<h6> in order. Screen readers use them to navigate, search engines use them to understand the page, and they give you keyboard support for free. A <div> with a click handler isn't a button.

<main>
  <article>
    <h1>Case study</h1>
    <section><h2>Problem</h2>…</section>
  </article>
</main>

Related terms

Accessibility (a11y) HTML document

More in HTML

The document itself: what each piece of content is.

HTML document <head> DOM

Open in the interactive encyclopedia →