Heading structure: one H1, descriptive H2s, and why

Headings do three jobs at once: they tell search engines what a page covers, they are how screen reader users navigate, and they are how AI answer engines find the passage that answers a question. Getting them right is fifteen minutes of work.

The rules

One H1 per page. Multiple H1s are not a penalty - Google has said so explicitly, and HTML5 sectioning technically permits them. But a page with three H1s almost always signals a page that does not know what it is about. The H1 should broadly match the title tag and state the subject once.

Do not skip levels. H1 → H3 with no H2 between them breaks screen reader navigation, which is the concrete cost. Search engines cope; assistive technology does not.

Headings are structure, not style. Choosing H4 because it looks the right size is the most common heading mistake in any codebase. Pick the level by hierarchy, then style it with CSS.

Descriptive, not clever. "Pricing that scales with you" tells a search engine nothing. "How much Acme costs" ranks and gets quoted. Save the wordplay for the body copy.

Why it matters more now

AI answer engines extract passages, not pages. When an assistant answers a question, it locates the section that addresses it and quotes from there.

A page with descriptive H2s that match real questions is far easier to extract from than one with the same content under headings like "Overview" and "Details". You are essentially labelling your own content for retrieval.

Practical version: write your H2s as the questions your reader is actually asking, then answer each one directly underneath.

Structuring a page

For a guide or article:

H1  How to decode a JWT
  H2  Decoding one by hand
  H2  The header
  H2  The registered claims
    H3  Timestamps
  H2  Decoding is not verifying
  H2  The mistakes worth knowing

Each H2 is a question someone typing the H1 query also has. Each has a direct answer beneath it. That shape ranks, gets quoted, and is navigable by keyboard.

For a product or landing page, the same logic applies with different questions: what it does, who it is for, what it costs, how it compares.

What to check

• Exactly one H1, matching the page subject.
• No skipped levels anywhere in the document.
• Every H2 descriptive enough to make sense out of context.
• No headings used purely for visual size.
• Headings in the server-rendered HTML, not injected by JavaScript.
• IDs on headings so sections are linkable - #the-registered-claims is a shareable anchor and a citable target.

That last one is underrated. Adding slugified IDs to every heading costs one plugin and makes every section individually linkable, which is how people cite a specific part of your page.