3 indispensible Firefox Web Developer addons

decibel.places's picture

He has: 1,494 posts

Joined: Jun 2008

I know there is a "5 applications you can't live without" thread that has spanned years - but this is specific to Firefox Web Developer addons.

I rely - heavily - on the Web Developer add on in Firefox

Click on anything on the page and view it's nested css ... handy for those obscure Drupal styles

Also useful: Measure It (how many pixels to move that?)

And color picker ColorZilla

(for some reason this addon does not appear in the site search, I had to search mozilla.org from Google)

And anything else that strikes your fancy - I have a page load timer that prompted me to sign up with a different host today - and when placeholding I grab DummyLipsum...

pr0gr4mm3r's picture

He has: 1,507 posts

Joined: Sep 2006

Ya, I have a post in my blog that lists all of my favorite ones. I should probably update that one for Firefox 3 since some of them aren't needed anymore or are not compatible (yet).

The Web Developer Toolbar is by far the most useful add-on for web developers. I use it daily.

del.icio.us buttons is another great one. I don't use Firefox's bookmark functions because I have almost half a dozen installations of Firefox across my tri-boot desktop, dual-boot laptop, and several other computers I work/surf on. Managing all my bookmarks with del.icio.us easily allows me to manage my bookmarks across multiple locations.

decibel.places's picture

He has: 1,494 posts

Joined: Jun 2008

yup I have the del.ici.ous addon too

My browser is so bloated there are lots of things I have never used and always plan to clean it out - just after I get this sql query working, know whaddi mean?

