Home › Guides › Heading Structure: What H1–H6 Order Actually Does

Heading Structure: What H1–H6 Order Actually Does

Headings are document structure, not a ranking lever. Here is what they genuinely affect, and what is folklore.

What headings are for

Headings create a navigable outline. A screen reader user can jump between headings to understand a page without reading it linearly; a sighted reader skims them to decide whether to read at all. That is their primary job, and it is a real job.

For search engines, headings help identify what each section covers. Google has stated that heading order is not a significant ranking factor — using them correctly will not move you up, and a messy outline will not by itself push you down.

The practical advice in this article comes from one batch of measurements: 1,696 headings taken from the homepages of 53 well-known sites, fetched on 2026-10-03. The structural half of that survey — how many H1s, how many level skips, how many headings sit inside navigation — is published separately in our heading structure survey. What follows is the other half: what those headings actually say, and what the outline looks like once you stop counting the page furniture.

How we measured this

We requested https://<domain>/ for 78 hand-picked domains spanning news, commerce, SaaS, developer tooling, social, education, finance and government. 53 came back as real homepages with headings in the initial HTML; the other 25 were bot walls (15 non-200 responses), JavaScript shells that ship no headings at all (5: reddit.com, tumblr.com, youtube.com, twitch.tv, wikimedia.org), challenge pages (3) and timeouts (2).

Before counting anything we blanked out script, style, template and noscript, because template blocks routinely contain <h1> markup that never reaches the DOM. We then classified each heading as visible or screen-reader-only, and — this is the part that changed our own numbers — we only count visible headings when describing what a reader sees. That leaves 1,619 visible headings with text, of which 57 are non-Latin and are dropped from every measurement that depends on English words, leaving 1,562.

Finding 1: headings are short, and the distribution is two-headed

The median heading in this sample is 4 words (25th percentile 2, 90th percentile 13, longest 40). That single number hides two completely different kinds of heading living side by side on the same page:

17.3% of headings (271) are a single word. They are labels: News, Sport, Opinion, Culture on theguardian.com; Business, Sports, Style on cnn.com; Markets, Technology, Politics on bloomberg.com. They are doing real work — a screen reader user jumping through them gets a usable map of the sections — but they carry no information for anyone reading them out of context.

18.3% (286) run to ten words or more. These are sentences: "Show up everywhere. Without going anywhere." (shopify.com), "Walmart | Save Money. Live better." (walmart.com), and news headlines, which are the longest headings in the set by a wide margin.

Broken down by level, the pattern is not the one people assume:

h1: 47 headings, median 31 characters / 5 words · h2: 617, median 20 / 3 · h3: 716, median 28 / 4 · h4: 95, median 36 / 6 · h5: 47, median 15 / 2 · h6: 40, median 6 characters / 1 word.

H3s are longer than H2s — median 28 characters against 20. That is not a mistake in our arithmetic; it is what happens when a template uses H3 for content cards (news headlines, product names, feature blurbs) and H2 for the section labels above them. On a homepage, h3 is overwhelmingly the "item" level and h2 is the "group" level, which is the opposite of the hierarchy most style guides describe. If you are auditing your own site, compare each level against its neighbours rather than against a rule of thumb about depth.

Finding 2: broken outlines are rare, and the page furniture causes some of what there is

A level skip — an H4 following an H2 with no H3 between — is the defect every audit tool flags. In this sample it is uncommon: 11 of 53 sites (20.8%) have any skip at all, the median site has zero, and the worst has 6.

Then we removed every heading that sits inside nav, header, footer or aside and recounted. 10 of 53 (18.9%) still skip a level, and 3 of the 13 sites with any skip become completely clean once the page furniture is excluded. The same comparison moves the "first heading on the page is an H1" count from 29 of 53 to 33 of 53 — four sites whose outline only looks wrong because a banner heading comes first.

Why this matters for your own audit: the furniture is not a rounding error. A median of 17.2% of a homepage's visible headings live in nav/header/footer/aside. When an audit reports 40 issues and you cannot tell which ones a reader would ever encounter, the number is unusable. Strip the furniture first, then judge what is left.

Finding 3: one heading in seven is wrapped entirely in a link

