SXSW 2009: Accessible AJAX

Sunday, March 15th, 2009 11:30 AM
Sharron Rush, Knowbility
Becky Gibson, IBM

Assessible Rich Internet Applications (ARIA) is a spec that is going through the w3c. Form controls, links and such all have roles. However, when you start making complicated controls such as tree controls you can use ARIA to add those symantics into your HTML. Additional attributes are being proposed for these elements which will allow accessable software (such as a screen reader) to use these fields. Jaws reads off rather these tree elements are open/closed, rather there are children, and how many elements there are in a list. Keyboard control is also necessary to navigate this tree. The attribute tag “role” on a block element tag will allow Jaws 10.0 to navigate sections of your website very easily. It almost gives them a chapter view of every section on the website they’re viewing.

Robert Wood Johnson Medical School has a navigation that you must tab through all of the links, and it becomes difficult. A simple rewrite using the ARIA attributes made the Education, Research, Patient Care, etc. tabs become menu controls that can be opened, closed, and tabbed into with keyboard inputs.

For Ajax you can set a region as “live” and thus if the region’s data changes when Ajax loads it will then re-read that section.

Recovery.gov’s Timeline is also an impossible tool to use with a screen reader. Using the Yahoo’s User Interface (YUI) Library Gibson broke these pages up into panes, added left and right arrows, and added Jaws controls. It no longer uses the mouse controls, but it is a very accessable solution.


Leave a Reply