Due to the open source Mozilla platform at its core, the Firefox browser boasts many third-part additions. Many of those extensions are intended for the masses; some were created for use by technically minded people, who either create webpages professionally or happen to be just learning HTML, CSS, and JavaScript. Here are some of the best addons for web designers. Links are to the relevant addons.mozilla.org page, with additional links to existing project websites.

Web Developer

The add-on that is probably most useful to web designers, by virtue of its many options and general behavior, is called Web Developer (author Chris Pederick's site). The extension adds a menu and a toolbar to the browser, containing various web developer tools. It is designed for the four Mozilla browsers -- Firefox, Flock, Mozilla and Seamonkey, and will run on any platform that these browsers support including Windows, Mac OS and Linux.

Some of the hightlights of the Web Developer extension: one-click access to the entire CSS code of the page, even it is dispersed across multiple files; a very useful Display Element Information mode; resizing the browser window to predetermined height and widthe; cookie tools; and much, much more.

View Source Chart

View Source Chart adds an additional option to the browser's right mouse button menu. With it, you can see the page's source -- ordered nicely and color coded. While not groundbreaking in its functionality, this addon makes code more readable. It will also make you look cool when you show source code to your web designer friends.

Greasemonkey

Greasemonkey ( project site )allows you to customize the way a webpage displays and functions, using small bits of JavaScript. Hundreds of scripts, for a wide variety of popular sites, are already available on the web. You can write your own scripts, too -- a number of tutorials are available.

Firebug

Firebug is an irreplaceble tool for JavaScript coders. It provides easy access to information about DOM elements, a JavaScript console, and is widely considered to be one of the best tools available today. Firebug helps with debugging, editing, and modifying of any website's CSS, HTML, DOM, and JavaScript.

YSlow

YSlow for Firebug is a free tool provided by the programmers at the Yahoo! Developer Network. It requires Firebug in order to run. Once installed, YSlow places a small button at the lower left of your browser window, and a single click on that button opens a frame containing performance stats for the website. This addon breaks down performance issues into comprehensive categories and assigns a grade (from F to A) to the site. As an additional bonus, YSlow provides sound advice on how to improve the load speeds.

Bookmark this article with:

 •    •    •