Implementing ARIA
for Real World
Accessibility
CSUN
2009
Jared Smith Thomas Logan

http://csuntweetup.com/
Use #csun09 hashtag in tweets

ARIA
• Accessible Rich Internet Applications
• Specification developed by the PFWG of
the W3C’s WAI. Huh?
• Currently published as a Last Call
Working Draft

ARIA enhances accessibility of...
• ... dynamic content and AJAX
• ... scripted widgets and interactive controls
• ... keyboard interactions within a web page
Bridges the gap to future versions of HTML/XHTML

AJAX
“Asynchronous Javascript + XML”
Jesse James Garrett
February 2005

AJAX
“Asynchronous Javascript + XML”
Jesse James Garrett
February 2005
It’s really just XMLHttpRequest

AJAX
“Asynchronous Javascript + XML”
Jesse James Garrett
February 2005
It’s really just XMLHttpRequest
...and stuff

AJAX
• HTML
• JavaScript
• CSS
• XML
• DOM
• XMLHTTPRequest

Why the AJAX explosion?

Because “AJAX” is
not nearly as geeky
as
“XMLHttpRequest... and stuff”

Screen Readers and
Dynamic Content
• What interactive objects are
available?
• What properties do they have?
• How do they relate?
• Is what changed important?

ARIA
Core components
• Roles role=”search”>
<form
• States aria-pressed=”true”>
<button
• Propertiesaria-required=”true”>
<input

Landmark Roles
• Banner, search, main, navigation,
complementary, etc.
• Allows instant access to major page
components
• The end of “skip” links?
• What about sighted keyboard users?

Live Regions
How do you point users to
content or AJAX updates?
Should you?

Live Regions
• aria-live=”off”
• aria-live=”polite”
• aria-live=”assertive”

ARIA
other enhancements
• Drag and drop points
• Advanced interactive widgets and
controls
• Relationships and labelling
• Sort properties
• Fills keyboard gaps - makes thing tabable
and/or focusable

Resources
• http://codetalks.org/
• http://queuemusic.org/

Questions?
Jared Smith Thomas Logan