Heading checker that draws your page’s outline

What this H1 checker looks for

Enter a URL and the checker fetches the page once, reads the HTML your server sends, and lists every <h1> to <h6> in source order. The HTML standard defines a page’s outline the same way: all its headings, in tree order^[10]. You get that outline as an indented tree, with a badge for each level, a count per level, and these checks:

• The H1. Missing, more than one, or one that looks like the site logo (an H1 in the header holding an image or a short name).
• H1 against the title. Identical, the same plus your brand, sharing keywords, or saying something else entirely.
• Skipped levels. Every place a heading jumps more than one level down, such as an H2 followed by an H4.
• Empty and image-only headings. Heading tags with no text, and headings whose only content is an image, with or without alt text.
• Long and duplicate headings. Headings over 70 characters, which are usually paragraphs in the wrong tag, and the same heading text used more than once.
• Hidden headings and page furniture. Headings hidden by the markup, headings for screen readers only, and headings in menus, sidebars and footers that sit in the same outline as your content.
• Question headings. The share of H2 to H4 headings phrased as questions, using the same rule as the GEO Audit’s question-shaped headings check, and that check’s verdict next to the audit’s H1 and heading hierarchy checks.

The outline copies as plain text or Markdown, ready for a ticket or a content brief. Press Example to see a full result on a made-up page first; it runs in your browser and fetches nothing.

Sources: WebAIM Screen Reader User Survey #10^[14]; the HTML standard^[10].

What headings do for readers, Google and AI answers

For readers

Headings are how people skim, and how screen reader users move around a page. In WebAIM’s 2024 survey of 1,539 screen reader users, 71.6% said their first move to find information on a long page is to navigate through its headings, far ahead of using the find feature (13.6%) or reading the page through (6.4%)^[14]. Heading levels matter to them too: 88.8% found them very or somewhat useful^[14]. A page with no headings, or with headings that are really just bold text, takes that away.

For Google

Google’s SEO Starter Guide asks you to break up long content into paragraphs and sections, and provide headings to help users navigate your pages^[1]. Google also lists heading elements such as <h1> among the sources it uses to build the title link shown for a result, alongside the <title> element and the main visual title, and asks you to make it clear which text is the main title of the page^[2]. What Google does not do is grade your heading markup. The same guide says that from a Google Search perspective it doesn’t matter if your headings are out of order, and that the web in general is not valid HTML, so Google can rarely depend on semantic meanings hidden in the HTML specification^[1].

For AI answers

Two things are documented. First, what AI crawlers can read. Vercel and MERJ analysed crawler traffic across Vercel’s network and found that none of the major AI crawlers render JavaScript, naming OpenAI’s OAI-SearchBot, ChatGPT-User and GPTBot, Anthropic’s ClaudeBot, Meta, ByteDance and PerplexityBot; the exceptions were Gemini, which uses Googlebot’s infrastructure, and AppleBot^[8]. Google itself still recommends server-side rendering because not all bots can run JavaScript^[7]. That is why this checker reads server HTML: it is the version those crawlers get.

Second, how retrieval systems commonly split documents. LangChain’s documentation explains that chunking aims to keep text with common context together, so it can make sense to honour the structure of the document, and its header splitter cuts at headings and keeps the parent headings with each chunk^[15]. Whether a given AI search engine does exactly this is not published. But the logic is general: a heading marks where one passage ends and the next begins, and tells whatever reads the passage what it is about. The chunk view in the result shows your page cut that way.

One H1 or several? What Google actually said

This is the most argued-over heading question, and Google has answered it more than once. In a 2019 Search Central video, John Mueller said: “Our systems don’t have a problem when it comes to multiple H1 headings on a page. That’s a fairly common pattern on the web.”^[3][4] A few days earlier, in an office-hours hangout, he put it more bluntly: “Your site can do perfectly fine with no h1 tags or with five h1 tags.”^[5] In the same video he added that clear, semantically structured headings do help Google understand a page^[4].

Sources: Google^[3][1]; Search Engine Roundtable^[5]; MDN^[9].

So why does this checker still warn about a second H1, and why does the GEO Audit check for exactly one? Because Google is not the only reader. MDN’s guidance is that multiple H1s are allowed by the HTML standard but are not considered a best practice, and that a page should generally have a single H1 that describes its content, similar to the <title>^[9]. One H1 tells a screen reader user, a summariser and a crawler the same thing about the page’s topic. Two make them guess. In practice the second H1 is rarely a choice: it is the logo, a cookie banner or a modal title that a theme wrapped in <h1>. The checker points at the logo case specifically.

Heading hierarchy and accessibility

The W3C’s Web Accessibility Initiative puts the rule simply: nest headings by their rank, from H1, the most important, to H6, the least. Then: “Skipping heading ranks can be confusing and should be avoided where possible: Make sure that a <h2> is not followed directly by an <h4>.” Going back up is different: after an H4 subsection, the next H2 simply starts a new section^[11]. MDN adds the practical version: do not skip levels, and do not use heading elements to resize text; use CSS font-size instead^[9].

