Heading Structure (H1-H6) Checker
Paste any HTML and get an instant visual outline of the heading hierarchy (H1 through H6). The tool flags every accessibility and SEO problem: multiple H1s, skipped heading levels (H2 → H4 with no H3), empty headings, and pages that open below H1. The overall verdict summarises whether the outline is clean or needs work.
How to use the Heading Structure (H1-H6) Checker
Paste your page HTML (a full document, the <body>, or just a content section) and click Check Heading Structure. The tool uses DOMParser to safely parse the HTML and extract all H1–H6 elements in document order.
Results are displayed as an indented outline where each level of nesting corresponds to the heading level. Below the outline, the tool lists any detected issues:
- Multiple H1s — warn (only one H1 per page is the HTML spec recommendation and a common SEO best practice).
- No H1 — error (every page should have exactly one H1 as its primary topic statement).
- Skipped level — warn for each instance where the heading level jumps by more than one (e.g. H2 → H4). This is a WCAG 1.3.1 concern and confuses screen reader users who navigate by heading.
- Empty heading — error for any heading whose trimmed text content is blank.
The overall verdict at the top is GOOD if no issues are found, or ISSUES FOUND with a count otherwise.
Why heading structure matters for SEO and accessibility
HTML headings (H1 through H6) are not just visual styling — they communicate document structure to browsers, assistive technologies, and search engine crawlers. Screen readers let users jump between headings as a navigation mechanism; if the outline is non-sequential (e.g. H2 → H4, no H3), screen reader users may conclude there is hidden content they are missing, or lose their place in the document hierarchy. WCAG 1.3.1 (Level A) requires that information and relationships conveyed through presentation be determinable programmatically — heading levels are the primary structural signal in HTML.
For SEO, Google uses heading structure as a relevance signal. The H1 is treated as the primary topic label for the page (similar in function to the title tag, but weighted differently). H2 subheadings signal major sections; H3 and below signal sub-topics within those sections. A well-structured outline signals a well-organised, comprehensive page to crawlers. Common mistakes: having the site name in an H1 on every page (use a logo link or site title div instead), using heading tags purely for font-size styling (use CSS classes), and skipping levels for visual spacing (use margin/padding instead).
The rule against multiple H1s is a convention, not a hard HTML error since HTML5 introduced sectioning elements. But Google's John Mueller has confirmed that the search engine treats the first H1 as the primary topic signal, and multiple H1s dilute that signal. For clarity and compatibility with the widest range of tools and AT, use exactly one H1 per page.
Common use cases
- Pre-publish content audit — paste a draft page\'s HTML from your CMS before publishing to catch heading structure errors before they affect rankings or accessibility.
- WCAG compliance review — verify that heading levels are sequential (no skips) as part of a Level A accessibility audit.
- Template QA — check that a CMS theme or static site template produces a correct H1 on every page type (homepage, post, category, product).
- Migrated content check — after a CMS migration, paste pages to confirm that heading tags were not lost or flattened during the export/import process.
- Long-form content structure — when writing a long article with many subheadings, use the outline visualisation to confirm the hierarchy makes logical sense before publish.