The “Heading Accessible Name Check” evaluates whether all heading elements (<h1> to <h6>) on the page contains accessible, descriptive text that is programmatically determinable by assistive technologies (like screen readers).
Example outcome
I observed that all the headings in this page have an accessible name.
Impact
Visual Impairments: Headings act like “landmarks” or a table of contents. Screen reader users often navigate pages by heading level (e.g., jump to next H2). If a heading lacks an accessible name, it’s announced as “heading blank,” which is disorienting and breaks navigation.
Motor Impairments: Users relying on voice navigation or keyboard shortcuts often use headings to quickly navigate between sections. Headings with no name are skipped or inaccessible via those tools.
Cognitive Disabilities: Clear and labeled headings help organize content visually and semantically, making pages easier to scan and digest. Missing or empty headings remove visual anchors and increase cognitive load.
Fixes
To address headings missing accessible name:
Locate the heading missing an accessible name.
Add visible and descriptive text to it.
If the heading is visually hidden for design reasons, have an accessible name via ARIA (e.g., <h2 aria-label="Frequently Asked Questions"></h2>).