Headings and landmarks

structure · Readability · weight 25 of 120

What we check

On your home page and each sampled page, we look at four things that give a page its shape:

• Exactly one <h1>, the page’s main heading (worth 0.3).
• Headings that don’t skip levels (0.2). An outline may start at h1 or h2; after that, each heading may go at most one level deeper than the one before, and back up any number of levels.
• A <main> or <article> element marking where the content is (0.3).
• A lang attribute on the <html> element (0.2).

The score is the average across pages.

Why it matters

A machine reading your page can’t see the layout. It sees the markup. The <h1> tells it what the page is about; the headings below tell it how the page is organized; the main area tells it which part is content and which is navigation, footer, and cookie notice.

Without them, the menu and the article run together, and an assistant may quote your footer as if it were your answer.

How to pass

1. Give each page one <h1> that names it. The logo in the header usually shouldn’t be an <h1>.
2. Put headings in order: h2 for sections, h3 inside those. Pick heading levels by structure, not by how big they look; size is the stylesheet’s job.
3. Wrap the content in <main>, and say the language:

   <html lang="en">
   <body>
     <header>…</header>
     <main>
       <h1>Studioworks</h1>
       <h2>What it does</h2>
       …
     </main>
     <footer>…</footer>
   </body>
   </html>

Back to the rules