227 of 1,696 headings (13.4%) consist of nothing but an <a> element — the whole heading is a link. A further 8 contain a link among other content, so 13.9% contain a link at all. This is heavily concentrated: searchenginejournal.com alone accounts for 103 of them, followed by stanford.edu (26), kubernetes.io (15), bloomberg.com (13) and screamingfrog.co.uk (10); only 19 of the 53 sites do it at all.

It is not a defect, and it is worth understanding why. A link wrapped in a heading is announced by a screen reader as a heading and a link, which is genuinely useful when the heading is the entry point to a section — a card title, a documentation page name. It becomes noise when the heading is a label whose target is arbitrary. Separately, 15.6% of headings (264) contain block-level markup — div, p, ul — and 51 contain a <br>, concentrated in target.com (13), semrush.com (9), moz.com (6) and zoom.us (5). A manual line break inside a heading means the visible text and the accessible name can disagree, and any tool that reads the heading as one line will join two visual lines into one sentence.

Finding 4: nobody agrees on capitalisation, so stop auditing it

We classified every Latin heading into one style. Pooled across the sample: Title Case 28.1%, sentence case 26.6%, single word 16.5%, and everything else under 2%. Because a single site can dominate a pooled percentage, the per-site medians are the honest figure: 22.2% Title Case, 26.5% sentence case.

Our first pass also flagged 25.4% of headings as "inconsistent capitalisation" — some words capitalised, some not, inside one heading. Printing the originals killed the metric. The 397 flagged headings are dominated by proper nouns, and one site provides 151 of them: theguardian.com headlines like "Russell T Davies On fierce fandom and why he keeps a knife by the door" and "Brazil Brazil's neck-and-neck election offers test for growing pro-Trump Latin American bloc". Those are correctly written headlines with names in them. We dropped the metric rather than publish it, and it is worth saying loudly because a version of this heuristic ships in several audit tools.

The finding that did survive is about consistency between pages, not inside them. Of the 35 sites with enough comparable headings, 9 are clearly Title Case (at least 70% of their comparable headings: bloomberg.com, slack.com, asana.com, python.org, mozilla.org, moz.com, screamingfrog.co.uk, searchenginejournal.com, heroku.com), 16 are clearly sentence case (theguardian.com, shopify.com, target.com, github.com, figma.com, trello.com, kubernetes.io, vimeo.com, w3.org, yoast.com, harvard.edu, wise.com and others), and 10 have no dominant style at all. All-caps headings are essentially extinct: 3 of 1,562, all of them deliberate ("EMAIL MAGIC" and "MESSAGE APP SORCERY" on trello.com, "AI PR" on semrush.com).

So the real rule is not "use Title Case" or "use sentence case". It is: pick one per site and hold it, because a third of sites that clearly picked one prove it is possible, and a quarter do not.

Finding 5: question headings are a blog-page habit, not a homepage one

89 of 1,562 headings (5.7%) are questions or open with a question word. The per-site median is 0%: 32 of the 53 sites have no question headings at all. The ones that do are the usual suspects — theguardian.com (22 of 196), searchenginejournal.com (21 of 106), coursera.org (9 of 34), netflix.com (6 of 16) — and Netflix's are its FAQ block.

End punctuation is rare across the board: 8.5% of headings end in any sentence punctuation, made up of 5.4% full stops, 2.6% question marks and a handful of exclamation marks and colons. Headings in the wild are fragments, not sentences. If your headings read as complete sentences with terminal punctuation, you are writing in a register that almost nothing on the web uses — which is fine for an article and odd for a section label.

Finding 6: interface labels as headings, and the 40 phantom headings we almost counted

We matched every heading's text against a list of generic interface labels — Menu, Search, Support, Related, Contact us, Get started, Loading and similar. 64 headings (3.8%) match, across 17 sites, but only 23 of them are visible to a sighted user, across 16 sites. The visible ones are ordinary footer and sidebar headings: Support (6), Contact us (4), Related (3), Get started (3). That is a legitimate use of a heading — a footer column with an H3 labelled "Support" is exactly what a screen reader user needs.

