Over the years, I’ve built up a toolkit of essential software, gadgets and reference material. This ‘toolkit’ series introduces some particular favorites that you, too, might find useful.
Web Developer add-on for Firefox
Since its early days, I have preferred Firefox over Internet Explorer as my default web browser. Firefox was faster to launch, it downloaded pages more quickly and reliably, it used tabs instead of multiple windows to load more than one web page at a time, and it rarely crashed.
Firefox has one more advantage over IE: an ever-growing selection of ‘bonus extras’ that provide additional functionality. I’ve been slow to adopt these plugins and extensions, preferring to keep my Firefox setup as simple as possible. However, there are a few that have rapidly become indispensable.
The Web Developer add-on is one such extension. This toolbar helps you to analyse a web page from several perspectives: designer, coder, programmer, content editor, end-user.
When you want to know how a web page is constructed, try using this toolbar to turn stylesheets on and off, switch between tables and no-tables layouts, disable or enable javascript, highlight particular markup tags and content types.
The toolbar checks for cookies and lets you fiddle around with forms. At the click of a menu item, the Web Developer toolbar will produce a report on the web page’s coding quality (“amivalidornot?”). It will even download the source code, ready for editing.
The toolbar can assess a web page against an accessibility checklist, using CynthiaSays or another automated checking tool. I prefer the Wave, and it’s easy enough to change the Web Developer add-on’s options to use this instead. Of course, an automated process won’t always pick up accessibility problems: Patrick H Lauke’s article at WebAIM.org explains how to use the Web Developer toolbar to supplement the automated results.
Once installed in your browser, the Web Developer add-on should update automatically whenever there’s a new version available.
