2.4.6 Headings and Labels

What does it mean?

Headings help people understand what each section is about and decide whether to read it. Labels tell people what to enter in a form field or what a control does. Vague headings ("Introduction", "Info") or vague labels ("Field 1", "Value") make pages harder to understand and navigate.

This criterion does not require you to use headings or labels; other criteria cover that. It requires that the headings and labels you do use are descriptive. They can be short, as long as they are clear in context.

Who does it help?

• Screen reader users who jump from heading to heading to get an overview
• People with cognitive or reading disabilities who rely on clear structure
• Everyone scanning a page quickly to find what they need

Common failures

• Several sections all headed "More information"
• Form fields labelled only with an asterisk or a generic word such as "Input"
• Headings used for decoration or slogans that say nothing about the section content
• A button labelled "OK" or "Go" when its purpose is not clear from context

How we test it

• evidence Evidence: our scanner collects material such as screenshots, lists and measurements.

Test question: Do headings and labels describe their topic or purpose?

A person decides every criterion. No criterion ever passes automatically.

How to fix it

<h2>Info</h2>
<label for="f1">Field 1</label> <input id="f1">

<h2>Delivery times and costs</h2>
<label for="postcode">Postcode for delivery</label>
<input id="postcode" autocomplete="postal-code">

The heading and label now state exactly what the section covers and what the field expects.

Practical tips

• Read only the headings of a page in order; they should work like a table of contents.

Guides and patterns on this

• Your first screen reader test in 30 minutesA screen reader shows without mercy whether your page is built properly. This guide lets you test your key pages yourself, with free tools and no prior experience.
• AccordionShow and hide sections, state exposed with aria-expanded.

Official source

Understanding WCAG 2.2 at the W3C: 2.4.6 Headings and Labels