6 Must Have Firefox Add-ons For Designers & Developers

6 Must Have Firefox Add-ons For Designers & Developers

Web Designers of world i have decided to make a post about great Firefox tools to help speed up your work flow. These are add-ons and plugins that typically help me with designing and coding so i thought i would share them with the world.

The tools i have suggested are tools to speed up debugging, general designing and then uploading.

If i have missed anything from my list please feel free to suggest some good add-ons and i will update the list.

#1 Firebug

Firebug For Firefox

It would be idiotic for this not to come at the top of my list as it is a tool that is very important to any web designer or developer wanting to make tweaks to HTML and CSS on the fly without having to edit, save, upload and refresh. Think of the app as a "Live HTML & CSS Editing Tool".

The best thing about the app is that it not only lets you debug your HTML and CSS but also comes with the ability to be expanded with additional add-ons for Firefox.

Download Firebug

#2 Web Developer Toolbar

Web Developer For Firefox

The "Web Developer Toolbar" for Firefox is fully featured toolbar that lets web designs and developers test their website under many different environments, it allows you to switch off Javascript, Flash, Images and CSS on the fly.

Other great features of the toolbar is its ability to outline structural tags in the HTML and visualise the the code better, resize the Firefox window to the preset monitor resolutions and a built in HTML and CSS validator.

Download Developer Toolbar

#3 Colorzilla

Colorzilla For Firefox

This hand little plugin is very straight forward but extremely useful for anyone designing websites either at the proofing stage in Photoshop or at the contraction stage with HTML and CSS. The plugin allows you to use a dropper tool to find the HEX or RGB colour reference for anything on the website, it also comes in with a brilliant colour swatch for picking similar colours without opening Photoshop.

Download Colorzilla

#4 HTML Validator

This handy little tool checks the website you are currently viewing against HTML/CSS standards and gives you a list of errors or warnings for the HTML. This is perfect for anyone wanting to ensure their designs are 100% valid HTML and CSS.

Download HTML Validator

#5 IE Tab

Unfortunately web designers need to support IE regardless of how much they hate it, thankfully Firefox has a add-on for that allowing you to render pages as they would in IE without having to open IE. The plugin is pretty straight forward because once you hit the IE Tab button the page reloads in an IE frame which renders the page like IE would.

The one problem with this add-on is that it only works on Windows computers and debugging tools like Firebug and Web Developer toolbar cannot be used to check the HTML of the website loaded with in IE Tab.

Download IE Tab

#6 FireFTP

FireFTP For Firefox

Once you have finished your website designing you need to upload the website to the world wide web, so why not use FireFTP, it's FTP software for Firefox, its free and its very good. I used this for a long time until i discovered Coda so you should give it a go.

Download FireFTP

Missing?

These are only the tools that I use on a daily basis and i may well have missed out some key tools so if you use any other Firefox add-ons then please get in touch as i would love to build on the list and also speed up my web building cycle with better tools.

Share This Post

Leave Comment

Links will be amended with nofollow, swearing will be removed and html will be removed. So play nice.

Meta Data

6 of the best Firefox plugins for Web Designers and Web Developers to help speed up design, debugging and uploading of new website projects.

Keywords: websites, designs, designers, web design, firefox, addons, web developers, developers, fireftp, ie tab, colorzilla, firebug