More info: H42: Using h1-h6 to identify headings
The title of this error may appear slightly different depending on the testing tool used. Some common examples are:
Headings nested in landmarks (FAE)
Headings must be properly nested (FAE)
Ensures the order of headings is semantically correct (aXe)
Video Overview Screen Recording 2022-08-17 at 04.02.09 PM
Every page should include 1 (and only 1) H1 tag. This should be the first h tag on every page
Document headings should be arranged in numerical order throughout the page (e.g h1 > h2 > h3
Headings should never be skipped (e.g h2 > h4)
You should never use a heading tag to achieve a specific style
This error may overlap with other errors and so it should be fixed in content where possible before reporting theme issues.
What to check:
Does my page have an h1?
Am I Using h tags to style content?
Did I omit h1 or h2 tags and go directly to h3 or lower
Did I skip heading levels
<!-- ... page hero --> <div> <h4>Some Pre-title</h4> <!-- ? Incorrect because h3 tag preceeds h2. Incorrect because h4 tag is used to style content --> <h2>My Title</h2> </div> <!-- ... page footer -->
<!-- ... page hero --> <div> <h2 class="h4">Some Pre-title</h2> <!-- ✅ Correct because headings are in numerical order. We are using the class "h4" to stlye our element--> <h3 class="h2">My Title</h3> </div> <!-- ... page footer -->