Best practices for descriptive headings
Create a clear structure
Use headings to create a logical hierarchy. See WCAG 1.3.1 Info and Relationships.
- Follow a hierarchy: Use
<h1>
for the page title,<h2>
for main sections, and<h3>
for subsections. Each level should build on the last. - Avoid skipping levels: Don’t jump from an
<h2>
to an<h4>
. A consistent structure makes content easier to follow.
Write descriptive, meaningful headings
Descriptive headings help readers and screen reader users understand what each section covers. See WCAG 2.4.6 Headings and Labels.
- Be specific: Avoid vague headings like “Introduction” or “Products.” Instead, try “Introduction to Web Accessibility” or “Top Products for Digital Accessibility.”
- Keep it concise: Make headings clear but short. Aim for one line whenever possible.
Use headings consistently
Consistency improves readability.
- Style and formatting: Keep heading styles (font size, weight, color) uniform within each level.
- Language and tone: Use a consistent tone and style in all headings to create a cohesive experience.
Consider your audience and purpose
Write headings that meet your readers’ needs.
- Audience: If your readers are technical, your headings might be more detailed.
- Purpose: In a guide, for example, headings should clearly mark each step or section.
Improve scannability
Headings help users who are scanning find key information quickly.
- Front-load key words: Start with the main topic so readers get the gist right away.
- Break up long text: Use headings to divide long sections for easier reading.
Test for accessibility
Testing headings ensures they work for all users.
- Screen reader testing: Use a screen reader to check if your headings make sense when read aloud.
- User feedback: Ask users with disabilities if your headings help them navigate the content.
Examples of descriptive headings
- Before: “Products”
- After: “Top products for accessibility”
- Before: “Services”
- After: “Digital marketing services for small businesses”
- Before: “Conclusion”
- After: “Conclusion: Why clear writing improves accessibility”