Document structure

Landmarks and an unbroken heading order are how an agent builds a map of the page before acting on it.

Standard
Recommended

What it checks

The extension reads the rendered page’s outline in your browser and looks for three problems:

  • No <h1>. The page has no top-level heading.
  • Skipped heading levels. A heading jumps down more than one level, such as an <h2> followed directly by an <h4>. One skip is tolerated; two or more count as a problem.
  • No <main> landmark. Neither a <main> element nor role="main" is present.

Headings are read from inside <main> when the page has one, so headings in the navigation, sidebar and footer do not count against the outline. Hidden elements are ignored. Multiple <h1> elements are not flagged.

Results

Status When
Pass There is an <h1>, at most one skipped level, and a <main> landmark
Warn There is an <h1>, but levels are skipped more than once or there is no <main>
Fail The page has no <h1>
Unmeasured The extension could not read the page (open it in the active tab)

When levels are skipped, the result lists each offending pair and the heading it follows.

How to fix

Wrap the primary content in <main>, give the page one <h1>, and step heading levels down one at a time:

<body>
  <header>…</header>
  <main>
    <h1>Blue running shoes</h1>
    <h2>Sizing</h2>
    <h3>Wide fit</h3>
    <h2>Care</h2>
  </main>
  <footer>…</footer>
</body>

An agent reads the outline as a tree. A jump from <h2> to <h4> makes a section look like the child of the wrong parent, and without <main> it cannot skip the navigation and footer to reach the content.