The heading does not uniquely describe the topic or purpose of the content that follows it.
- Rule ID:
- heading-not-descriptive
- User Impact:
- Moderate
- WCAG :
- 2.4.6.a
Rule
Headings MUST be accurate and informative.
Background
Encountering a "wall of text" that is not broken down into logical sections with headings can be daunting. This is especially true for people with reading or other cognitive disabilities and people who are blind and use a screen reader. Dividing content into logical sections with descriptive headings and subheadings creates a visual and semantic organization of the content. When headings are clear and descriptive, people can find the information they seek more easily, and they can understand the relationships between different parts of the content more easily.
Code Examples
Good Example:
Specific <h1> conveys content of page:
<h1>Stages of Development of a Screenplay</h1>
Specific section headings describe page content and structure:
<h1>Emergency Preparedness Guide</h1>
<h2>Know the Risks</h2>
<h2>Make a Plan</h2>
<h2>Get an Emergency Kit</h2>
<h3>Emergency Kit Basic Items</h3>
<h2>Resources<h2>
Failure Example:
Non-specific headings:
<h1>Main Content<h1>
<h2>Section 1</h2>
<h2>Section 2</h2>
<h2>Section 3</h2>
<h3>(a)</h3>
<h2>Section 4<h2>
How To Fix
To fix this issue:
- Use headings that are clear, informative, and descriptive of the content within the section that follows.
Don't do this:
- Use headings that are generic.