Screen readers expose a page outline built entirely from heading elements. Users—especially blind users navigating long pages—jump between headings using the H key to skim structure. A heading hierarchy that skips levels (H1 → H3, H2 → H4) breaks this outline, making the document feel structurally incoherent and forcing users to re-navigate to understand context. WCAG 2.2 SC 1.3.1 (Level A) requires information conveyed through structure to be programmatically determinable, and SC 2.4.6 (Level AA) requires headings to be descriptive. Section 508 2018 Refresh 502.3.6 incorporates both.
High because a broken heading hierarchy disrupts the primary navigation mechanism for screen reader users on content-heavy pages, though it does not prevent access to individual elements.
Audit the heading structure of each page using browser DevTools (Accessibility tab) or the axe extension, then restructure to enforce sequential levels. Never skip from H1 to H3 or H2 to H4:
{/* Correct: sequential nesting */}
<h1>Documentation</h1>
<h2>Getting Started</h2>
<h3>Installation</h3>
<h3>Configuration</h3>
<h2>API Reference</h2>
<h3>Authentication</h3>
<h4>OAuth Flow</h4>
If a heading level looks visually wrong after correction, fix the style, not the hierarchy:
/* Style H3 to look large without breaking hierarchy */
h3.section-title { font-size: 1.5rem; font-weight: 700; }
Never choose a heading tag for its default visual size—use CSS instead.
gov-section-508.wcag-core.heading-hierarchyhigh<h1>, <h2>, <h3>, <h4>, <h5>, <h6>) across every page route. Verify that heading levels are sequential — no jumps (e.g., H1 directly to H3, or H2 directly to H4). Examine both static layout files and page-specific content."On /docs, the H1 'Documentation' is followed directly by an H3 'Installation' with no H2 in between. Later, an H2 'API Reference' appears, then H4 'GET /users' with no H3 bridging the levels."<h1>Documentation</h1>
<h2>Getting Started</h2>
<h3>Installation</h3>
<h3>Configuration</h3>
<h2>API Reference</h2>
<h3>Users</h3>
<h4>GET /users</h4>