Heading tags: structuring H1, H2 and H3

What is a heading tag?

A heading tag is an HTML heading element, from <h1> to <h6>. The number gives the rank: 1 for the main title, 6 for the finest level. Together they form the heading structure: the outline of the page as a browser, a search engine or a screen reader reads it.

<h1>Heading tags: structuring H1, H2 and H3 properly</h1>
  <h2>What is a heading tag?</h2>
  <h2>Which rules should you follow?</h2>
    <h3>Only one H1 per page?</h3>
    <h3>Can you skip a level?</h3>

Level	Role	Common use
H1	Main title of the page	One per page, states the topic or the target query
H2	Main parts	4 to 8 in an article, often phrased as questions
H3	Subparts of an H2	Detail, steps, special cases
H4 to H6	Finer levels	Rare in an article; useful in technical documentation

A heading tag describes a structure, not a font size. MDN makes the point: to make text bigger, you use the CSS font-size property, never a heading.

Do heading tags matter to Google?

Yes, but not in the way you often read. Google’s SEO Starter Guide lists heading order among the things not to focus too much on. Headings in semantic order are useful for screen readers. For Google Search, using them out of order does not matter.

That does not make headings useless. They play three documented or observable roles:

• Understanding the page: headings divide the content into topics. A clear H2 signals what the section covers.
• Fallback title in the results: according to the documentation on title links, Google may use the main visible title or heading elements when the title tag is empty, outdated or inaccurate.
• Fast reading: a reader in a hurry scans the headings to find the answer. A clear outline takes them there directly.

Why does heading structure matter for accessibility?

This is where the hierarchy becomes a requirement. A screen reader lists the headings on the page and lets the user jump from one to the next. An inconsistent structure amounts to handing over a wrong table of contents.

Two standards cover this point:

• WCAG success criterion 2.4.6 (version 2.2, level AA) requires headings to describe the topic or purpose of the section;
• RGAA criterion 9.1 (version 4.1), the French accessibility standard, checks that the hierarchy between the headings of each page is relevant.

The W3C tutorial on headings states the practical rule: do not go straight from an H2 to an H4. Going back up several levels when closing a section, from an H4 to an H2, is fine.

Which rules should you follow for a clean heading structure?

The rules below combine accessibility requirements with the writing conventions applied at Elev8 Lab:

• A single H1, which states the topic in 5 to 7 words and contains the keyword or a variant.
• H2s for the main parts, each carrying a secondary intent. Several can be phrased as questions.
• H3s for the detail, attached to their H2. At least two H3s under the same H2, otherwise the split adds nothing.
• No skipped level on the way down: H2 then H3, never H2 then H4.
• Headings in the editorial content only: no heading tags in the header, menu, sidebar or footer of inner pages.
• Short, explicit headings, with no link, no heavy punctuation and no mechanical repetition of the same keyword.

Only one H1 per page: requirement or convention?

Convention. The HTML standard allows several non-nested H1s, and no Google documentation forbids it. MDN nevertheless calls this practice a bad one: a page should generally have a single H1 that describes its content. A single H1 also avoids the “no clear main title” ambiguity. That is one of the cases in which Google rewrites the displayed title.

Can you skip a heading level?

Technically yes: Google states that heading order does not count for its search engine. For a screen reader user, an H4 that follows an H2 suggests a section is missing. The rule is therefore simple: go down one level at a time, go back up freely.

On the writing side, the heading structure is built before the text. It starts from the intent and from the questions on the results page. The full approach is detailed in SEO writing and search intent.

Examples of heading structure by page type

The right outline depends on the role of the page. Three fictional examples:

Blog article	Service page	E-commerce category
H1: Title tag: how to write it?	H1: Technical SEO audit	H1: Men’s trail running shoes
H2: What is the title tag?	H2: What the audit covers	H2: Choosing the right trail shoe
H2: What length should you aim for?	H2: The 4-step process	H3: By terrain
H3: What Google says	H3: Crawling and indexing	H3: By distance
H3: What studies measure	H3: Performance	H2: Frequently asked questions
H2: Frequently asked questions	H2: Pricing and timelines

In an article, the H1 and the title tag cover the same topic without being identical. The first titles the content for the reader; the second is written for the results page.

How do you audit the heading structure of a page or a site?

1. Read the headings alone: with an extension such as Web Developer (Information menu, “View Document Outline”) or HeadingsMap, display the outline of the page. If it does not let you understand the topic, the structure needs reworking. Time: 2 min per page
2. Check the templates: spot the heading tags added by the theme in the header, menu, sidebar or footer. They repeat on every page and blur the outline.
3. Crawl the site: Screaming Frog lists the H1s and H2s of each URL. Filter for missing, multiple or duplicate H1s across pages.
4. Check accessibility: a screen reader (NVDA, VoiceOver) or an audit tool such as WAVE flags skipped levels and empty headings.
5. Fix things in the right place: a template issue is fixed in the theme, a writing issue in the editor. In WordPress, the Gutenberg Heading block lets you choose the level without touching the code.

The heading structure is only one of the elements of a page. For all the levers, see on-page SEO and the SEO guide.