Firefox Extensions Every Dev Should Have//+

Mozilla is considered to be one of the most popular browsers amongst computer users, especially among Web developers and designers. With so much competitiveness in the web industry, it makes sense to want to be the forerunner.

One of the key factors which has enabled Mozilla to remain as the most favored browser amongst users & developers alike, is its massive collection of great extensions which improve the end-user browsing experience.

Amongst the mammoth list of these extensions which continue to grow on a daily basis, many of them are pertinent to web developers and designers within managing their task flow. Many of these extensions and add-ons enable them to work and be more productive through their unlimited functionality by reducing their work flow time and allow them to work better and faster than they normally would have without these ” browser-helpers”.

Following are the Top 20 Firefox extensions for developers & designers alike.

1. Web Developer

Web Developer adds a toolbar to your browser. This toolbar provides many options that allow you to scan web pages. For example, the extension allows you to analyze the CSS styles on a web page.
 
Download
 

2. SeoQuake

Seoquake is a Firefox SEO extension aimed primarily at helping web masters who deal with search engine optimization (SEO), social media optimization (SMO) and internet promotion. Seoquake allows investigating many important SEO parameters.
 
Download
 

3. Window Resizer 1.0

Window Resizer 1.0 allows developers to test their web pages on different monitor resolutions and even screen sizes. It gives you a preview of how your web page will look like on different screens and screen types.
 
Download
 

4. FireShot

FireShot allows you to take snaps of your web pages. However, it also allows you to edit the screen shots as well and annotate them as well.
 
Download
 

5. Firebug

Firebug provides a plethora of tools and features that allow you to analyze, debug, script and edit web pages in real-time. Not only is it exceptionally powerful, it is surprisingly easy to use.
 
Download
 

6. Greasemonkey

Greasemonkey gives developers the ability to modify the design and looks of their web pages using small chunks of JavaScript. The best part is that you can download hundreds of different scripts for this extension. This number is ever increasing.
 
Download
 

7. ColorZilla

Quite simply, ColorZilla provides developers with an eyedropper tool, color picker, and other colorful goodies. This lets them determine the color used on any web page.
 
Download
 

8. FireFTP

FireFT allows developers to upload files to their or any server. The best part about this extension is that it does not depend on the operating system.
 
Download
 

9. IE Tab

IE Tab allows developers to switch their Firefox layout with an Internet Explorer equivalent with a simple click. This lets developers test the compatibility of their web page on another browser.
 
Download
 

10. Palette Grabber

Pallate Grabber allows developers to export color themes to their favorite graphic-editing software (Paint Shop Pro, Fireworks, Photoshop, Paint.NET, etc.).
 
Download
 

11. Font Finder 0.5c

When you highlight any text on a web page, the extension will automatically detect the CSS style of the text and let you know. For many new fonts, you may need to stay connected to the internet through a dongle or Wi-Fi connection.
 
Download
 

12. Total Validator

Total Validator is one great validation tool. Not only does it validate HTML and links for you, it lets you check for broken links, spelling and take screenshots as well.
 
Download
 

13. Platypus

Platypus is similar to Greasemonkey but provides enhanced functionality. For example, it remembers the web pages you visited and all the modifications you made on it.
 
Download
 

14. Dummy Lipsum

Dummy Lipsum quite similarly creates Lorem Ipsum dummy text for you. This lets you use it in your own designs.
 
Download
 

15. Page Diff

Page Diff allows developers like you to see the differences in HTML source code between multiple web pages. This is great when you are trying to debug your web page.
 
Download
 

16. Aardvark

Aardvark lets you remove and modify various elements of a web page. For example, it will let you remove a web page element entirely or change its color; the choice is yours. It also lets you take screen shots of the web pages.
 
Download
 

17. Codetch

Codetch is a Firefox extension that is a WYSIWYG editor. You can directly edit your web pages from Firefox. If you have ever used Dreamweaver, you will notice the similar interface.
 
Download
 

18. Measure It

In short, Measure It allows you to measure the sizes of web page elements and lets you draw a ruler across any webpage to check the width, height, or alignment of page elements in pixels.
 
Download
 

19. YSlow

YSlow lets developers check the performance of a web page and also identifies any abnormalities. These aids in web page optimization; an integral part of development.
 
Download
 

20 CSSMate

This is actually a port of the excellent Edit CSS tool which allows the developers to create style sheet and load each one into separate tab. Developers can also delete the save load clear functionality if they found it useless.
 
Download
 

Like This Post ♥