DOFIW HTML ACCESSIBILITY TOOLS
Heading Structure Checker
Paste HTML to reveal its heading outline and find empty headings, skipped levels, unclear hierarchy, and ARIA heading problems before publishing.
Paste or try an HTML sample
You can paste a fragment or a complete HTML document. Scripts in pasted code are parsed as inactive text and are not run.
Understand the outline
Heading outline
- Run the checker to build an outline.
Findings and fixes
- No analysis yetINFO
Paste HTML or load an example, then select Analyze heading structure.
Errors identify headings with missing accessible names or invalid ARIA levels. Warnings flag structural patterns that usually deserve review; they do not automatically prove a WCAG failure.
INPUTS AND OUTPUTS
What the checker reads and reports
Input
An HTML fragment or full document containing native headings from h1 to h6, plus optional elements using role="heading".
Output
A visual outline, heading count, errors, review warnings, source positions, explanations, and practical fixes.
The outline indentation shows the level declared in the markup. A jump such as H2 directly to H4 is highlighted because readers navigating by heading may reasonably expect an H3 topic between them.
A GOOD STARTING PATTERN
Make the hierarchy describe the page
Heading levels communicate relationships, not visual size. Use CSS to change appearance and choose the HTML level that correctly represents the section’s place in the document.
WHAT EACH FINDING MEANS
The result is guidance, not a mystery score
Empty accessible name
A heading has no usable text or image alternative, so its purpose may not be announced to assistive technology users.
Skipped level
The outline moves down by more than one level, such as H2 to H4. Review whether an intermediate section is missing or the later level is incorrect.
No primary H1
The checker recommends a clear top-level page heading. This is a usability recommendation and is not presented as an automatic conformance failure.
Repeated heading text
Identical labels can make a heading list ambiguous. Repetition may be legitimate, so the checker asks for human review.
USE CASES
Where this check adds value
- Review a WordPress post before publication.
- Inspect a landing page copied from a page builder.
- Check article templates for consistent section hierarchy.
- Explain heading issues during an accessibility review.
- Compare HTML before and after a redesign or content migration.
LIMITATIONS
What pasted HTML cannot reveal
- The checker analyzes only the code you paste, not the final WordPress header, navigation, sidebar, footer, or content added later by plugins.
- It does not apply external CSS, calculate visibility, or reproduce the browser accessibility tree.
- It cannot decide whether a heading accurately describes the content beneath it.
- Repeated H1 elements and repeated labels are review warnings because context determines whether they are confusing.
- Passing this check does not establish complete WCAG or legal compliance.
PRIVACY
Your HTML stays in your browser
All parsing and analysis happen locally in your browser. The pasted HTML and generated report are not uploaded to a server, stored by this tool, or sent to an API. Clipboard access is requested only when you choose to copy the report.
FREQUENTLY ASKED QUESTIONS
Questions about heading hierarchy
Must every page have exactly one H1?
A clear primary H1 is a useful and widely supported pattern, but this checker does not label multiple H1 elements as an automatic WCAG failure. It asks you to review whether the page purpose and hierarchy remain clear.
Is skipping from H2 to H4 always a WCAG failure?
No. A skipped level is a strong structural warning, not automatic proof of failure. Review the content relationship and use sequential levels when they accurately describe the hierarchy.
Can I use a heading because I want large text?
Use a heading only when the text introduces a section. For purely visual sizing, use CSS on a paragraph or another appropriate element.
Does the checker run scripts found in my HTML?
No. The browser parses the pasted value in an inactive document for inspection. The tool does not insert or execute pasted scripts on the live page.
Why check ARIA headings?
An element with role="heading" should expose a meaningful accessible name and an aria-level. Native HTML heading elements are generally simpler and should be preferred when possible.
Should headings always increase one level at a time?
When entering a subsection, sequential levels make relationships easier to understand. Moving back up may skip levels because it closes nested sections; for example, H4 may validly be followed by H2.
This tool is an educational testing aid and does not guarantee WCAG conformance or legal compliance. Learn more from the W3C headings tutorial.