Some Good Firefox Extensions

Screenshot of my Extensions windowI use a few Firefox extensions that I thought might be useful to others. Here’s a quick overview of the extensions I use and why I like them.

Linky

I’ve written about Linky before, and I still use it regularly. Linky is a simple extension that adds the ability to open a group of links in new tabs or windows. For example, if you have a page with a linked list of screenshots, you can select the list of links, and use Linky to open all of the links in new tabs. Then the screenshots will download each in their own tab, and you can easily browse through them. Here’s a screenshot of the Linky menu.

McSearchPreview

This is a simple extension that makes Google search results pages (and A9, MSN, del.icio.us, and Amazon) display thumbnails of the sites next to each of the search results. Here’s a screenshot of a Google search results page with McSearchPreview installed.

It’s a cool example of how extensions can build and improve upon existing websites/services. All you do is install the plugin, and go search Google. The thumbnails, which from Amazon’s Alexa service, are not available for every site, but the coverage is quite good (and seems to improve).

I saw someone using this plugin at the Gnome Summit this year and thought it was an awesome idea. It has been interesting to see, though, after having used it for a while that the thumbnails are not actually as useful as you might think in Google search results. Maybe that’s why Google hasn’t done this themselves.

Web Developer Extension

Web developer toolbar screenshotMaintained my Chris Pederick, the Web Developer extension add a new menu to the context (right-click) menu on the web page area, the same menu is added to the “Tools” application menu, and a new set of toolbar items are available.

You can put the Web Developer-supplied new toolbar items anywhere in the normal toolbar. Here’s a screenshot of how I organize the tools in my toolbar setup (the Web Developer extension tools are the row of icons aligned to the right under the search box). As the name indicates, this extension is geared towards web-developers. A few of the features I rely on are:

View Style Information
This option lets you click on a web page element (a link, an image, a block, anything) and it will open a new tab listing all of the CSS applied to that element. Very useful for debugging.
Validate Local HTML
Along with slew of other handy validation options (including the basic W3C.org “Validate this Page”), the “Validate Local HTML” grabs the HTML source of the current page and runs it against the WDG Validator. They key to this feature is that the page does not have to be publicly accessible so you can validate password protected pages (of course, you’ll be sending the source out unencrypted), and validate pages on your local hard-drive.
Outline Block Level Elements
The outline menu provides options to outline a variety of different sets of elements, but the Block Level option will put colored outlines on all DIV, P, BLOCKQUOTE, or other block level HTML elements. This is also a great debugging tool.
Display ID & Class Details
This option displays the CSS ID and class names of all the elements on a page. When used in conjunction with the “Outline Block Level Elements” feature, it’s a great way to find out what part of the HTML and CSS a particular problem is stemming from. Here’s a screenshot of a page with these features turned on.
Edit CSS
This feature opens up a sidebar displaying the CSS for the current page. You can actually edit the CSS and see the results in real-time. Of course, you can’t save your changes from here, but it’s a great way to try things out.
Resize
This option will resize your browser to a pre-set or custom size. Very handy when designing for smaller screens (800×600/640×480 in particular).
 

14 thoughts on “Some Good Firefox Extensions

  1. I like having ForecastFox in my corner too, since those of us stuck with a foot in Win32 and don’t have a nice free Weather-in-the-tray tool like OS X’s Weatherpop or that nifty Gnome one. Unless I’ve been living under a rock.

  2. I’ve got a few pretty essential extentions to add to that list:

    Scrollbar Anywhere – Makes holding down your rightmouse button act like an adobe had, except it scrolls the other way around. This keeps you from going back and forth to the scrollbar all the time.

    Add live Bookmark – Adds an “add as livebookmark” option to the context menu for RSS/Atom links.

    Gmal notifier – Makes so much sense to have the notifier as part of the browser. Also reduces your systemload as it’s lighter than google’s notifier.

    I also use Zoomy and Toolbar Enhancements from Clav for text-size buttons and a fullscreen button on my toolbar.

  3. Beyond those mentioned, these two are essential:

    FLTS (Focus Last Tab Selected)
    Close a tab and the focus returns to the last tab you were viewing. This should be the default behavior, but it’s not. You’ll hate being without this extension once you try it.

    Nuke Anything
    Adds a content menu selection “Remove this item.” Right-click on an offensive image and nuke it. Reload the page to undo. Sometimes you want Adblock; more often you want NukeAnything.

    Both of these are lightweight and behave perfectly in FF 1.0 on Win, OS X, and desktop Linux.

    On the heavier side there’s FireFTP. We shouldn’t use FTP any more, but having an FTP client in your browser’s hip pocket for times when you can’t SSH covers the waterfront. Ditch the others. Travel light. Feel the XUL.

    LQ

  4. I use many of the extensions already mentioned, but the one I can’t believe hasn’t been mentioned is AutoFill. It’s very well designed, featuring primary/billing address and secondary/shipping address fields and password-protected credit card info fields; it also allows for creating multiple profiles and it highlights fields on a form that it will fill. Finally, it adds a nice drag-and-drop element for the toolbar that adds one-click form-filling joy.

    I also really like FoxyTunes, a very flexible media player control panel that can have as many or as few controls on the bar as you want, can be set to collapse into a single icon when not in use, and is compatable with every major media player.

    Finally, I’d always found the search bar to be a bit on the stubby side, and the Resize Search Bar extension adds a toolbar item that allows easy resizing of search bar.

  5. How do you have the web developer extension NOT showing all of the top-level icons on its toolbar? Am I missing something obvious here?

    It looks like you’ve got disable, css, validation, outline, information – which means you have forms, images, miscellaneous, resize, view source and options hidden?

    I don’t even know if this is particulary valuable, I just didn’t know it was possible.

  6. jankowski: If you hide the Web Developer Toolbar (“View” -> “Toolbars”, then un-check “Web Developer Toolbar”), then customize the toolbars (right click on the main toolbar and choose “Customize”, you can drag the Web Developer toolbar options into the other toolbars as you like.

  7. Hehe, it seems my comments have not gone unnoticed thanks to Charles Collis, who emailed me that the new Scrollbar Anywhere extention supports AdobeTypeDrag(tm).

    To quote the install page:

    Scrollbar Anywhere version 0.7 adds the ability to perform “Grab and Drag” scrolling, thus enabling the emulation of Acrobat Reader scrolling. Scrollbar Anywhere has now 3 hidden preferences:

    1. scrollbarAnywhere.button which defines the button that triggers the scrolling (0: left, 1: middle, 2: right). Default is 2.
    2. scrollbarAnywhere.grabNDrag which, when set to true, enables the “Grab and Drag” mode. Default is false.
    3. scrollbarAnywhere.reverse which defines the direction of scrolling (same as the mouse or opposite to the mouse). Default is false.

    Notice that to emulate Acrobat Reader scrolling, you need to set both grabNDrag and reverse preferences to true.”

    Nice! Many thanks to Marc Boullet and Charles Collis!

Comments are closed.