Heading levels are sequential (no skipping from h1 to h3)
Why it matters
Screen reader users navigate pages by jumping between headings with shortcut keys (H in JAWS, NVDA, and VoiceOver). Skipped levels break that outline — a user lands on an h3 and cannot tell whether they missed intermediate context or whether the h2 simply does not exist. This violates WCAG 2.2 SC 1.3.1 (Info and Relationships) and SC 2.4.6 (Headings and Labels), and blocks Section 508 refresh 502.3.5 conformance required for federal procurement. Multiple h1 elements fragment the document model and confuse assistive technology about the page's primary topic.
Severity rationale
Medium because the page remains functionally usable but navigation for screen reader users is materially degraded and it blocks 508 procurement.
Remediation
Walk each route's rendered DOM from top to bottom and ensure heading levels never increase by more than one step. Reserve exactly one h1 per page for the primary topic and demote decorative text to a styled div or span. Example:
<h1>Pricing</h1>
<h2>Plans</h2>
<h3>Pro tier</h3>
<h2>FAQ</h2>
If the visual design calls for smaller text, control size with CSS (font-size, a utility class) — never by picking a lower heading level.
DetectionPro
The detection method for this pattern is part of AuditBuffet Pro.
The full method (what to look for, pass and fail conditions, and how results get reported) ships inside the Accessibility WCAG Compliance Audit. The pattern definition, severity rationale, and remediation remain openly licensed under CC-BY-4.0.
External references
- wcag:2.2 · 1.3.1 — Info and Relationships
- wcag:2.2 · 2.4.6 — Headings and Labels
- section-508:2018-refresh · 502.3.5 — Label Relationships
Taxons
History
- 2026-04-18·v1.0.0·Initial import from accessibility-fundamentals·automated