Firebug for Firefox

I was introduced to a very cool Firefox add-on the other day called Firebug.  Can also be added to Chrome although it doesn’t have full functionality as it’s a Lite version (just FYI if your preference is Chrome, like it is for me).

First thing I did was let my wife (Usability Analyst) know.  This is why…

Now I’m no developer, and at this stage I’ve only used one function, but it’s a very handy one when it comes to usability, etc.

Once you have the add-on, launch it and hit the selector function…

Now just hover your mouse over a section of the page and you’ll notice the source change in the Firebug panel (Google Search button in this example)…

So say you want to show users what the page may look like with different labels, text, etc.  For this example we’ll change the Google Search button label.  With your selector click on the button.  Then just right click on the highlighted code and hit Edit HTML…

Then simply re-type the button label to a much more preferred option, just like this one…

It’s so very simple.

We have already used this a few times on my current project to show the business what various screens would look like if their proposed changes were implemented.  It was all done in less than five minutes.  I’m sure the add-on offers MUCH more than this, however I wanted to share as it’s added heaps of value to our project already (and that’s just using this one function).

My wife’s team have also used it several times already.

This is probably nothing new for many of you, but it was for me!

5 thoughts on “Firebug for Firefox

  1. Nice post David, thanks for sharing! We would be so stuck without firebug – all of the development team use it. As testers we love it because it enables us to talk to the ux guys in a language they understand & (as you mention) change the HTML on the fly to help us propose potential fixes for layout bugs.

    It is also really handy for monitoring traffic from & to the browser (requests & responses).

    Someone posted about getting firebug on your iPad – seen that?

    There’s also been a few posts about firefox addins – have you seen them? I’ll dig them out of my favorites.

Got something to say?

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s