In Freebies, Tips Sep 23, 200819

22 Firefox 3 Plugins Web Designers Can’t Live Without

Mozilla Firefox has always been considered a “user-friendly” browser, but with all the customizable extensions, it has become probably the most “developer-friendly” browser as well. We have collected the best FFX dev scripts available, and installing them takes just a few clicks. And don’t forget; make sure you have downloaded and installed Firefox 3.0 as well!

Web Developer 1.1.6

The Web Developer extension adds a menu and a toolbar to the browser with various web developer tools. It is designed for Firefox, Flock and Seamonkey, and will run on any platform that these browsers support including Windows, Mac OS X and Linux.

Style Sheet Chooser II 3.0.0.1

Style Sheet Chooser II allows you to choose author-provided alternate style sheets for a web site, and have those choices be persisted for all pages on the same site. Style Sheet Chooser II replaces Firefox’s built-in style sheet switcher - its functionality is available via the [View]->[Page Style] menu item, one-click stylesheet rotating Toolbar icon and Statusbar icon. Icons can be switched on/off via Extension Preferences.

CSSViewer 1.0.3

A simple CSS property viewer.

CSS validator 3.0.0

Validates a page using the W3C CSS Validator. Adds an option to the right-click context menu and to the Tools menu to allow for easy validation of the CSS of the current page. Opens the results in a new tab. Will only work on pages that have a CSS file associated. For example it will work withhttp://www.w3.org/ as the URL has a CSS file.

ColorZilla 2.0

Advanced Eyedropper, ColorPicker, Page Zoomer and other colorful goodies. With ColorZilla you can get a color reading from any point in your browser, quickly adjust this color and paste it into another program. You can Zoom the page you are viewing and measure distances between any two points on the page. The built-in palette browser allows choosing colors from pre-defined color sets and saving the most used colors in custom palettes. DOM spying features allow getting various information about DOM elements quickly and easily.

Font Finder 0.5c

Simply highlight a single element (e.g. a paragraph or a strong tag ), right-click and select `Font Finder`, then marvel as the full CSS text styling of the selected element appears.

Html Validator 0.8.5.2

HTML Validator is a Mozilla extension that adds HTML validation inside Firefox and Mozilla. The number of errors of a HTML page is seen on the form of an icon in the status bar when browsing. The extension can validate the HTML sent by the server or the HTML in the memory (after Ajax execution). The details of the errors are seen when looking the HTML source of the page. The extension is based on Tidy and OpenSP (SGML Parser). Both algorithms were originally developed by the Web Consortium W3C. And now extended and improved by a lot of persons. Both algorithms are embedded inside Mozilla/Firefox and makes the validation locally on your machine, without sending HTML to a third party server.

DownThemAll! 1.0.3

DownThemAll is all you can desire from a download manager: it features an advanced accelerator that increases speed up to 400% and it allows you to pause and resume downloads at any time. DownThemAll is fast, reliable and easy-to-use! It lets you download all the links or images contained in a webpage and much more: you can refine your downloads by fully customizable criteria to get only what you really want!

Greasemonkey 0.8.20080609.0

Allows you to customize the way a webpage displays using small bits of JavaScript. Hundreds of scripts, for a wide variety of popular sites, are already available at http://userscripts.org.

iMacros for Firefox 6.0.7.2

iMacros was designed to automate the most repetitious tasks on the web. If there’s an activity you have to do repeatedly, just record it in iMacros. The next time you need to do it, the entire macro will run at the click of a button! With iMacros, you can quickly and easily fill out web forms, remember passwords, create a webmail notifier, download information from other sites, scrape the Web (get data from multiple sites), and more. You can keep the macros on your computer for your own use, or share them with others by embedding them on your homepage, blog, company Intranet or any social bookmarking service. The uses are limited only by your imagination!

Firebug 1.2.1

Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.

FoxyProxy 2.8.5

FoxyProxy is a Firefox extension which automatically switches an internet connection across one or more proxy servers based on URL patterns. Put simply, FoxyProxy automates the manual process of editing Firefox’s Connection Settings dialog. Proxy server switching occurs based on the loading URL and the switching rules you define.

Screengrab! 0.95

Screengrab saves entire webpages as images. It will save what you can see in the window, the entire page, just a selection, a particular frame… basically it saves webpages as images. The following little keywords are at the request of those who can’t remember the name ScreenGrab! and want searches to work. It takes screen shots, screenshots - that is, shots, of web pages.

YSlow 0.9.5b2

YSlow gives you; a performance report card, HTTP/HTML summary, list of components in the page, and other various tools including JSLint.

MeasureIt 0.3.8

Draw out a ruler to get the pixel width and height of any elements on a webpage.

Pencil 1.0.3

Pencil is a free and opensource tool for making diagrams and GUI prototyping that everyone can use. Top features include; Built-in stencils for diagraming and prototyping, Multi-page document with background page, On-screen text editing with rich-text supports, PNG rasterizing, Undo/redo supports, Installing user-defined stencils, Standard drawing operations: aligning, z-ordering, scaling, rotating, and many more great features!

IE Tab 1.5.20080823

This is a great tool for web developers, since you can easily see how your web page displayed in IE with just one click and then switch back to Firefox.

SEO for Firefox

Want to know why Google or Yahoo! ranks pages? If so this is the Firefox extension for you. SEO for Firefox pulls in many useful marketing data points to make it easy get a holistic view of the competitive landscape of a market directly in the search results.

NoScript 1.8.1.3

Winner of the “2006 PC World World Class Award”, this tool provides extra protection to your Firefox. It allows JavaScript, Java and other executable content to run only from trusted domains of your choice, e.g. your home-banking web site, and guards the “trust boundaries” against cross-site scripting attacks (XSS). Such a preemptive approach prevents exploitation of security vulnerabilities (known and even unknown!) with no loss of functionality.

FireShot 0.60

FireShot is a Firefox extension that creates screenshots of web pages. Unlike other extensions, this plugin provides a set of editing and annotation tools, which let users quickly modify captures and insert text and graphical annotations. Such functionality will be especially useful for web designers, testers and content reviewers. It’s possible to choose whether entire web page or only visible part of this page should be captured. Screenshots can be uploaded to server, saved to disk (PNG, GIF, JPEG, BMP), printed (NEW!), copied to clipboard, e-mailed and sent to external editor for further processing.

OperaView 0.6.1

Even if you using Mozilla browser all the time, sometimes it is need for view the page, you are looking at, in Opera browser (especially if you are a web developer). OperaView extension makes that process easier by adding item View This Page in Opera to the page context menu and a button to the toolbar and item Open Link Target in Opera to the link context menu. So if you would like to quick view page in Opera, just right click somewhere on the page and choose new menu item.

Window Resizer 1.0

The Browser Window Resizer is useful for testing different screen sizes. It accurately resizes your browser so you can test to see what a web page looks like in all of the standard resolution sizes. Supports the 640×480, 800×600, 1024×768, 1280×800, 1280×1024, 1600×1200 resolutions. Resize the current page via the Context menu, Tool menu or Toolbar button.

Article written by Omar the Radwan