The other 41 are the interesting part. 40 of them are <h3 class="styles_srOnly__y2vPW">Loading...</h3> on target.com — screen-reader-only placeholders emitted by loading skeletons in a carousel. Our first pass counted all 40 as visible headings, because our hidden-heading rule matched class names like sr-only and visually-hidden and this one is a hashed CSS-module name. Printing the tag exposed it. We added a rule for hashed srOnly class names, and the count of visible "interface label" headings dropped from 64 to 23.

If you audit your own site, this is the trap to look for: a component library that renders skeleton placeholders, honeypot labels or carousel announcements as real headings will inflate your outline by dozens of entries that no reader will ever see. Count them in the accessibility tree, not in the audit output.

One more number that surprised us: only 3 of 53 sites have any heading whose text is identical to the page's <title> (walmart.com, harvard.edu, stanford.edu). The folklore that your H1 should match your title tag is not what most large sites do.

When a messy outline does not matter

Do not spend a sprint on this. Heading order is not a ranking lever, and the defects that audit tools flag most loudly are the ones with the least effect. Specifically:

Leave it alone when the headings are furniture. Footer columns, sidebar widgets and off-canvas menus labelled with H2s or H3s are not hurting anyone; they are what makes a footer navigable without a mouse. Fix the content outline and let the furniture be.

Leave it alone when the page is one screen. A landing page with a single H1 and three H2s does not need H3s. Depth is not a virtue; an outline with four levels on a page that has four sections is worse than one with two.

Leave it alone when the fix is visual. If the only reason an H4 exists is that the designer wanted a smaller bold line, restyle it — do not renumber the document to match the comp.

Fix it when it is systemic. The one case that always pays off is the template bug: a theme that renders the site name as the H1 on every page, pushing the real title to H2. That is one line of template code and it changes thousands of pages at once.

Common errors, and how to confirm each one

Symptom: every page's H1 is your company name. Cause: the logo or site title is wrapped in <h1> in the page template. Confirm: view source on three different page types and search for <h1. If all three return the same string, it is the template, not the content.

Symptom: the outline jumps from H2 to H4. Cause: a heading level was chosen for its font size, or a component ships with a hard-coded level. Confirm: find the H4 in the DOM, then look up what CSS rule sizes it. If the rule is shared with a decorative element, the level was chosen visually.

Symptom: your audit reports dozens more headings than you can see on the page. Cause: screen-reader-only headings from placeholders, carousels or honeypots. Confirm: compare the audit count against what you can see with your own eyes, then grep the rendered HTML for sr-only, srOnly, visually-hidden and aria-hidden on heading tags.

Symptom: a heading is announced by a screen reader but invisible, or visible but never announced. Cause: aria-hidden="true" on a heading, or a heading with no text content at all. In our sample, 17 headings have an element and no text, and stripe.com ships a visible H1 carrying aria-hidden="true". Confirm: run the page through the accessibility tree rather than the DOM, and check that every heading has non-empty text.

Symptom: a heading reads as two lines joined together. Cause: a <br> inside the heading — 51 headings in this sample do that. Confirm: read the heading's text content, not its rendered layout.

Separating structure from styling

The reason heading structure goes wrong so often is that HTML gives you six levels and design gives you three or four type sizes. When a designer needs a small bold line that is not a heading, the tempting move is to use an H5 and style it down. That works visually and breaks the outline.

Do it the other way around. Choose the level for meaning, then style each level in CSS to whatever the design needs. An H2 can be 15px if that is what the layout calls for — nothing in HTML says an H2 must be large. Once levels stop carrying visual meaning, you can use them purely for structure, which is the only thing they were ever for.

Checking a page in under a minute

Paste the page HTML into the heading analyzer and read the outline, not the issue count. If the H2 list reads like a table of contents, the structure is fine and the remaining warnings are cosmetic. If it does not, you have found the real problem — and it is usually that the page covers two topics and should be split, or that sections were never given headings at all.

Then do the two things the analyzer cannot do for you. Hide the furniture: look only at headings between the banner and the footer, and check whether the outline still makes sense — in our sample, 3 of the 13 sites with a level skip had no skip once the furniture was removed. And check the visible list against what you can actually see on screen, because the gap between those two is where phantom headings live.

