5 plug-ins for Firefox and Accessibility

15 February 2009
Ben Logan

Ben Logan


Passionate about improving services and experiences for the people that use them.

Mozilla’s Firefox is a lightweight browser used by many developers due to the way it can be customised and extended with the vast range of plug-ins available to download for free. In this article we are going to take a very quick look at each one and give you the links so you can download and install them today.

1. Chris Pederick – Web Developer extension

This extension has been around for some three years or more and is still a very lightweight useful tool for Firefox.

Screenshot of the Web Developer extension from Chris Pederick

Screenshot of the Web Developer extension from Chris Pederick

The tool bar installs in your browser and comes loaded with options and presets you can use in order to run tests for accessibility.
You can use the tool bar to run tests such as showing all the alt attributes on the page and also how the page will appear when linearised.

Download the Web Developer extension from Chris Pederick

2. Firebug by Joe Hewitt, Justin Dolske and robcee

This plug-in saves a lot of time with manual code inspection due to the excellent “Inspect” option you can run.

Screenshot of Firebug extension

Screenshot of Firebug extension

You can change CSS properties in real-time whilst viewing sites to see what impact something like a colour change would have.
Page size on the web is important, and this tool can also show you the total page size in Kilobytes (KB) and also the breakdown of the totals for things such as images, CSS and HTML.

Download the Firebug extension

3. Juicy Studio Accessibility toolbar by Gez Lemon

The rise of “Web 2.0” websites and the increased use of JavaScript frameworks, such as JQuery means that people are increasingly using more advanced and complex user interface controls, such as drag and drop in their sites.

To provide an accessible user experience to people with disabilities, assistive technologies need to be able to interact with these controls. However, the information that the assistive technologies need is not available with most current Web technologies.

WAI-ARIA addresses these accessibility challenges by defining how information about this functionality can be provided to assistive technology. With WAI-ARIA, an advanced Web application can be made accessible and usable to people with disabilities.

Gez is a bit of a whizz when it comes to Accessibility tools and this toolbar is no exception.

Screenshot of Accessibility toolbar by Gez Lemon

Screenshot of Accessibility toolbar by Gez Lemon

The toolbar enables developers to examine WAI-ARIA live regions roles and properties, examine data tables, and determine if the colour contrast is sufficient.
This tool bar will no doubt increase in popularity in the next year

Download Accessibility toolbar by Gez Lemon

4. Firevox screen reader extension by Charles L. Chen

Firevox is an extension which effectively turns the Firefox browser into a screen reader and can identify headings, links, images and more so is fairly useful considering it is free.

Screenshot of Firevox screen reader extension

Screenshot of Firevox screen reader extension

One of the good things about this extension is that it has support for WAI-ARIA and is a good alternative to VoiceOver if you’re on a Mac.

Download Firevox screen reader extension

5. WAVE accessibility toolbar by WebAIM

WAVE is a really useful tool for quickly fixing many accessibility issues and works in a very similar way to the Chris Pederick Web Developer extension.

There has been an online version of this tool around for a while now but this did not work well with password protected pages and secure areas, which you can now test more efficiently with the Firefox extension.

Screenshot of WAVE accessibility toolbar by WebAIM

Screenshot of WAVE accessibility toolbar by WebAIM

What is particularly nice about how WAVE works is the series of icons it uses to display items on the page that are valid and not valid for accessibility.
We also quite like the “Text-only” feature which renders the page as “Text-only”.,

Download WAVE accessibility toolbar extension

Ben Logan - Director

Got a project in mind?

Ben is on hand to answer your questions.