<h1>Running shoes for beginners</h1>
  <h2>How do I choose my first pair?</h2>
    <h3>Cushioning</h3>
    <h3>Heel-to-toe drop</h3>
  <h2>Our picks</h2>
    <h3>Best overall</h3>
    <h3>Best for trails</h3>
  <h2>When should I replace running shoes?</h2>

In WCAG terms, real heading markup is how you meet Success Criterion 1.3.1, Info and Relationships: technique H42 uses h1 to h6 so that headings are programmatically determinable, not just big and bold^[13]. Success Criterion 2.4.6, Headings and Labels, at level AA, asks that headings and labels describe their topic or purpose. It does not require headings; it requires the ones you have to be descriptive^[12]. That is why the checker flags empty headings and duplicates: a list of headings that reads “Overview, Overview, Learn more” describes nothing.

Two cases look like skips and are not. A level jump going up (H4 to H2) is fine, as above. And a page whose first headings are in the navigation or a promo bar, before the H1, is not skipping anything, but it does mean screen reader users meet your menu titles before your content. The checker lists those as a note, and you can hide menu and footer headings in the outline to see the content alone.

Should your headings be questions?

Some of them. The GEO Audit’s question-shaped headings check looks at your H2, H3 and H4 headings and counts one as a question if it contains a question mark or starts with how, what, why, when, which, who, is, are, can, does, do or should. It passes when at least one heading is a question. This checker uses the identical rule, so its share and the audit’s verdict always agree.

The case for it is reasoning, not a published ranking rule. People type and speak questions into AI assistants, so a heading that is a question, with a direct answer in the first sentence beneath it, is a self-contained passage that matches one. It also helps a person who skims the outline find their question. No AI search engine documents that it rewards question headings, and you should not turn every heading into one: “Our picks” is clearer than “What are our picks?”.

Answer the question right away. A question heading followed by three paragraphs of preamble is worse than a label. The readability checker tests whether a page’s opening paragraph works as a quotable answer, and the People Also Ask guide covers how to find the questions people actually search. If a page is a set of questions and answers, mark them up with the FAQ schema generator.

How an answer engine might split your page

The last panel in the result cuts your page at every heading and shows, for each section, the headings above it, the words in it and how it starts. That is how a header-aware splitter such as LangChain’s works: each chunk is the text under one heading, with its parent headings kept as metadata^[15]. Read it with two questions in mind:

• Does each section stand on its own? A passage lifted out of the page keeps its heading and loses everything around it. “Best overall” under “Our picks” is clear in context and vague alone, which is one more reason duplicate headings hurt.
• Is any section too big? Over 400 words with no subheading is our threshold, not a published one. A section that long usually covers several points, and splitting it with H3s gives each point its own passage.

Headings that are hidden or used for styling

The checker reports headings hidden by the markup itself: the hidden attribute, aria-hidden="true", an inline display:none, and common screen-reader-only classes such as sr-only, visually-hidden and WordPress’s screen-reader-text. It cannot see rules in your stylesheet or changes made by scripts, so a heading hidden by CSS shows up as visible.

Hidden is not automatically wrong. A heading in a closed mobile menu or a tab is hidden for good reasons, and Google’s spam policies say that accordion and tabbed content, and text that is only accessible to screen readers to improve their experience, are not hidden text. What the policies do describe as abuse is text placed solely to manipulate search engines and not easily viewable by people, such as white text on a white background or text positioned off-screen^[6]. A keyword-stuffed H1 hidden from view is that pattern.

Headings used for styling are the more common problem. The giveaways are a heading level chosen for its font size (an H4 where an H3 belongs), a whole paragraph or product card wrapped in a heading tag, and footer column titles marked up as H2s that compete with your content. Shopify’s theme guidance says it plainly: headings set the logical order of content, not the design^[19].

Fixing headings in WordPress, Shopify and Next.js

Most heading problems come from a template, not from the person writing the page. Find where the tag is set, change it once, and every page that uses the template is fixed.

<!-- Before -->
<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></h1>

<!-- After -->
<p class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></p>

type Level = 2 | 3 | 4;

export function Card({ title, level = 3, children }: { title: string; level?: Level; children: React.ReactNode }) {
  const H = `h${level}` as const; // h2, h3 or h4, chosen by the page
  return (
    <section>
      <H className="text-lg font-semibold">{title}</H>
      {children}
    </section>
  );
}

Heading checklist

Run through this before you publish a page or ship a template change. Your ticks are saved in this browser only.

Check the headings on every page

This checker reads one page. Heading problems usually come from templates, so the same logo H1 or skipped level is on hundreds of pages, and the one-off problems hide in old posts nobody opens. The GEO Audit crawls your site and runs 31 checks on every page, including the three you saw above: exactly one H1, a clear heading hierarchy, and question-shaped headings, with each failing page listed.

The free account audits 10 pages with an email address and no card. Paid plans audit more and re-run on a schedule; every limit is on the pricing page. For a deep check of one URL, the AI SEO checker runs all 31 checks for free.

Questions people ask

Sources