Learn about a wide variety of techniques and tools (including Deque's FireEyes) for testing the accessibility of web content, using a checklist-based approach as a starting point, and going beyond checklists to consider the broader context of how people with disabilities actually use the web. The session will cover some advanced techniques for testing interactive and dynamic content.
Accessibility Evangelist at Deque Systems, Inc.
Press the Left/Right Arrow Keys or Page Up/Down to navigate through slides, the Home key takes you home to the table of contents. Adjust text size in the Info dialog. Share this presentation on Twitter & Facebook.
This slideshow has been developed with jQuery Mobile to create a universally accessible presentation that will work on any accessibility enabled device. PowerPoint & PDF formats are not universally accessible.
Large scale automated accessibility scanning & violation tracking.
FireEyes is totally free, you just need to sign up.
Remember if you're a small web dev shop or a freelancer, FireEyes is totally free! Make developers run a FireEyes scan and try to fix accessibility problems on their own before escalating a simple problem to the accessibility team who needs to focus on the more complex challenges of accessibility.
Depending on the browser (UA) and screen reader (AT) combination used in testing you will get different results.
Some UAs & ATs work better together than others, and some simply fail to work together much at all.
WARNING WARNING... IE + NVDA is a fail waiting to happen! Not a reliable combo for testing. NVDA is open source and they've mentioned all the hacks and workarounds they'd need to do for full IE accessibility.
Think about it, IE and JAWS are closed source, NVDA & Firefox are open source. Keep that in mind!
Of course not all blind people are totally blind, many have low vision and use on screen magnifiers in conjunction with screen readers. Popular combinations are JAWS + ZoomText.
Screen magnifiers will help you find problems in your page layout and UI placement, buttons spread out way far apart, form labels far apart from their inputs.
Code validators only get you so far in identifying accessibility issues because they don't look at the manipulated DOM but they will do a great job of telling you if you've used ARIA and HTML elements properly according to spec.
Inspect Element is built into all modern browsers.
ONLY code inspection will show you the true DOM, you can't veiw the source code that's irrelevant! DOM, da DOM DOM DOM DOM... it's the only thing that matters in the modern web!
Safari Mobile Web Inspector is awesome!
OS X Accessibility Inspector
Windows API inspectors included with Microsoft SDK's
iOS Accessibility Inspector built into the iOS Simulator
Automated testing tools cannot really test interactive and dynamic widgets or other content that is injected into the DOM or modified after page load. You're going to have to try every use case path with the keyboard only and with a screen reader.
Make sure to use the mouse to hover your mouse over all elements on the page to check if a tooltip or popover appears on hover. If you only TAB through the site you may not catch those issues because they usually don't appear on focus.
TAB through every UI element on the site and make sure you can activate it with the keyboard.
A screen reader may activate an element with an ENTER key giving you a FALSE sense of keyboard accessibility, BUT, if you try pressing ENTER using just the keyboard and NO screen reader you may find it does not actually work. Keyboard-only accessibility is NOT the same as screen reader accessibility.
Modal dialogs can not be tested with automated tools!
Example 34 - Tab Panel - OpenAjax Alliance Accessibility Examples (PROBLEM WITH role=application in NVDA/Firefox) - problem is when you TAB away from the tab and focus on the first heading, NVDA will not read the heading, however, if you remove role=application this problem goes away. Good example of how role=application is DANGEROUS!
This presentation and slideshow template is always evolving, most ALT text should be added and correct. Please contact me if there are any issues.
Press the Left/Right Arrow Keys or Page Up/Down to navigate through slides, the Home key takes you home to the table of contents. If you're using a screen reader you may need to use the pass through key first then hit arrow keys. Page up/down works with screen readers enabled without the need for a pass through key.
JAWS Pass Key Through, INSERT+3
NVDA NVDA+f2: pass Next Key Through