Skip to content

How to fix: Every page needs a top-level heading

A single <h1> that names the page's main topic anchors the heading outline and orients assistive-tech users as soon as they arrive.

The fix

Add a single <h1> that describes the main content of the page.

Who this affects

A screen-reader user who lands on the page presses 1 in NVDA or JAWS, or opens the rotor in VoiceOver, expecting to jump straight to the heading that names the page. With no level-one heading, that shortcut has nowhere to go and they have to read down from the top of the document to work out where they are and whether the link they followed took them to the right place. This is an axe best-practice rule with no success criterion behind it, so it is not a conformance failure on its own, though heading navigation is one of the most used screen-reader features.

Before and after

Fails
<h2>Welcome</h2>
Passes
<h1>Welcome to Acme</h1>

Where this usually comes from

  • The page title is a styled <div> or <p> carrying the large-heading class, because the h1 style was reserved for the marketing homepage.
  • A single-page app renders the h1 inside one layout, and detail, search or error routes mount a different layout that never adds one.
  • A shared heading component defaults to level 2, so templates that never pass a level render the page title as an h2.
  • A CMS hero block holds the h1 and editors publish pages with that block left empty.
  • The visual title uses role="heading" without aria-level, or with aria-level="2".

Checking it yourself

Run document.querySelectorAll('h1, [role="heading"][aria-level="1"]') in the browser console; you want one result, and its text should name the page rather than the site. Then check it in practice: start NVDA and press 1, or on macOS press VO+U and pick Headings in the rotor, and confirm the first stop tells you which page you are on.

A scanner finds this one automatically. What it cannot judge, and how the score is built, is on how we test.

Related fixes

Check your site for this issue

Scan any page free against WCAG 2.2 AA and get every automatically detected issue with its fix.

Scanning a page needs no account. The checks run on axe-core.

← All fix guides