The Web can be nearly anything. Emerging techniques show that chaos finally erupted out of the confinement of standards. From the primordial web soup, new forms are emerging that perhaps the eye can understand, but are devoid of reasonable semantic structure to help the other senses . Can chaos be made accessible? Are the new interactions only for the benefit of mainstream users? Or is this another case of a crisis becoming an opportunity? The powerful new WAI-ARIA draft standard can annotate markup with structure. The structure helps assistive technologies such as screen readers, screen magnifiers or alternative input software make sense of the previous chaos. WAI-ARIA has great potential for accessibility, such that users with disabilities can not only survive in the chaos, but thrive as well. What about adoption? Will authors even use WAI-ARIA? The answer is a good one for the future of accessibility. Adding WAI-ARIA to markup does not change how a web page behaves for mainstream users, even in user agents with no WAI-ARIA support. Thus, we are seeing very steady growth of support. Collaboration among vendors is at a new high, as Microsoft, Mozilla, Opera, Apple and Google work together to harmonize browser implementations. JavaScript widget toolkits such as Dojo, YUI, GWT and jQuery are gaining support. Screen readers and screen magnifiers are also gaining support. Killer examples of WAI-ARIA in web applications are Gmail, Google Docs and Yahoo! mail. Is the future complex? Yes. But we can also enjoy new possibilies. Finally, compelling interaction and enhanced accessibility will not be strangers.

1. Web 2.0
Accessibility:
Order in Chaos
Aaron Leventhal

2. Living in Germany
Based around rules & structure
- “Correct” beer brewing, etc.
- Project structure planned first

3. But born in the United States
America likes to break rules & change the game
Structure comes as it becomes necessary
Sometimes bad, sometimes good

4. What is Accessibility?
Is it engineering compassion?

5. Visual impairments
♦ People who are
blind or deaf-blind
use screen reading software
Stevie Wonder
with speech or soft Braille (blindness)
♦ Partially sighted people may
use font/contrast settings or
screen magnification software. Aldous Huxley
(low vision)

6. Print disabilities
♦ People with dyslexia use text to
speech software combined
with word highlighting
Helen Keller, writer
(deaf and blind)
Alexander Graham Bell
inventor of the telephone
(dyslexia)

7. Physical disabilities
♦ Quadriplegics use the keyboard with a on
screen keyboards and speech input
software, with special pointing devices
(head/eye tracking mice or mouth sticks)
♦ One handed typists
use sticky key software
♦ People with ALS or cerebral
palsy may use filter keys, word
prediction software and single switch Stephen Hawking
devices (ALS)

8. Other disabilities
♦ Hearing impaired people need
software that does not rely on sound
for cues
♦ Color blind people need software
that does not rely on color alone,
This includes 8-10% of males who Beethoven
see both red and green as brown! (hearing impaired)
♦ Persons with cognitive and learning disabilities need
software with simple layout and messages – also useful
for young, elderly and newbie users
♦ Persons with epilepsy need software
with no flashing or blinking:
(2-55 Hz can cause seizures)
Nobel (epilepsy)

9. Just Tell Us What To Do!
♦ Images and colors:
don’t rely on them
♦ Keyboard navigation
must be available
♦ Structure
with semantic HTML
♦ … Be a good rule follower!
http://www.ibm.com/able/guidelines
(based on WCAG 1)

10. Can we use JavaScript?
WCAG 1.0, 508, EU say no -- must work with script off

11. Split Personality: Web Developers
 Good citizen
 Semantics
 Static HTML
 Accessible
 Traditional

12. The Dark (but Exciting) Side
 Rule breaker
 Dynamic
 JavaScript
 Not accessible
 utting edge!
C

14. Use WAI-ARIA!

15. Embracing Change
♦ WAI-ARIA: W3C working draft
♦ Describes the structure of Dynamic Content
♦ New attributes are used, like role=“slider”
♦ Allows both innovation and accessibility
♦ Doesn’t break existing content

16. What is WAI-ARIA?
Describes dynamic content:
1. Visual
2. Informational
3. Interactive

17. Visual “Eye Candy”
1. Animation/transitions
2. Keep quiet: aria-live=“off”
3. Please allow them to be turned off!

18. Informational Content
00:12
1. Built-in role types:
role=“alert”|”log”|”timer”|”progressbar”
2. Generic live content, e.g. stock quotes
Set the interruption/politeness:
aria-live=“off”|“polite”|”assertive”|”rude”

19. Interactive Widgets
1. Usually have onclicks
2. Keyboard navigation!
Important to use Style Guide
3. ARIA roles and properties:
<div role=“slider” aria-valuenow=“50” …
4. Also, more complex widgets,
“tree”, “grid”, etc.
5. ARIA drag and drop

20. Sampling of ARIA Semantics
grid
alert tree application
slider
menu & more …
description
tabpanel progressbar
valuenow invalid
labelledby multiselectable
required selected & more …
haspopup checked
describedby expanded

21. ARIA even improves HTML
1. Enhancing forms
* aria-invalid, aria-required
* role=“alert”
* aria-describedby
2. Tables for layout
* <table role=“presentation”>
3. Landmarks
* role=“main”, “navigation”, etc.

22. Validation?
WAI-ARIA breaks HTML 4.01 validation
But, accessibility is more important
… Use Validator.nu experimental service

23. Where is ARIA supported?
Browser support
Assistive Tech (screen readers, magnifiers, ...)

24. Build your own components?
Building ARIA components is a challenge
Docs - codetalks.org
Specs - w3.org

25. Or borrow them?
Use a JavaScript library to save effort
Most accessible

26. Resources
Docs & samples
http://codetalks.org
Mailing list
Google groups “free-aria”