ARIA and accessibility

  • Author: Richard Corby
  • Date: 11 Mar 2013

This four-part series explores different accessibility issues that can be solved by using Accessible Rich Internet Applications (ARIA).

On modern websites, interface controls such as show/hide and controls to select personal preferences are very common. However, these types of features are often inaccessible to users who can't use a mouse or an alternate pointing device — typically screen reader users.

A screen reader understands standard HTML code very well but interface controls (also called rich internet applications) are created using JavaScript or Ajax. These technologies have no standard way to tell another program, like a screen reader, what that behaviour is.

This is where ARIA (Accessible Rich Internet Applications) comes in. ARIA is used to give meaning, or semantics, to interface controls so a screen reader can use them. As we become more familiar with these kinds of interactive controls and start to expect them, these features become crucial for being able to use a website, so it's extremely important that they are made accessible.

Media Access Australia's article Introduction to WAI-ARIA: It's accessibility but not as we know it says that accessibility guidelines like WCAG 2.0 focus on design principles and aim "to be technology-neutral so they could apply to more situations".

On the other hand, ARIA uses specific commands to tell assistive technology, such as screen readers, what's going on.

For example, if an event happens on a webpage such as an updated sports score, the assistive technology program being used to help a person with a disability will notice the change and provides the user with access to the new content."

ARIA solves these main areas of accessibility problems with web applications:

ARIA improves the web for users with a disability, particularly screen reader users, by helping them understand the structure of sites so they can navigate them more effectively, allowing them to access previously hidden content by placing any element in a page's tab order, gives users more control over dynamic content updates and makes widgets as accessible as normal page elements.