Resources referenced from the Design for Access workshop at UX Bristol.
Open a page in your browser and don't use your mouse!. Use the tab key to progress through links & form controls, shift-tab to reverse, and enter to follow links.
To simulate voice-recognition, you can also use 'find' (usually cntl f or cmd f).
Browsers vary in the details of keyboard commands, but some combination of tab, arrows, space and enter should get you through.
NB: Browsers on OSX will only tab to form controls by default. To tab through links as well open the Safari preferences (advanced tab) and select Press tab to highlight each item on a page
.
Set your browser width to around 1024px wide and use either control + (Windows/Linux) or cmd + (Mac) to double the size of things.
NB: Safari currently has a bug where media-queries may not be triggered when zooming. Chrome, Firefox, IE and Opera work much better. The Safari bug should be fixed in the next version, fingers crossed.
For checking whether colour combinations have sufficient contrast, use the excellent Colour Contrast Analyser.
Windows: Press the windows key and type "Magnifier".
Instructions for Windows XP, 7 and 8.
OSX: Open system preferences > Universal Access Pane / Accessibility > seeing/zoom tab.
Set it to zoom in with scroll and ^ Control
.
iOS6: System preferences > General > Accessibility > Zoom.
Enable, then double-tap with three-fingers to zoom in and out. Three-finger drag moves the screen around.
Time to take the plunge, install and try one!
Windows - NVDA: NVDA cheatsheet
OSX - VoiceOver: VoiceOver cheatsheet
iOS - VoiceOver: VoiceOver cheatsheet
Windows - Jaws: Webaim provide a cheatsheet for Jaws
Caveat: Just remember not to make decisions based only on your tests. Even knowing the key commands, you won't experience things in the same way as a blind or partially sighted person.
Now you know what you're looking for, it's quicker to install the webdev toolbar (Firefox plugin, Chrome extension) and use these options:
Show element names when outliningoption)
I've compiled a list of Structural elements useful for accessibility.
There is no particular technology at work here, some people just find it hard to understand the content.
The checks that we go through in the workshop map directly to WCAG 2.0, see the full Checklist.