This Wiki page is edited by participants of the WCAG Working Group. It does not necessarily represent consensus and it may have incorrect information or information that is not supported by other Working Group participants, WAI, or W3C. It may also have some very useful information.

Using aria-label for 1.1.1

From WCAG WG
Jump to: navigation, search


Status

  • 1 Nov 2012: Ready for TF review
  • 2 May 2013: Needs revision from survey comments; lower priority so moving to "later" list

User Agent and Assistive Technology Support Notes [To be published separately]

  • Jaws 13 and higher supports this technique
  • NVDA 2012.2 and higher supports this technique

Applicability

This technique applies to HTML with ARIA.

This technique relates to Success Criterion (SC) 1.1.1. (Non text content):

Description

The purpose of this technique is to provide a short description for an element that can be read by Assistive Technologies (AT). The aria-label attribute makes it possible to provide a short text description. When an AT (such as a screen reader) encounters the element, the aria-label text is read automatically.

Examples

Example 1

This example shows how to use the aria-label attribute to provide a short text description for an image. Note: The alt attribute must also be included in conforming documents.

<img src="bicycle.gif" alt="A shiny red bicycle" aria-label="A shiny red bicycle">

Resources

Tests

Procedure

  1. Examine each element where the aria-label attribute is present.
  2. Determine that the text description accurately labels the element, provides a description of its purpose, or provides equivalent information.

Expected results

Test 2 is true.