Stickblog » Firefox Extensions

Screenshot web sites easily with FireShot

Stickman — Wed, 11 Jun 2008 07:40:58 +0000

Another day, another Firefox plugin plug…well I could drone on about how much fun it is to completely refactor all the exception handling in our large and complex publishing framework, but somehow I don’t think you’d be any more excited about it than I am.

So I’ve been breaking up the monotony now and again by poking around Firefox’s ever-growing list of add-ons and yesterday I stumbled across Fireshot, which I think is easily good enough for a mention here. It’s a screen-grabber for Firefox, but in addition it also allows you, very quickly and easily, to annotate a screenshot, highlight areas of interest etc. You can choose to grab either just the visible area, or the whole page.

I really am very impressed with how well thought-out and seamless it makes the process — very useful if you’re creating documentation, for example.

One downside is that it’s Windows-only, which is a shame but understandable given that it’s based on (commercial) Windows software.

Monitoring HTTP activity with HttpFox

Stickman — Mon, 09 Jun 2008 12:42:24 +0000

While Firebug is about as close to a perfect tool for web development as I’ve ever seen, its use as an HTTP monitor is limited — if only because its Net pane is cleared when the page refreshes. In the past I’ve used Fiddler for this job, but of course you need to remember to start it up and then configure Firefox’s proxy settings to make use of it.

I’ve recently discovered HttpFox, a Firefox extension which sits quite neatly between the two: it works better than Firebug but lacks some of the more powerful facilities of Fiddler (for example, the ability to intercept and modify requests during send/receive). However for basic HTTP monitoring tasks, it’s simple and convenient.

Preventing Firefox from ‘fixing’ your URLs

Stickman — Tue, 04 Mar 2008 11:31:53 +0000

In the office where I work, we have a number of in-house development and utility servers, some of which use truncated domains: for example, our Trac installation is reachable by using just the domain http://trac/, so in fact you can just type ‘trac’ into the address bar. Quick to type and easy to remember.

However, if for some reason the server fails to respond in a timely manner, Firefox tries to be clever: it thinks “Ah, the user is just being lazy, I can help!” and it automagically prepends ‘www.’ and adds ‘.com’ to the end of the URL. The result? I end up redirected to some random site thinking “Crap, what’s happened to our Trac server?” until the penny drops.

This annoys me, and every time I install a new version of Firefox I have to remember to disable the behaviour. Except I always forget which configuration directive is responsible. So for my future peace of mind, here it is:

In the address bar, type about:config
Filter for fixup
Make sure that browser.fixup.alternate.enabled is set to false

And there you have it.

For more information about this and all Firefox’s many other, exciting about:config entries, check out this Mozillazine FAQ.

Firefox Extension: Firebug gets even better

Stickman — Tue, 05 Dec 2006 09:58:31 +0000

I’ve gushed about Firebug before but I’ve just been tipped off to a new (beta) version (and a new web site) and I thought it was about time I gushed some more.

If you’re a web developer and you don’t have this extension installed, then you deserve a slap about the face. Firebug has so many useful features I could rant on for ages, but here are the highlights:

Error console (which can be addressed directly from JavaScript)
Inspect and edit HTML and CSS inline
JavaScript inspector, debugger and profiler
JavaScript command line
DOM Explorer
Monitoring and debugging of requests and responses using XMLHTTPRequest
File sizes and timings display

I really can’t say enough good things about this extension, and this latest version is a massive improvement over previous releases.

Get it.

UPDATE: check out this interesting article exploring just some of Firebug’s features.

Firefox: simple config setting can improve memory usage

Stickman — Mon, 10 Apr 2006 08:48:48 +0000

Here’s a simple tip for (potentially) improving performance in Firefox. Not a hack, just someone pointing out a rather obscure feature.

Firefox getting bogged down? Extensions might be to blame

Stickman — Wed, 05 Apr 2006 08:05:09 +0000

Here’s a potentially very useful post that lists some of the most popular Firefox extensions that suffer from ‘memory issues’ and could be causing your browser to run slowly.

Firefox Extension: Firebug

Stickman — Tue, 24 Jan 2006 08:55:17 +0000

Yes, yet another widget to help with web development: this time, an improved Javascript console (which I’ve ben praying for since I first began using Firefox). Instead of sitting in another window Firebug docks along the bottom of your browser window and can be minimised to the status bar, with a small display of any errors that arise. It even includes an option to log XMLHTTPRequest operations, with all sorts of information about what’s going on.

It has an ‘inspect element’ facility that allows you to click on any element of your page and see its properties — HTML, CSS and any also any Javascript associated with it. In addition, simply by adding a brief function definition to your scripts, you can write your own log output to the Firebug window.

All in all, a very useful tool.

Firefox Extension: IE Tab

Stickman — Thu, 01 Dec 2005 11:17:19 +0000

I develop almost entirely in Mozilla Firefox, but of course I have to check all my work with Microsoft Internet Explorer. It’s a drag, but it has to be done. However today someone pointed out the IE Tab extension that allows you to switch between Firefox and Internet Explorer rendering engines, from within a Firefox tab, at the click of a button. So you can check the same page in both browsers very quickly, or compare them side-by-side in separate tabs.

Very smart.

Firefox Extension: View Rendered Source

Stickman — Thu, 11 Aug 2005 07:52:05 +0000

When you’re working extensively with pages that make use of dynamic HTML — ie. using Javascript to manipulate the structure of a page — the “View source” option in Firefox becomes effectively redundant, because the original source that you’ll see may not bear much resemblance to the ‘true’ current state of the page. This can make it frustratingly difficult to develop in this sort of environment.

View Rendered Source is a Firefox extension that aims to help, by allowing you to view the source code of an HTML after any transformations. And it does so in a very readable, structured way too.

Please note: I experienced a serious problem where the extension caused my PC to reboot (!). The creator of the extension has since published a simple fix (set the option to open in a separate window rather than a tab) — I strongly recommend you enable this feature.

If you’re looking for an equivalent for Internet Explorer, you might check out Instant Source, which does much the same job although in a slightly different way. Sadly, it’s not free.

Firefox Extension: Finding total page weight

Stickman — Thu, 30 Jun 2005 13:45:36 +0000

Just a quick one…I wanted to be able to find out, quickly, the weight (ie. the total size of all files) for any given page on a site. Page Info will give you some help, but it doesn’t always seem to work and it doesn’t give you a total.

Anyway I hit Google and stumbled upon this simple and not very well publicised Firefox extension: Fatweb, by Paul English. Promised developments don’t seem to have materialised but even in its basic form it’s useful — it gives a running total of bytes loaded, in the status bar. On click you get a list of all files and their sizes, with estimated total download time.