Must-have Firefox Plugins for Web Development

Firefox Plugins for Web Development

When developing new code (or updating existing code), I use a very small number of extensions for Firefox.

• Joe Hewitt's Firebug plugin
  - You can debug and inline Javascript, inspect and edit the DOM elements on the page and update CSS rules on-the-fly. This is probably the number one tool for me.
  
  Visit his site and from there install Firebug


• Chris Pederick's Web Developer toolbar
  - Adds the ability to disable Javascript, CSS and view all kinds of DOM structure information. Built-in validation tools allow for markup validation against the W3C validators.
  
  Download the plugin for Firefox


• Alex Sirota's ColorZilla plugin (http://www.iosart.com/firefox/colorzilla/)
  - Allows you to inspect the colour of elements on the page. This is useful for choosing colours for CSS rules (and when an image editor is not readily available to do the job).
  
  Download the ColorZilla 1.9 for Firefox

Of course there are others that I use as well (Selenium IDE, YSlow and TamperData are definitely worth a mention), but these represent the core.

Whilst this addresses Firefox, there are plenty of tools available for other browsers - look for a post covering some of those for Internet Explorer and Safari.