Repeat for your five most important pages. Structure problems are almost always systemic: a template writes the same bad outline on every page, so fixing one usually means fixing hundreds.

Limitations

53 homepages of hand-picked, well-known domains. Homepages are the most argued-over page on any site, and they are also the least representative: article, product and category pages carry far more templated headings and would probably look worse. This sample says nothing about them.

We read the initial HTML only. Anything injected by JavaScript is invisible to this method, and 5 of the 78 domains returned a 200 with no headings at all for exactly that reason. Our count is what a crawler that does not execute JavaScript would see, which is the right baseline for this question and the wrong one for "what does the user see".

Our visible/hidden judgement is conservative and was wrong once already. We count a heading as hidden only when it carries aria-hidden="true", a hidden attribute, a screen-reader class or an inline display:none; anything that requires reading a stylesheet is invisible to us. The hashed srOnly bug above was found by printing the tag, and there is no reason to think it was the only one. Treat every hidden count here as a floor.

The furniture/content split is approximated by container tags. Pages built from div soup with no nav or footer landmarks get their headings counted as content even when they are visually navigation — cnn.com is the clearest case in this sample. Landmark-based analysis is only as good as the landmarks.

One fetch, from one IP address, on one day. linkedin.com served a Chinese-language variant and stripe.com a partially localised one; 57 non-Latin headings were dropped from the text measurements. Any single-location audit has this problem.

One metric was dropped rather than published: the "inconsistent capitalisation" heuristic flagged 25.4% of headings and was wrong on inspection, because proper nouns look like inconsistency to a rule that cannot tell a name from a common noun.

Reproduce it

Both scripts ship with the site. node scripts/survey-headings.mjs fetches all 78 domains and stores the raw HTML; node scripts/survey-heading-text.mjs re-derives every number in this article from that stored HTML with no network access, and refuses to run if the sample has drifted from 53 sites and 1,696 headings. --evidence prints the original text of the rows behind each judgement, which is how both the 40 phantom headings and the bad capitalisation metric were caught.

The two scripts share one extraction module, scripts/survey-heading-parse.mjs, so the structural survey and this one cannot disagree about how many headings exist. The structural half is in our heading structure survey; the pre-publish checklist is where headings sit alongside everything else worth checking before you ship.

About the author

Hongtao Ren (任宏涛) — Developer based in Xi'an, China. Builds browser-based tools and JetBrains IDE plugins. He built and maintains SerpPrism.

Corrections are the most useful thing you can send. If a tool or guide here gives you a wrong answer, that is a bug, not a judgement call — use the contact page.

Questions

Do keywords in headings help rankings?

Marginally at most. A heading that naturally contains the topic word is fine; forcing keywords into H2s makes the outline worse.

Can I skip H1 and start at H2?

Technically yes, but every page benefits from a clear top-level title. There is no reason to omit it.

Should headings be sentence case or title case?

Pick one per site and hold it. Of 35 sites with enough headings to judge, 9 are clearly Title Case and 16 clearly sentence case — and 10 have no dominant style, which is the only group doing anything wrong.

How long should a heading be?

The median heading across 1,562 real headings is 4 words. By level: H1 median 5 words, H2 3, H3 4. There is no limit — but 18.3% of headings run to ten words or more, and those are sentences, not labels.

Is a skipped heading level a real problem?

It is real but rare: 11 of 53 sites have any skip, and the median site has none. What matters more is whether the skip survives after you ignore navigation and footer headings — for 3 of the 13 sites with a skip, it does not.

Should my H1 match my title tag?

Almost nobody does it: only 3 of 53 sites have any heading identical to the page title. Write both to describe the page; do not force them to match character for character.

Is wrapping a heading in a link bad?

No. 13.4% of the headings we measured are a single link, and it is useful when the heading is the entry point to a section or a card. It becomes noise when the heading is a label whose target is arbitrary.

Why does my audit report headings I cannot see?

Usually screen-reader-only placeholders from carousels and loading skeletons. One site in our sample emits 40 of them, all with a hashed CSS-module class name like styles_srOnly__y2vPW. Compare the audit count against the visible page and check for sr-only classes on heading tags.