Upload
rhiana-heath
View
242
Download
1
Tags:
Embed Size (px)
DESCRIPTION
This goes through an overview of the theory and some tools and techniques for addressing accessibility in a website or application. Including which disabilities accessibility addresses, and techniques to improve the user experience for people with and without impairments such as screen reader and keyboard access. Presented at Ruby on Rails group April 2014.
Citation preview
Accessibility
More than just alt tags
Rhiana Heath
Why accessibility?
For who?
General site design
Good Example
Colours
Low Contrast
Colour Blindness
Keyboard Navigation
Screen readers
Visual Scanning
lWAI ARIA
Landmark Aria Roles
Alternative to alt
<span class = ”sr-only” aria-hidden = “false”>Hidden message </span>
An option for Screen Reader only CSS
/* taken from current bootstrap screen reader only class */
.sr-only { clip: rect(0,0,0,0); position: absolute; width: 1px; height: 1px; overflow: hidden; border: 0; padding: 0; margin: -1px;}
Toolbox
http://dev.opera.com/articles/introduction-to-wai-aria/
http://www.w3.org/TR/aria-in-html/#recommendations-table
https://addons.mozilla.org/en-US/firefox/addon/fangs-screen-reader-emulator/
http://www.chromevox.com/
https://github.com/Mottie/tablesorter
http://gmazzocato.altervista.org/colorwheel/wheel.php
http://accessibility.oit.ncsu.edu/training/aria/modal-window/version-2/
http://achecker.ca/checker/index.php
Questions?
@rhianaheath
https://github.com/Rhiana
http://www.slideshare.net/RhianaHeath/
https://rhianaonaccessibility.wordpress.com