Resources

Testing Tools for Developing Accessible Web Sites

For those developers out there who would like to try and build an accessible site, or would like to just have some neat and useful testing tools, we have collected a few which are provided here as a service. They are provided here as is, and using these items is done so at your own risk. Items included here are freely available. Copyright or other rights are retained by the original creators unless otherwise indicated.

JavaScripts and Bookmarklets

These are little Bookmarklets help evaluate the accessibility of a web page. They require Internet Explorer 5 or above with your browser JavaScript enabled. To add them to your browser, either drag the link to your link button toolbar, or right click and choose "Add to favourites"

Grayscale the Page: Removes colors from the page so you can see what the page will look like to a color-blind person. Machines with slow processors may experience some oddness while scrolling after using this tool. Drag this link to your link button toolbar: Grayscale
Links and Titles: Shows all links on the page and the contents of the link (text and/or images). Also shows title attributes of each link if present. Drag this link to your link button toolbar: Links and Titles
IMGs without ALTs: Displays the addresses of the images on the page that have empty ALT (alternative) text. Lack of equivalent descriptive text for an image is the most common impediment to accessibility. Drag this link to your link button toolbar: IMGs without ALTs
Form Fields and Values: Displays all form attributes for every form on a page. Forms present numerous challenges to accessibility. Drag this link to your link button toolbar: Form fields and values
Meta Data: Shows all meta tag data on your page. Useful for review or when dynamically created pages are involved. Drag this link to your link button toolbar: Meta data
Show Style sheets: Shows all CSS attributes used on page. Useful for review or when dynamically created pages are involved. Drag this link to your link button toolbar: Show Style sheets

Shell Scripts and other Tools

Web Developer's Toolbar: http://chrispederick.myacen.com/work/firebird/webdeveloper/

Another great tool to add to the arsenal. Developed by Chris Pederick, this extension to Mozilla Firebird provides a comprehensive toolbar for running quick tests on pretty much everything.

Checky: http://checky.mozdev.org

A wonderful tool to add right-click functionality to Mozilla for Windows and Linux; sorry, no Mac version yet...

PlaceNameHere Toolbar: http://placenamehere.com/pnhtoolbar/

Another Mozilla/Netscape extension created by Chris Casciano that provides a lot of functionality including hotlinks to documentation and validation services.

Accessibility Toolbar: www.nils.org.au/ais/web/resources/toolbar

A wonderful Toolbar add-in for Internet Explorer by Steven Faulkner from the National Information and Library Services, Australia. The toolbar was first reviewed by Gez Lemon at JuicyStudio. Looks like it combines and extends/builds on many of the "right-click" and other widgets listed here...

Web Design Group's WiDGets: www.htmlhelp.com/tools/widgets/

We like their on-line validator over the W3C simply for it's output. Even better though is a series of small shell script tools they refer to as WiDGets. These little apps add right click functionality to IE 4 and up browsers, whereby you can strip a document of a) it's images, b) it's style sheet, c) automatically send the page contents to the WDG on-line validator. As an added bonus, the HomeSite editor uses the IE rendering agent in it's preview mode, which allows you to extend this right click functionality into the authoring environment.

Installation Instructions:
To install a WiDGet, unzip the downloaded file into a temporary directory. From Windows Explorer, right-click on the unzipped file with the extension inf and select Install. Restart Internet Explorer if it is already running.

More RightClicks:

Expanding on the work done by the WDG, here are some more right-click functions for the IE browser. Each should be fairly self explanatory, and all are useful in web development.

Installation Instructions:
To install a RightClick, unzip the downloaded file into a temporary directory. From Windows Explorer, right-click on the unzipped file with the extension inf and select Install. Restart Internet Explorer if it is already running.

Microsoft Web Accessories for Internet Explorer 5:
www.microsoft.com/windows/ie/previous/webaccess/ie5wa.asp

More right-click functionality for IE. While they claim it does not work in IE 6, some of the features in fact do. We like and use the following: "Open Frame in New Window", "Links List", "Image List". Again, integrates into HomeSite's preview pane as well. Download the executable to a local directory, run and restart IE.

ie5wa.exe

Microsoft Web Developer Accessories:
www.microsoft.com/Windows/ie/previous/webaccess/webdevaccess.asp

The DOM tree tool lets you view all the Document Object Model properties in tree form via right click or the tools menu. There is also the ability to "spot check" source code by highlighting the code in the browser, right click and view partial source code. Once again, download the executable to a local directory, run and restart IE.

webdevaccess.exe

A-Prompt:
aprompt.snow.utoronto.ca

A-Prompt (Accessibility Prompt) is a software tool designed to improve the usability of HTML documents by evaluating Web pages for accessibility barriers and then providing developers with a fast and easy way to make the necessary repairs. Download the zip file, expand to a local directory, run to install.

A-Prompt_1_0_6_0.zip

Last Updated: December, 2003

Is your web site Accessible? Does it meet current Accessibility requirements? We can integrate seamlessly with your team to provide mentoring, hands on development expertise or accessibility assessments to help ensure that your sites are accessible and in compliance with accessiblity requirements.