User Agent Support Notes for ARIA Techniques

This page documents user agent support notes for ARIA Techniques.

-

WAI-ARIA Technology Notes

To improve accessibility, WAI-ARIA provides Web developers with the option to add the following semantic information to Web pages and rich Internet widgets which are then exposed to the browser:

The combination of these features and the structural information conveyed by the DOM structure allow authors to produce an interoperable solution to assistive technologies. (Source: WAI-ARIA Overview)

User Agent Support for WAI-ARIA

User Agent support for WAI-ARIA varies, but overall support for WAI-ARIA is improving. Browsers which support WAI-ARIA map WAI-ARIA roles and properties to platform accessibility APIs.

Accessibility Support for WAI-ARIA

Using technologies in an Accessibility Supported way is required for conformance claims. Read more about Accessibility Support. The WCAG Working Group plans to review which WAI-ARIA techniques are sufficient when Accessible Rich Internet Application specifications reach W3C Recommendation status. Refer to WAI-ARIA Overview for the latest information on the status of WAI-ARIA.

ARIA1: Using the aria-describedby property to provide a descriptive label for user interface controls

See User Agent Support for WAI-ARIA for general information on user agent support.

IE 8 only supports aria-labelledby with a single id value and it partially supports aria-describedby.

ARIA2: Identifying a required field with the aria-required property

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA4: Using a WAI-ARIA role to expose the role of a user interface component

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA5: Using WAI-ARIA state and property attributes to expose the state of a user interface component

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA6: Using aria-label to provide labels for objects

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA7: Using aria-labelledby for link purpose

See User Agent Support for WAI-ARIA for general information on user agent support.

Screen reader testing as of October 2012

See full testing results for Example 1

See full testing results for Example 2

David tested on Aug 25, 2013... Example 2 and 3 are still not sufficiently supported.

ARIA8: Using aria-label for link purpose

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA9: Using aria-labelledby to concatenate a label from several text nodes

See User Agent Support for WAI-ARIA for general information on user agent support.

Note: In order to support IE, the attribute tabindex="-1" may need to be provided on non-interactive elements that are referenced by aria-labelledby attributes. For more details see Using WAI-ARIA in HTML.

ARIA10: Using aria-labelledby to provide a text alternative for non-text content

See User Agent Support for WAI-ARIA for general information on user agent support.

As of March 2014, there is much wider accessibility support for the use of the alt attribute than for aria-labelledby. The use of the alt attribute is best practice and strongly encouraged. Especially for elements where the alt attribute can be used to provide text alternatives, authors must confirm accessibility support for aria-labelledby before relying on this technique in place of H37: Using alt attributes on img elements.

ARIA11: Using ARIA landmarks to identify regions of a page

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA12: Using role=heading to identify headings

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA13: Using aria-labelledby to name regions and landmarks

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA14: Using aria-label to provide an invisible label where a visible label cannot be used

See User Agent Support for WAI-ARIA for general information on user agent support.

Screen reader support varies depending on browser:

Here are the results of some detailed testing:

ARIA15: Using aria-describedby to provide descriptions of images

See User Agent Support for WAI-ARIA for general information on user agent support.

Updated July 16, 2013

ARIA16: Using aria-labelledby to provide a name for user interface controls

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA17: Using grouping roles to identify related form controls

See User Agent Support for WAI-ARIA for general information on user agent support.

This technique works with:

ARIA18: Using aria-alertdialog to Identify Errors

See User Agent Support for WAI-ARIA for general information on user agent support.

ARIA19: Using ARIA role=alert or Live Regions to Identify Errors

See User Agent Support for WAI-ARIA for general information on user agent support.

Supports this technique:

Does NOT support this technique:

Support Notes:

Internet Explorer versions 7 through 11 do not support notifications as described in this technique when using role="alert". However, using aria-live="assertive" as described in example 1 does function correctly.

When using Firefox with JAWS and NVDA role=alert is announced as "Alert" and aria-live=assertive does not include that extra text. There is NO support for NVDA 2013.1 + IE 8. The third example uses BOTH role=alert & aria-live=assertive on the error container for wider UA/AT support working in all combinations listed.

There are different methods to display an alert or assertive live region on the page and depending on how you create the error container or inject the error messages determines if it will work in the more difficult browsers/screen reader combinations like IE 8 + JAWS 14 or VoiceOver + Safari.