I almost upgraded to FFox 3 beta (yeah I know it is released for Linux already but I have not gotten Ubuntu 8.04 working with my Broadcom wlan and I don't like being tethered) but I got nervous I would be without my trusty tools, and didn't want to take the time to check which ones are updated... so I guess I'll wait. Could be a way to reduce my bloat Smiling

I spend too much time in these forums but there are so many amazingly talented and ridiculous people here!

Besides StartLogic has somehow changed the password of the db for my main client's test site -- do not get me started, I signed up with BlueHost tonight and made arrangements a week ago to set up client's test sites on their own RackSpace account (actually 4 sites, over 34000 images in 4 different sizes... approx 100MB of SQL ... gotta put aside a day to set it all up) and not even for pay because not client's fault the test sites I did charge to set up don't work... but client is cool.

Jack Michaelson's picture

He has: 1,733 posts

Joined: Dec 1999

my top 3:

  1. Web Developer: nough said about this one, a must have
  2. Tamper Data: view request info, comes in handy when processing ajax requests
  3. FireBug: debugs just everything

Shakespeare: onclick || !(onclick)

Megan's picture

She has: 11,363 posts

Joined: Jun 1999

  • Firebug - my main reason for ever using Firefox
  • FireFTP - useful on the rare occasions when I need to FTP.
  • HTML Validator is a useful one (puts an icon in the status bar to show whether the site validates or not, then you can get a source view pointing to the errors).
  • ScreenGrab - easier to access than the ones that come with the OS

I actually don't use the web developer extension that much anymore. Firebug has really replaced it for me.

decibel.places's picture

He has: 1,494 posts

Joined: Jun 2008

wow - I have Firebug too and never used it - very cool

regarding validation, it is not always useful

I understand many Drupal pages don't validate because of an unclosed <p> in the teasers - they say the html filter should correct that

I also sometimes use a javascript method for AdSense to keep all the codes in a js file then write them as js variables to the page (like css for AdSense) - but it requires an unclosed <div> tag on the page that is then closed by the js (only way I could get it to work) but does not validate.

lots of other hacks and kludges necessary to make pages cross-browser also break validation.

I think it's important to know you have written clean good code that doesn't break but validation works mainly for simpler pages

Megan's picture

She has: 11,363 posts

Joined: Jun 1999

Well, I have a lot of thoughts on validation. The main reason why I like this plugin is because otherwise I wouldn't know if something is invalid or not because I don't go around checking all the time. It's a nice little reminder. If I happen to be working on a particular page I'll try to fix the errors if I can.

Whether it's possible to get complex pages to validate is another question. As I said in those posts, I don't think validation is super important either but that doesn't mean that it's okay to ignore it altogehter. Go down that path and you'll end up with tag soup sooner or later. Knowing why your pages don't validate is better than being completely oblivious to it.

Also keep in mind that I don't use FF as my regular browser so I only see this when I'm working on something with Firebug or doing some cross-browser testing (I also wouldn't say that these plugins are "indispensable" to me. Other than firebug I don't really use them that much).

He has: 630 posts

Joined: May 2007

netsperience wrote:

I understand many Drupal pages don't validate because of an unclosed <p> in the teasers - they say the html filter should correct that

Unclosed P tags, along with others like LI and TD, are valid HTML. The validator checks against the DOCTYPE. Even though you have an XHTML DOCTYPE, every browser on earth is interpreting these pages as HTML, not XHTML. So an unclosed P is not a problem.

Saying it is XHTML does not make it so.

I still believe validating is useful though. Just like a spell checker, it catches errors that may or may not be a problem.

Cordially, David
--
delete from internet where user_agent="MSIE" and version < 8;

Michael James Swan's picture

He has: 400 posts

Joined: May 2008

I am thinking about downloading these add on's and seeing how they work and whether or not i like them. I am sure that i will but i will never know unless i try them out.

I will keep you all posted...

Best Regards,
Michael James Swan
My website: Web design Glasgow

decibel.places's picture

He has: 1,494 posts

Joined: Jun 2008

there is also an "X-Ray" addon that renders the page with the code overlayed on it, kind of distorts the page but sometimes it tells me what is going on when all else fails

one point about Web Developer vs Firebug is that it can be less obtrusive, Firebug opens in a panel or new window, the css inspector for WD shows in a thin strip up in the toolbar (but not that helpful for very long lists of styles) then you can also open it in a separate view...

Just remember you gotta turn off the "View Style Information" after inspection or the page won't work...

Michael James Swan's picture

He has: 400 posts

Joined: May 2008

That sounds very interesting then. I like the sound of it and i shall get it installed as soon as i make it home later tonight.

I can see that this can also be a problem but i am sure that people will adapt to how it makes things look.

Best Regards,
Michael James Swan
My website: Web design Glasgow

He has: 630 posts

Joined: May 2007

For me, Firebug not only helps greatly in debugging scripts, it also allows me to play with the layout dynamically, such as changing margins[1] with the cursor keys until the layout looks like how I want it. Before Firebug, I used Opera's ability to edit the HTML and CSS directly in the browser cache, then use the "reload from cache" command. Firebug is way cooler.

While you are at it, Yahoo's Yslow[2] not only analyzes your page for things that may be slowing it down-- the results page links directly to details of what you can do about it.

[1] http://getfirebug.com/css.html
[2] http://developer.yahoo.com/yslow/

Cordially, David
--
delete from internet where user_agent="MSIE" and version < 8;

decibel.places's picture

He has: 1,494 posts

Joined: Jun 2008

David,

If you're referring to slowness at netsperience.org I had some serious issues with shared hosting at StartLogic with the first handsahke taking up to 3 or 4 minutes (other times the pages loading in 10-15 seconds)

I have since moved on and setting up still

Also, I consider it still a dev site and I have not turned on the css and js Drupal caching which do speed things up considerably

Finally, my choice to have bandwidth hogging flash widgets like the Jango Jukebox and pond5 video array on the front page, maybe later will move them, but I like the idea that someone arriving at the site can turn on music by one of about 15 artists at the click of a pic...

There are lots of services that analyze your page load - but it's really common sense, in the end - do you really need a service to tell you that huge file is taking a long time to load?

Don't take me wrong, I do not mean to sound contentious, and your citation of the Yahoo service is probably a help to many

I'm just pissy because I'm having DNS problems at my new host, and had to move 4 test sites back to client's server from StartLogic, over 80000 files, had to copy db in 20 steps so much sql - and it's Plesk, so all files had to be ftp down and up (used Filezilla AND SmartFTP)

He has: 630 posts

Joined: May 2007

Sorry, Netsperience,
I didn't mean for you to take that recommendation personally. I had not really noticed slow loading of your site - possibly because Flash is not loaded until I choose. Opera displays a pretty button for me to press if I wish to see a flash movie.

Yslow is not just about large files. Indeed, you may be better off with one large file in place of dozens of small ones. There's a whole slew of issues that force people in remote areas to wait ages for a page to load. Solutions are fairly simple and, once applied, benefit the entire site with no further maintenance.

Yslow was an eye-opener for me. I just meant to share -- certainly not to criticize.

Hope your hosting problems get resolved soon.

Cordially, David
--
delete from internet where user_agent="MSIE" and version < 8;

decibel.places's picture

He has: 1,494 posts

Joined: Jun 2008

David,

I did not mean to sound defensive or offended or whatever

I was just having a semi-bad day and I am pretty tired of people saying my site loads slow when it was the server not my code. (I'm talking 3,4 minutes!)

I think anywhere up to about 15-20 seconds is acceptable if not optimal (we can't all have VPS or better)

And I have no right to say anything about a service I have never tried

Anyway I have fixed my site after the move to the new server (not the way I wanted but it works the way I wanted, which is what counts in the end)

You are such a pleasant guy I am sorry if I caused you any angst.

(Follow-up, later)

My site is now loading in about 20 seconds at BlueHost without caching.

A typical site like http://hcshc.netsperience.org loads in about 12-15 seconds

I am satisfied

silverwing's picture

He has: 79 posts

Joined: May 2008

FireFTP has been released for Firefox 3.

~silverwing - haven't tried it yet

They have: 17 posts

Joined: Jun 2008

Firebug is by far the best plun-in I use. I have not found one that works in IE as well or as fast.

They have: 17 posts

Joined: Jun 2008

can I say only one plugin?
Firebug - as of why, check the css inspect elements by only hovering over them, check JS which is the coolest thing I ever experienced, see what files has been downloaded during the request, edit the css/html from the console to see how will look when you put the work on the server, check DOM ... did i forget something? Smiling

It rocks, and this is the only plugin/addon i have installed.

They have: 2 posts

Joined: Dec 2010

Firefox Web Developer addonsIts one of the best addons for web design. This combined with exceptional. You don't need measureit addon because it comes with its one measuring tool.Orange County Web Design Love this addon.it’s attractive design, color scheme and it’s informative post. Our Orange County web design expertise Creative and dynamic web design.

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.