Headings and Labels
Success Criterion 2.4.6 (Level AA)

Question

Does your website or application use clear headings and labels that provide meaning and organization?

Why is this important

Headings and labels that are clear and descriptive help all users quickly understand what information is contained on the webpage, how the page is organized, aid in comprehension, and provide easier navigation.

Whom does it benefit?

Example 1:

As a person using a screen reader
I want headings and labels to be descriptive and meaningful
so that I can quickly identify the purpose and relationships of the content on the webpage.

Example 2:

As a person with short-term memory loss,
I want headings to be short, clear, and descriptive
so that I can quickly scan and predict what each section is about.

What should you do?

  • Provide section headings that are short, clear and describe the content.
  • Label all elements such as navigation bar, sidebar widgets, forms, tables, and search boxes.

Notes:

  • This success criterion does not mean that headings and labels must exist. However, if they are provided, they must be descriptive enough to provide meaning.
  • Headings and labels should also meet Success Criterion 1.3.1 Info and Relationships.

How do you do it?

  • Identify the main subject of each section and write a short, clear heading that provides an overview of the content.
  • Ensure labels for any element within the webpage or application make the section’s purpose clear.
    • For example, a form may ask the user to type in his/her first and last name. The first field should be labeled “First name” and the second field should be labeled “Last name”.

Need technical guidance?

Additional Resources to help you: