useful tips and resources

10 Must Have Firefox Plugins for Web Developers

December 8th, 2008 · 20 Comments

1. Flash Switcher

It is a must have for Flash Developers, it lets you choose between different versions of flash so you can be sure your code is compatible with all existing versions of Flash.

Flash Switcher

2. Firebug

Firebug allows you to edit CSS and HTML and any browser side code from within the browser. It’s a great tool to figure out why your webpages are loading slowly, what javascript code is slowing things down, and editing pages within the browser environment.

Firebug

3. Live HTTP Headers

Live HTTP headers shows you the dialog that happens between the web server and your browser. Figure out why things aren’t redirecting, why search engines aren’t properly indexing your content, and what website is pushing you cookies in realtime.

Live HTTP Headers

4. FireShot

Ever want to send screenshots to clients? Or take an image off a page and use it in a mockup? Fireshot lets you take screenshots of entire pages, selected areas, or the current window and export it to an imaging program. Great for quick mockups, client meetings and portfolio pages.

FireShot

5. Tamper Data

This plugin allows you to modifty GET and POST parameters on any page. Use it to test form processing code, test for security issues and diagnose bugs. It’s only issue is that it won’t work in tandem with Google’s web accelerator.

6. Load Time Analyzer

See how long your web page takes to load for different speeds. Especially useful for developers whose audience may still be using dialup.

7. MeasureIt

Ever one what the exact dimensions are of a piece of web page? Need to create a new graphic but don’t know what size? MeasureIt adds a ruler which lets you measure vertically and horizontally.

8. ColorZilla

It lets you get the RGB colors of any element on a pageusing a drop tool similarly to photoshop. Great when you need to design new graphics on an existing project.

9. Link Checker

To see which links aren’t loading properly or go 404 from any given page.

10. Web Developer

Web Developer is the granddaddy of all Firefox development plugins. Among it’s amazing features: view the CSS property or parent class of any element on a page with a simple click, find broken images, view any form field and much more. You can clear cookies, run a DOM editor, and use all other functions from one simple menu. Once you start using it you will never figure out how you lived without it!

This article was written by Maya Richard, who is currently a reviewer of cell phones. She can be reached using her full name @ gmail.com

Tags: Tips

20 responses so far ↓

  • 1 ITMDesign // Dec 8, 2008 at 10:24 pm

    Have to agree, Web Developer is amazing! Saves a serious amount of time and brain power. We especially like using it for perfecting HTML and CSS.

    Firebug also looks intersting, will have to give it a go.

  • 2 Codecraft // Dec 9, 2008 at 9:40 pm

    I would have to recommend HTML Validator and HTTPFox as additions to this list.

    The first one allows you to check your html code against the W3 spec, as well as helping you to make sites that should require less tweaking to work cross browser, it will help you learn to write better html in the first place!

    The second one is a great tool for understanding how pages interact with each other, when a page loads, what other media is it loading, what variables is it sending, and where to, etc.

    Finally - one for everyone, not just developers - Foxmarks, if you have multiple computers (laptop, desktop, home, work, etc) and an extensive bookmark collection - this superb add on keeps them synchronised across all of your machines as well as backed up on a central server in case of a catastrophe. Can’t live without it!

  • 3 Internet Marketing Community // Dec 10, 2008 at 1:53 am

    Some of these I had no idea about. DLin them all now. Thanks for this post, bro. MeasureIt and ColorZilla have always been on my list, though, as I love design work. Makes it super easy.

    Justin Dupre
    Deeboo.com Webmaster, SEO, and Internet Marketing Community

  • 4 ff-webdesigner // Dec 10, 2008 at 8:02 pm

    i didn’t Know the flash switcher so thank you for that! Can no more live without firebug.

  • 5 Patrick // Dec 27, 2008 at 2:56 am

    Thanks for bringing this all together in one post! I’m on to firebug right now, thanks to you.

  • 6 seo web design // Jan 6, 2009 at 5:07 pm

    Great tips! Thanks for sharing!! Very helpful.. :D

  • 7 6 Open Source Programs For Web Designers // Jan 12, 2009 at 3:58 pm

    […] that go with it, turn it into a formidable web development and debugging tool at a great cost. See our previous post on great plugins for […]

  • 8 RipFish // Jan 31, 2009 at 1:12 am

    I LOVE Firebug and Web Developer. Two amazing utilities. I didn’t know about Flash Switcher, and that looks great as well. Thanks for the list!

  • 9 Boca Raton Website Design // Feb 3, 2009 at 2:11 am

    Thanks for sharing your thoughts…I think it was a great post…a very interesting read!

  • 10 Topeka Website Designer // Feb 7, 2009 at 12:11 am

    Great list of resources for any web developer. Thanks for the contribution!

  • 11 Web design company // Feb 7, 2009 at 12:17 pm

    It is very interesting sharing thanks for giving good info.

  • 12 Web Design Washington DC // Feb 13, 2009 at 9:09 pm

    Firebug is truly awesome - we have a debate going in our office as to which is better - Firebug or Web Developer, but I lean more towards that one. Great Article!

  • 13 Web design // Feb 18, 2009 at 1:47 am

    I just recently discovered your Blog and appreciate you sharing your bout with Web Design with the world. but this site also search best knowledge
    Web Design.

  • 14 Kalpesh Ajugia // Feb 20, 2009 at 5:26 pm

    That’s the perfect set of must haves!!!

  • 15 Portland Web Design // Apr 20, 2009 at 8:40 am

    What about the pagerank plugin for seo and also the http://www.seoworkers.com plugin to get a keword report?

  • 16 web design studio // Apr 20, 2009 at 9:24 am

    Thanks so much for this super useful post.

  • 17 6 Open Source Programs For Web Designers | Designurimagination Blog - Let Your Imagination Fly // Apr 27, 2009 at 9:56 am

    […] that go with it, turn it into a formidable web development and debugging tool at a great cost. See our previous post on great plugins for […]

  • 18 Web design // May 16, 2009 at 8:53 pm

    I haven’t seen some of these and will be checking them out they look interesting, I use firebug and I couldn’t live without it.

  • 19 Web design Speed | Web Development | Web Site Design | SEO | Tips » 10 Must Have Firefox Plugins for Web Developers // May 21, 2009 at 8:41 am

    […] Go to Source Share and Enjoy: […]

  • 20 Web design Speed | Web Development | Web Site Design | SEO | Tips » 6 Open Source Programs For Web Designers // May 21, 2009 at 8:41 am

    […] that go with it, turn it into a formidable web development and debugging tool at a great cost. See our previous post on great plugins for […]

Leave a Comment