Toegankelijkheid met WAI-ARIA
Foto: http://www.flickr.com/photos/86598108@N00/345522486/

Wie ben ik?
Foto: http://www.flickr.com/photos/thewolf/2537868837/

Foto: http://www.flickr.com/photos/meyerweb/132867740/

Webrichtlijnen.nl

WAI-ARIA?
Web Accessibility Initiative
Accessible Rich Internet Applications

Pas op, codevoorbeelden!
Foto: http://www.flickr.com/photos/thefangmonster/490423135/

Role
<a href=”..”>
<img src=”button.png” alt=”OK”/>
</a>

Role
<a href=”..” role=”button”>
<img src=”button.png” alt=”OK”/>
</a>

Status
<a href=”..” role=”button”
aria-pressed=”true”>

Foto: http://joeclark.org/nypl/20Tiemann-closeup.jpg

Voorbeeld: slider
<div id=\"sliderRail\">
<button class=\"sliderThumb”
id=\"sliderThumb1\"
role=\"slider\"
aria-labelledby=\"sliderLabel\"
aria-valuemin=\"0\"
aria-valuemax=\"100\"
aria-valuenow=\"0\"
aria-valuetext=\"0%\"></button>
</div>

Live regions
<div aria-live=\"off\">
<div aria-live=\"polite\">
<div aria-live=\"assertive\">
<div aria-live=\"rude\">

Landmarks
article, banner, complementary, contentinfo, main,
navigation, search
<div id=”content” role=”main”>

Validatie?

Software met ARIA-ondersteuning
Firefox 1.5
Opera 9.5
Internet Explorer 8
Safari 3
JAWS 9
Firevox
YUI

Toegankelijkheid testen:
doe de muis eens weg
Foto: http://www.flickr.com/photos/suhailpk/473307063

Bedankt! Vragen?
Foto: http://www.flickr.com/photos/24043297@N00/2857292510/