WCAG 2.4.6 Headings and Labels

What it asks

People use headings to find their way around a page and labels to know what to type. This rule asks that both describe their topic or purpose. "Opening hours" is a heading that does its job. "Information" is not. "Email address" is a label that does its job. "Field 1" is not.

It is worth separating from two neighbours. 1.3.1 Info and Relationships asks that headings and labels exist as structure in the code, so a heading is a heading element rather than bold text. 4.1.2 Name, Role, Value asks that each control has a name assistive technology can read. 2.4.6 asks that the name, once it exists, is useful. A field can have a perfectly good programmatic label that reads "Field 1" and fail this criterion alone.

It does not require headings or labels to exist. A page with no headings cannot fail 2.4.6, though it may fail elsewhere. It does not require them to be long. "Price" is a fine label. It is Level AA.

Its official name is success criterion 2.4.6 Headings and Labels, at Level AA. It was added in WCAG 2.2, under guideline 2.4 Navigable and the principle Operable. The W3C’s normative text says, in part:

“Headings and labels describe topic or purpose.”

From WCAG 2.2, W3C. Full explanation: Understanding 2.4.6 Headings and Labels.

Who it helps

Screen reader users, who often move through a page by its headings and need each one to say what is there, and who hear a field’s label as they land on it. People with cognitive disabilities and reading difficulties, who scan headings to find the part they need and should not have to read a section to find out what it was about.

People with low vision using magnification, who see a label and a field with little else around them for context.

What passes and what fails

These pass

• A support page with headings "Delivery times", "Returns" and "Contact us".
• A form with labels "Full name", "Email address" and "Date of birth (DD MM YYYY)".
• A long article broken into sections, each headed with what that section covers.
• A table of search results with headings for each result that give its title.
• A short label such as "Postcode", where the word says everything the person needs.

These fail

• Three sections on one page each headed "Information".
• Form fields labelled "Field 1", "Field 2" and "Input".
• An empty heading element used to add space between sections.
• A heading that reads "Welcome" above the section that actually lists the opening hours.
• A field whose only label is a placeholder that vanishes as soon as the person starts typing, leaving nothing to say what the field was for.

A placeholder is not a label. It disappears on input, it is often too faint to read, and some assistive technology does not treat it as a name. A field that has only a placeholder usually fails 1.3.1 or 4.1.2 as well as this criterion.

How to test it by hand

1. Use a screen reader’s heading list, or a browser extension that lists the headings, and read it without the page. Each heading should tell you what its section holds.
2. Read each heading against the content under it and check they agree.
3. Look for empty headings, in the list or in the browser’s developer tools.
4. For each form, read each label against its field. Could a person tell what to type from the label alone?
5. Check that each field has a visible label, not only a placeholder.

What automated testing can decide

What a machine can decide

Whether a heading has any text at all is a plain fact about the page, and an empty heading is a clear failure. Automated testing can also collect every heading and every label together with the content it introduces, which is what a person needs in order to judge it.

What it cannot

Whether "Details" describes its section is a question about meaning, and the answer depends on the section. The same word can be right on one page and empty on another. That is a judgement about the content, and automated testing cannot make it from the markup.

How Dreven handles it

Dreven finds the headings and form labels on your pages and shows you each one beside the content or field it introduces. A reviewer decides whether each one describes its subject, and may be offered a suggested wording to take, edit or ignore; nothing is changed on the page.

The report says how each result was decided.

No automated check makes a site conform. In Dreven, a person reviews the results and signs the report.

Related criteria

• 1.3.1 Info and Relationships (Level A). Headings and labels must exist as structure in the code. 2.4.6 asks that they are useful.
• 4.1.2 Name, Role, Value (Level A). A control must have a name assistive technology can read. 2.4.6 asks that the name says something.
• 3.3.2 Labels or Instructions (Level A). Fields need labels or instructions in the first place.
• 2.4.2 Page Titled (Level A). The page title must describe the page, the same idea one level up.

Questions people ask

All WCAG 2.2 criteria, in plain words