Simple accessibility testing tools
In the next section, strategies will be outlined for creating accessible content. But first, let's install a simple tool that can double check your work as it is created.
Install Tota11y, an accessibility visualization tool
The Tota11y javascript bookmarklet was created by the Kahn Academy to visualize how web content is perceived by screen readers and other assistive technology.
Install option 1: bookmarklet
Is your bookmarks bar visible in your browser? If so, try this option. To install, click and hold the Tota11y link in the box below, then drag the link from the box into your bookmarks bar. To activate the tool, simply click the bookmark.
tota11y
Install option 2: Chrome or Firefox extension
This same tool has also been adapted to be a Chrome and Firefox extension. Install the extension and you'll see the eyeglasses icon in your toolbar, which you can click to activate.
Opena11y Firefox extension: Using the Tota11y script.
Using Tota11y
Go to the page you wish to evaluate
Click the Tota11y bookmark you just installed (or the Chrome extension icon).
A black x-ray glasses icon will appear at the bottom left corner of your page (screenshot above).
Clicking the glasses, you'll see a pop-up menu with choices such as Headers, Contrast, and Image alt-text.
Clicking one of these options will provide information and screen annotations and track any errors.
Dismissing the tools
Clicking the option a second time dismisses the report.
Similarly clicking the glasses again minimizes the tool.
This video shows this same process in motion.
We will review many of Tota11y's tools in the following pages as we talk about how to create better content.
Additional easy to use testing tools
As you become familiar with accessibility, these additional evaluation tools will become invaluable.
WAVE Accessibility Evaluation Tools
ANDI - Accessibility Testing Tool
bookmarklet with multiple testing tools
Contrast checkers
Color blindness visualization tools
Last updated