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