Whether someone is using a screen reader or just skimming a page, Headings and Labels ensures that all headings are meaningful and labels are descriptive, so users can find and understand content with ease.
This success criterion isn’t about using them, or correctly identifying what’s a heading and what is a label in your code – there are literally three other success criteria that cover those things independently. This one is here to remind you that if you DO use headings and labels, they really do need to be good. Or to use their language, ‘clear and descriptive.’
Who this impacts
- Screen reader users: Clear, structured headings and labels help screen reader users navigate pages and understand the layout without needing to see it.
- People with cognitive disabilities: Well-defined sections and clearly labeled elements make it easier for users with cognitive disabilities to understand and process information.
- All users: Everyone benefits from clear headings and labels, making content easier to skim, navigate, and engage with.
How to meet Headings and Labels
- Create informative headings: Ensure that every heading accurately reflects the content it introduces, guiding users through the page in a logical, understandable way.
- Label forms and inputs clearly: Use labels that explain the purpose of each form element clearly, so users don’t have to guess what information to provide.
- Review for accessibility: Regularly review your site to confirm that headings and labels are descriptive, easy to understand, and accessible for all users.
Practical example
Catbook’s messaging feature has a form with clear labels for ‘name,’ ‘subject,’ and ‘message.’ They also use headings to organize profile information into sections like “Favorite toys” and “Countries visited.”
Top tips
- Write meaningful headings: Make sure every heading provides context about the section it introduces, improving navigability for all users.
- Ensure form labels are clear: Label form fields with meaningful, concise text so users know exactly what to do.
- Test with assistive technology: Use screen readers and other assistive technologies to check that headings and labels are helpful for users who can’t rely on visual cues.