Heading Structure Checker

What this tool does

Heading Structure Checker parses pasted page HTML or Markdown and lays out every H1 through H6 as an indented outline. It flags a missing or doubled H1, a level that jumps without a step in between, headings with no text, headings hidden from users and repeated headings, so the document outline reads cleanly for both search engines and assistive technology.

The headings on a page form an outline that both readers and machines rely on to understand how content is organised. A screen reader user often jumps straight from heading to heading rather than reading every line, so a level that skips from H2 to H4 or an H1 that never appears makes the page harder to navigate even when it looks fine visually. Search engines also use the heading outline as one signal of what a page is about and how its sections relate to each other.

This checker reads the headings out of pasted HTML, including alt text on images that sit inside a heading, or out of Markdown written with # through ###### marks. It walks the resulting list and reports exactly where the structure breaks down: no H1, more than one H1, a level jump, an empty heading, a heading hidden with CSS or ARIA, and headings that repeat the same wording. Everything runs locally in the browser, so pasted drafts of unpublished pages stay private.

How to use Heading Structure Checker

1. Paste the page’s HTML source (view source, then copy) or a Markdown document into the input box, or drop a file onto it.
2. Review the outline that appears, indented by heading level with each heading’s level marked.
3. Read the warnings and notes shown beside headings that have an issue, such as a skipped level or an empty heading.
4. Turn on “Show only headings with issues” to focus on the handful of lines that need fixing in a long document.
5. Adjust the maximum heading length if you want longer or shorter headings flagged as hard to scan.
6. Copy or download the outline once the structure reads as a single, sensible table of contents.

Tips for better results

• Use exactly one H1 per page that states the page’s main topic; reserve H2 and below for sections and sub-sections.
• Never skip a level purely for a smaller font; style an existing heading level with CSS instead of jumping straight to H4 or H5.
• Headings before the true H1, such as a logo link in a shared header, are common and not an error by themselves, but check the main content still opens with H1.
• Keep headings short and specific; a heading that restates the whole paragraph is harder to scan than a plain label.

Common use cases

• Reviewing a blog post’s outline before publishing to confirm it reads well as a table of contents.
• Auditing an existing page for accessibility issues such as skipped heading levels.
• Checking a Markdown document exported from a CMS keeps a single, sensible heading hierarchy.
• Comparing the rendered heading order against the intended content outline during a redesign.

Common mistakes to avoid

• Choosing heading levels for how big the text looks rather than where a section sits in the outline.
• Leaving a heading element empty, which a screen reader announces with no name at all.
• Repeating the exact same heading text for two different sections, making the outline ambiguous.
• Hiding a heading from sighted users with display:none while leaving it in the markup for keyword stuffing.