1. The Power of ARIA
7th February, 2012
f
Srinivasu
Chakravarthula

2. What is ARIA?
 ARIA – Accessible Rich Internet Applications
 Candid recommendation of W3C
 Solution to make dynamic web accessible to all
Yahoo! Confidential 2

3. Why ARIA?
 Websites are increasingly using advanced and complex user interface
controls
 Solution to make dynamic web accessible
 Assistive Technologies need to be able to interact with complex
controls
 Technically, WAI ARIA provides a framework for adding attributes to
identify features for user interaction
Yahoo! Confidential 3

4. What ARIA provides?
 Role to describe the type of widget
 Role to describe the structure of a web page
 State of the widget
 Live regions for frequently updated content
 Drag and drop functionality
 Provides keyboard navigation for objects and events
Yahoo! Confidential 4

5. ARIA attributes
Roles
Navigation
Search
Main
Content info
<form
action="http://search.yahoo.com/se
arch;_ylt=Ap3vRQULlUwlFx6TE6Yu
MsKbvZx4" class="search-form"
id="p_13838465-searchform"
method="get" name="sf1"
role="search”>
<div role="main" class="fp-fx" id="y-
col1">
Yahoo! Confidential 5

6. ARIA attributes (contd.,)
 Tab Panel
 Status
› Accessibility announcement
› Off-screen info
 Buttons
Yahoo! Confidential 6

7. ARIA attributes (contd.,)
 Live regions
 Menu and menu items
 Alerts
 List boxes
Yahoo! Confidential 7

8. Thank You!
Srinivasu
Chakravarthula
Senior Manager, Inclusive Design
srinivu@yahoo-inc.com
Twitter: @VasuTweets @YahooAccess
Y! Accessibility on FB:
facebook.com/yahooaccessibility
Yahoo! Confidential 8