Heading Structure Checker
100% private — runs on your device, never uploaded. Works offline once loaded.
Paste a page's HTML to extract its H1-H6 headings, view them as an indented outline, and flag structural issues like a missing H1, multiple H1s or skipped heading levels. Runs entirely in your browser.
What this tool checks
Headings (H1 through H6) form the skeleton of a web page. This tool parses your pasted HTML with the browser's own DOM parser, pulls out every heading in document order, and shows you two things: an indented outline that visualizes the hierarchy, and a set of automated warnings for the most common structural mistakes.
Because it uses the real DOMParser rather than a fragile regular expression, it reads your headings exactly as a browser would, including nested and attribute-laden tags.
The issues it flags
A clean heading structure follows a few simple rules, and this checker verifies each of them:
- No H1: the page has no top-level heading, so search engines and screen readers lack a clear main topic.
- Multiple H1s: more than one H1, which dilutes the page's primary heading and is best avoided.
- Skipped levels: a jump like H2 → H4 that breaks the outline; each heading should be at most one level deeper than the previous.
- First heading isn't H1, or a heading is empty — both weaken the document outline.
How to build a good hierarchy
Think of headings as a nested outline, like a table of contents. Start with one H1 that states what the whole page is about. Break the page into major sections with H2s. Where a section needs sub-points, use H3s, and only go deeper (H4–H6) when the content genuinely nests that far.
Never choose a heading level for its visual size — style that with CSS. The level should reflect the content's logical depth, so both search engines and assistive technology can reconstruct your outline correctly.
Reading the outline
The indented outline shows each heading's text at an indentation matching its level, so a well-structured page reads like a clean, progressively-nested list. If you see text jumping erratically in and out, or a lone deeply-indented heading, that's a visual cue that your hierarchy needs attention.
Remember this checks structure, not content quality. Descriptive, keyword-relevant heading text still matters — but a solid structure is the foundation that makes that text work for SEO and accessibility.
Frequently asked questions
Is my HTML sent to a server?
No. Parsing and analysis happen entirely in your browser using the built-in DOMParser. Nothing you paste is uploaded.
Can I paste a whole page's source?
Yes. Paste as much HTML as you like — the full page source or just a section. The tool extracts only the heading elements and ignores everything else.
Can it fetch a live URL for me?
No. For privacy and to avoid cross-origin restrictions, this tool works on HTML you paste in. View a page's source or copy its markup, then paste it here.
Are multiple H1s always wrong?
Not strictly — HTML5 technically allows more than one. But for reliable SEO and accessibility, one H1 per page remains the recommended convention, so the tool warns when it finds several.
Why does it flag an H2 followed by an H4?
Because that skips the H3 level, breaking the logical nesting. Screen-reader users and search engines expect each step down to be exactly one level. Insert an H3 or promote the H4 to an H3.
Does the tool consider heading text or just the tags?
It analyzes the structure (which levels appear, in what order) and flags empty headings, but it doesn't judge the wording. Writing descriptive, relevant heading text is still up to you.
Advertisement