The power of ARIA
-
Upload
srinivasu-chakravarthula -
Category
Technology
-
view
969 -
download
3
description
Transcript of The power of ARIA
![Page 1: The power of ARIA](https://reader036.fdocuments.in/reader036/viewer/2022082915/545d0182b0af9fa42c8b4add/html5/thumbnails/1.jpg)
f
The Power of ARIA
7th February, 2012
Srinivasu Chakravarthula
![Page 2: The power of ARIA](https://reader036.fdocuments.in/reader036/viewer/2022082915/545d0182b0af9fa42c8b4add/html5/thumbnails/2.jpg)
2Yahoo! Confidential
What is ARIA?
ARIA – Accessible Rich Internet Applications
Candid recommendation of W3C
Solution to make dynamic web accessible to all
![Page 3: The power of ARIA](https://reader036.fdocuments.in/reader036/viewer/2022082915/545d0182b0af9fa42c8b4add/html5/thumbnails/3.jpg)
3Yahoo! Confidential
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
![Page 4: The power of ARIA](https://reader036.fdocuments.in/reader036/viewer/2022082915/545d0182b0af9fa42c8b4add/html5/thumbnails/4.jpg)
4Yahoo! Confidential
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
![Page 5: The power of ARIA](https://reader036.fdocuments.in/reader036/viewer/2022082915/545d0182b0af9fa42c8b4add/html5/thumbnails/5.jpg)
5Yahoo! Confidential
ARIA attributes
Roles
Navigation
Search
Main
Content info
<form action="http://search.yahoo.com/search;_ylt=Ap3vRQULlUwlFx6TE6YuMsKbvZx4" class="search-form" id="p_13838465-searchform" method="get" name="sf1" role="search”>
<div role="main" class="fp-fx" id="y-col1">
![Page 6: The power of ARIA](https://reader036.fdocuments.in/reader036/viewer/2022082915/545d0182b0af9fa42c8b4add/html5/thumbnails/6.jpg)
6Yahoo! Confidential
ARIA attributes (contd.,)
Tab Panel
Status
› Accessibility announcement
› Off-screen info
Buttons
![Page 7: The power of ARIA](https://reader036.fdocuments.in/reader036/viewer/2022082915/545d0182b0af9fa42c8b4add/html5/thumbnails/7.jpg)
7Yahoo! Confidential
ARIA attributes (contd.,)
Live regions
Menu and menu items
Alerts
List boxes
![Page 8: The power of ARIA](https://reader036.fdocuments.in/reader036/viewer/2022082915/545d0182b0af9fa42c8b4add/html5/thumbnails/8.jpg)
SrinivasuChakravarthula
Senior Manager, Inclusive Design
[email protected]: @VasuTweets @YahooAccessY! Accessibility on FB:
facebook.com/yahooaccessibility
Thank You!
8Yahoo! Confidential