Headings
Rules
- A document must have exactly one
<h1>element. - Headings must form an increasing sequence. In this sequence, heading levels should not be skipped.
- Heading elements must be followed by either content or another heading of one level deeper.
Rationale
- A logical heading structure is invaluable for users of screen readers and similar assistive technologies to help navigate content.
- Users' should be able to use the document's
<h1>to identify it's main content. Documents should have one main subject. -
Heading levels should not be skipped, because a predictable document outline is important for understandibility:
- A heading of level n+1 indicates a sub section of a heading of level n. E.g. If we find a headling of level 3 underneath a heading of level 2, it indicates that this is a sub-section of a section of a web page.
-
However, if one or several heading levels are skipped (e.g.
<h2>followed by<h4>), it is not clear whether the content under<h4>is a sub-section of the section headed by<h2>.
Techniques
Good code example
Failure code example: Heading level sequence that is not increasing
Failure code example: Heading level sequence that skips levels
Tests
| Type | Procedure | Expected result |
| Tool | Use WAVE Toolbar or similar to generate an outline of the html document. | There must be exactly one <h1>. The headings in the page's source order must form an increasing sequence. No heading levels should be skipped after <h1>. |
| Manual | Search document source for <h1>, <h2>, <h3>, <h4>, <h5> and <h6>. |
There must be exactly one instance of <h1>. Each heading should be followed by either by content, or by another heading of one level deeper. |