missing-heading

Description

Text that is intended to be a heading must be properly identified as one using semantic HTML heading tags (<h1> to <h6>) or the ARIA role="heading" attribute. This ensures that assistive technologies can correctly interpret and communicate the structure of the content to users.

The missing-heading rule aligns with WCAG Success Criterion 1.3.1 (Info and Relationships), which requires that information, structure, and relationships conveyed through presentation must be programmatically determinable.

Examples

In the following example, text styled as a heading is not marked up with a proper heading tag or ARIA role, violating the missing-heading rule:

In the corrected example, the heading is properly identified using an <h2> tag:

How to fix?

To fix violations of the missing-heading rule, follow these steps:

1. Identify all text that visually appears as a heading.
2. Mark up headings using semantic HTML (<h1> to <h6>) where possible.
3. If HTML headings cannot be used, apply role="heading" and specify the heading level with aria-level.
4. Ensure heading levels follow a logical hierarchy (e.g., <h1> followed by <h2>, etc.).

Reference

• WCAG Success Criterion 1.3.1: Info and Relationships
• W3C ARIA12 Technique: Using role=heading