Download presentation
Presentation is loading. Please wait.
Published byHortense Maxwell Modified over 9 years ago
1
Aria Roles Informing assistive technology
2
What are Aria Roles A way of conveying the role or state of content or functionality. Accessible Rich Internet Applications is a W3C protocol for enhancing and supporting accessibility of scripted and dynamic content.
3
Landmark Roles ● Provide semantic meaning ● Define regions ● Describe the purpose of this piece of HTML
4
Roles for Forms Aria-required boolean for required field role=”button” Any submit button role=”alert” Error or feedback message
6
Banner
7
Navigation
8
Main
9
Search
10
Article
11
Complementary
12
Contentinfo
13
Live Regions Determine the ‘live areas’ of document Regions of the page that can be subject to change They are controlled by client-side scripting
14
Live Regions aria-live ● off ● polite* ● assertive ● rude
15
Live Region Roles
16
Advanced attributes Generally on used when making Rich Internet Applications (or using non standard/semantic markup) 1.aria-atomic: The aria-atomic=BOOLEAN is used to set whether or not the screen reader should always present the live region as a whole, even if only part of the region changes - the possible settings are false/true where false is the default. 2.aria-relevant: The aria-relevant=[LIST_OF_CHANGES] is used to set what types of changes are relevant to a live region - the possible settings are additions/removals/text/all where "additions text" is the default. 3.aria-labelledby: The aria-labelledby=[IDLIST] is used to associate a region with its labels, similar to aria-controls but instead associating labels to the region and again label identifiers are separated with a space. 4.aria-describedby: The aria-describedby=[IDLIST] is used to associate a region with its descriptions, similar to aria- controls but instead associating descriptions to the region and description identifiers are separated with a space. My radio label Item #1 Item #2
17
Live Regions’ support
18
The only two screen readers that do NOT support Aria Roles are NVDA and Window Eyes in Internet Explorer.
19
References http://tink.co.uk/2009/06/screen-reader-support-for-ajax-live-regions/ http://juicystudio.com/article/wai-aria_live-regions_updated.php https://developer.mozilla.org/en- US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions http://www.maxability.co.in/tag/aria-liverude/
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.