The best Firefox addons for a web developer

26 Apr

If you read my last post “I used to love Firefox” you will already know my favorite Firefox addons, however you will also know that by installing a load of addons your browser speed will suffer. I can’t live without my addons so here is my recommended list of Firefox addons a web developer needs without slowing his/her firefox down too much.

1. Colorzilla

Colorzilla ImageWith ColorZilla you can get a color reading from any point in your browser, quickly adjust this color and paste it into another program. You can Zoom the page you are viewing and measure distances between any two points on the page. The built-in palette browser allows choosing colors from pre-defined color sets and saving the most used colors in custom palettes. DOM spying features allow getting various information about DOM elements quickly and easily.

2. del.icio.us Bookmarks 1.5.29

del.icio.us imageThis extension seamlessly integrates your browser with del.icio.us (http://del.icio.us/), the leading social bookmarking service on the Web.

This extension integrates your browser with del.icio.us (http://del.icio.us/), the leading social bookmarking service on the Web. It does this by augmenting the bookmarking functionality in Firefox with an enhanced experience that offers the following advantages:

- Search and browse your bookmarks
- Access your bookmarks from any computer at any time
- Keep your bookmarks organized with tags
- Share your bookmarks with friends or anyone on the Web
- Import your existing Firefox bookmarks

3. Download Statusbar

Download statusbar imageView and manage downloads from a tidy statusbar – without the download window getting in the way of your web browsing. Despite its compact size, Download Statusbar packs in more useful features than the standard download window. The fully customizable interface auto-hides when not in use, allowing full control without interruption.

4. Firebug

Firebug Screenshot 1Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.

5. Flash Switcher

Flash SwticherSwitch between various flash plugins or remove current plugin. It is installed in the statusbar of your browser. when you click on it a popup menu appears showing different options: which flash player version to install (2,3,4,5,6,7,8,9) or if you want to remove the currently installed one.

6. Google Toolbar

Google Toolbar Image
Basically this is another toolbar with good features like spell check, bookmarks, quick links, autofill forms and so on. For me however the most important deature is the page rank.

7. Html Validator

HTML Validator is a Mozilla extension that adds HTML validation inside Firefox and Mozilla. The number of errors of a HTML page is seen on the form of an icon in the status bar when browsing.

HTML Validator Image

I’m not sure whether to add this to the list as you can simple use the “Web Developer Toolbar” to do the same thing through the w3c validator, but i guess this dows save two mouse clicks.

8. IE Tab

IE Tab ImageThis is a great tool for web developers, since you can easily see how your web page displayed in IE with just one click and then switch back to Firefox. Got to say I develope website in firefox and this make switching to an IE browser unbelievably easy.

9. MeasureIt

Measureit ImageDraw out a ruler to get the pixel width and height of any elements on a webpage. Amazingly useful when you are trying to get the pixel distance perfect from on div tag to another, or measure the sapcing you have left. I personally use if for turning the jpg image of the website into a perfect copy full product.

10. Save As Image

Save as ImageI used to use screengap however I dont think its supported in the new firefox and it uses Java runtime to save the image. I’ve got to say it took me a while to find this addon but it’s brilliant. Adds the ability to save a page, frame, or part of either as an image.

Useful for showing people bugs in a website, creating a snapshot of design progress, or perhaps even creating a gallery of websites.

11. Web Developer Toolbar

Web Developer Toolbar

This is the absolute MUST for any web developer using Firefox. I use it every day no matter what i’m doing, its so user friendly and packed full of feature. This is my number 1 recommendation, try it you will not be disappointed.

And that’s it. If anyone else has any recommendations please feel free to post them.

Related posts:

  1. I used to love firefox
  2. Speed Up Firefox
  3. All Website Statistic That Are Publicly Available
  4. Safari 3 for Windows XP – Finally

26 Responses to “The best Firefox addons for a web developer”

  1. tiffany 14. Aug, 2007 at 1:43 pm #

    I’m also a fan of:

    Firebug;
    YSlow which requires Firebug;
    Live HTTP Headers; and
    FireFTP

  2. Michael from Pro Blog Design 14. Aug, 2007 at 2:35 pm #

    Fantastic set of plugins. (I’ve just installed ColorZilla, so thank you!)

    I’d also recommend “backupfox” (Though not technically a plugin). It lets you make a backup of all plugins/bookmarks etc. and then install them on another computer.

    And Yslow should be installed along with Firebug. It gives some good information on page load times.

  3. Andrew Dahley 16. Aug, 2007 at 5:23 am #

    Where is Firebug
    thats even more valuable then web developer toolbar.

  4. Andrew Dahley 16. Aug, 2007 at 5:24 am #

    sorry. i see its in.

  5. Marc Garvey 31. Oct, 2007 at 3:50 pm #

    Good list. What is that rag, Google Toolbar doing on this page?

  6. Advise-Art 08. Dec, 2007 at 9:12 pm #

    Thank you for the list !!!

  7. Nicolas 28. Jan, 2008 at 5:29 am #

    Thanks for your list.
    My only comment, is that google bar gives problems in some pc’s (64 bits and other situations), making impossible to have more than two windows open at the same time…

    “Web developer toolbar” and “del.icio.us bookmarks” are indeed a must!

  8. Polyvios 29. Jan, 2008 at 10:41 am #

    Nice

  9. Moris 06. Feb, 2008 at 4:02 pm #

    Cool!

  10. Efstathios 07. Feb, 2008 at 9:32 pm #

    Cool!

  11. Charilaos 10. Feb, 2008 at 10:34 am #

    interesting

  12. Alexander 12. Feb, 2008 at 2:59 pm #

    Nice…

  13. Freeman 26. Feb, 2008 at 10:11 pm #

    You make my day!

  14. phobie 28. Feb, 2008 at 8:48 pm #

    I have to add some very usefull add-ons:

    Tab Mix Plus
    A very powerful tab add-on
    https://addons.mozilla.org/en-US/firefox/addon/1122

    Resizeable Textarea
    Resize editboxes with the mouse
    https://addons.mozilla.org/en-US/firefox/addon/3818

    Flashblock
    Flashobjects will only start if you klick on them
    https://addons.mozilla.org/en-US/firefox/addon/433

    Link Alert
    Changes the cursor to indicate the target of the link
    https://addons.mozilla.org/en-US/firefox/addon/3199

  15. Download Firefox 22. May, 2008 at 2:46 am #

    Sweet list, a personal favorite of mine though, is the web developer toolbar. As a designer I couldn’t live without it.

  16. Alex 15. Aug, 2008 at 11:50 am #

    Your blog is interesting!

    Keep up the good work!

  17. Coach Hire 20. Dec, 2008 at 9:45 pm #

    Hello. I think you are eactly thinking like Sukrat. I really loved the post.

  18. Raghu 08. Sep, 2009 at 12:40 pm #

    every thing that is stated in this article is true. All these addons will help save tons of time for web developers and normal users alike.

  19. Phil Ivey 11. Sep, 2009 at 11:52 am #

    You forgot Search Status which is an excellent addon, both for web developers & internet marketers.

    It is a good post, and i love the wordpress theme.

    Phil.

  20. admin 16. Sep, 2009 at 3:06 pm #

    Thanks for all your comments.

    The reason I’ve included Google Toolbar is purely for ‘Page Rank’. Almost all of the other plugins that provide Google Page Rank never seem to work consistently and therefore aren’t included in the list.

    For example SearchStatus doesn’t work on SSL sites, thanks for the suggestion though.

  21. Titan 06. Oct, 2009 at 10:19 pm #

    Thanks mate!
    you saved me here. Lost all my addons in a format and couldent remember, nor find them again. :)

  22. radiators 30. Dec, 2009 at 9:07 am #

    Excellent post – some of these add ons are superb!

Trackbacks/Pingbacks

  1. 10 Referencias que todo diseñador debe conocer « frogx.three - 14. Aug, 2007

    [...] Las mejores extensiones de Firefox para desarrolladores web. [...]

  2. 10 lists every designer should bookmark | Daily designer news - 14. Aug, 2007

    [...] The best Firefox addons for a web developer Good list, even though I don’t understand what the Google Toolbar is doing in this. [...]

  3. More FireFox Plugins - Geared Toward Developers | At The Bottom, Looking Up - 21. Aug, 2007

    [...] In my first post about Firefox and Plugins, I gave a few general plugins that would benefit everyone. This version is geared more towards developers and the plugins that can help when web developing. I found all of these on a post on Lenatsu. [...]

  4. 10 lists every designer should bookmark | Designer Daily - 16. Sep, 2009

    [...] The best Firefox addons for a web developer Good list, even though I don’t understand what the Google Toolbar is doing in this. [...]

Leave a Reply