Here is a list of Firefox addons for every web developer most of which I’m using almost daily. I can highly recommend any of these addons and I’ve been using most of them for a very long time.
Firebug
Nowadays I think I could just ask where you’ve been living for the past two years if you don’t know this must-have extension. Firebug allows you to debug your JavaScript code on your live website, to view and edit the HTML code and CSS files on-the-fly directly for the current page and much much more.
Firebug also features am essential JavaScript console you can use in your own scripts for debugging and logging. Just check it out - it’s so essential that I won’t get into any more details here.
JSView
This cool addon adds a “JS/CSS” button to your browser’s status bar allowing you to see and view every single CSS and JS file that’s loaded on the current page. Sure - Firebug has the same feature, but using JSView actually makes this even easier than Firebug.
QuickJava
Quite often you have to check your own website to see if most of it still works if the user has JavaScript disabled. This addon adds to small buttons to your status bar which allow you to enable and disable both Java and JavaScript in your browser with one click. You still need to reload the page but this saves you from the tedious task of opening your browser settings each and every time you need to turn it off (or on).
HTML Validator
You should always make sure that your website contains only valid (X)HTML code and there is no easier way than installing this addon. This one also adds an icon to the status bar of your Firefox browser which is either a yellow warning sign, a green “ok” image or a red icon with a white cross indicating the validity of the code on the current website.
By double-clicking on that icon you are taken immediately to the source code view of the page including all of the warnings and errors that this addon has found in your code. Best of all - it checks everything offline, so it’s not sent to the W3C Validator and it’s very fast.
Live HTTP Headers
Sometimes you need to check the HTTP headers sent by your browser to the server or vice versa. This addon allows you to do just that and you can even apply regular expressions to the output so that you will only see what you are looking for.
Web Developer (Toolbar)
This is also a must-have addon just like Firefox which adds several features missing from your Firefox if you’re developing websites. Most often I’m using the “Find broken images” feature although this is just a very small part of this mighty tool.
ColorZilla
Sometimes you need (or want) to know the specific hexadecimal color code of a specific color on the website you’re currently on. ColorZilla adds a color picker to your browser and allows you to copy the color values directly to the clipboard so that you could insert it in your CSS file (that is what I am using it for most of the time). And it still offers even more features that that.
MeasureIt
Draw a ruler to measure the width and height of any object on the current page.
SearchStatus
Would you like to know the current PageRank of the current website or the Alexa rank? This addon also offers additional features such as highlighting “nofollow” links and easy access to WHOIS and robots.txt information for the current domain.
SEOBOOK SEO Toolbar
This is your ultimate SEO addon as it integrates as a toolbar into your Firefox browser and shows you almost anything of interest regarding SEO on any website. You can directly see the PageRank, Yahoo! backlinks, Yahoo! indexed pages, whether the current site is listed in the Open Directory Project (DMOZ), in the Yahoo! directory and so much more. You can even see the approximate age of the domain according to the first version indexed by the Internet Archive.
If you know any other cool addons for a web developer I would very much appreciate your comments and feedback.
