FREE Web Development Tools: The Accessibility Toolbar Version 1.0

 Yesterday in her article on Accessibility Validation, Rachel Andrew showed us how to use the Cynthia Says validator to report on your site's Section 508 compliance, and how to understand the output!

Today we're throwing the spotlight on the latest release of the Web Accessibility Toolbar developed by the Accessible Information Solutions (AIS) team at the National Information and Library Service (NILS), Australia.

This Toolbar will not only help you to make your sites more accessible, it also has a great set of tools that can help you analyze the code in other sites, to enable you to develop your own skills.

Please note, this article may be freely reproduced as required to support the use of the Toolbar. All we ask is you acknowledge www.DMXzone.com and if you'd like to get back to us with any suggestions for improvments we'll try to incorporate them.

 

Images

Nice for ensuring that all the images on a page have alt attributes correctly assigned – good for checking how the chosen page is going to come across without graphics.

Colour

Here it's worth noting that as yet the grayscale option doesn't work on PNG files. Selecting Colours used will bring up an analysis and display of the various colours used in a new page, while the Contrast Analyzer takes you off to the Juicy Studio Colour Contrast Analyser.

Structure

Another fantastic aid – without running through all the options, this set of options will mark up all the various elements in your chosen web page. Immediately useful items for editors is to see the Heading Structure in a page.


Then for really understanding the layout of a page check out the table options and Show Divs:

To be quite honest as a newbie to using CSS I often wondered about how all the components of a site relate and I can see I'd make a great deal of use of this feature.

This feature also, according to the documentation, will display warnings and information bubbles next to onouseover, onclick and onfocus events as necessary – a feature I hadn't experimented with at the time of writing.


Tools

In one of Rachel Andrew's latest articles (Accessibility Validation) she talked about how to understand the output from the Cynthia Says validator and also about the importance of testing sites for accessibility in say text viewers such as Lynx.

This option facilitates easy access to both a variety of validators (and different options within those tools) in the top menu, while the Simulations sub-menu (shown below) gives a variety of tools for analyzing sites for specific issues – as we can see a direct link to the Lynx viewer is provided.

Within this list examples are provided of what a site might look to a person suffering from a particular sight disorder. Having never considered some of these issues before I found experimenting with some of these simulations humbling.

Text from a page with cataract simulation applied.

Ian Blackham

Ian BlackhamFollowing a degree in Chemistry and a doctorate in Scanning Tunneling Microscopy, Ian spent several years wrestling with acronyms in industrial R&D (SEM with a side order of EDS, AFM and TEM augmented with a topping of XPS and SIMS and yet more SEM and TEM).

Feeling that he needed a career with more terminology but less high voltages, Ian became a technical/commissioning editor with Wrox Press working on books as diverse as Beg VB Application Development and Professional Java Security. After Wrox's dissolution and a few short term assignments Ian helped out with DMXzone's premium content section.

Ian is a refugee from the industrial Black Country having slipped across the border to live in Birmingham. In his spare time he helps out with the website of a local history society, tries to makes sure he does what his wife Kate says, and worries that the little 'un Noah is already more grown up than he is.

See All Postings From Ian Blackham >>