10 Fantastic Firefox add-ons for web designers and developers


1.Web Developer`s tool bar comes with his own tool bar that gives many useful tools for analyzing, validating and optimizing web-pages. The great thing about this plugin is that it’s on a few different browsers, so if you switch between them you will be able to use the same plugin on all.

2. FirePHP enables you to log to your Firebug Console using a simple PHP method call. FirePHP is ideally suited for AJAX development where clean JSON or XML responses are required. All data is sent via response headers. This means that the debugging data will not interfere with the content on your page.

3. FireFTP, Uploading files to a server has never been easier with FireFTP: this add-on installs in three clicks and adds an FTP client to your browser. It is the perfect tool to make a quick change to a website and test in the same application. Once you have created an account with your FTP address and credentials, you can drag and drop files from your computer to the server, or right click on a hosted file, edit it with your favourite editor, and update the file directly on the server.

4. ColorZilla add-on features an online eyedropper, which makes it quite simple to get the exact value of a specific color. With ColorZilla you can get a color reading from any point in your browser, quickly adjust this color and paste it into another program. In addition to color picker, ColorZilla offers a DOM color analyzer which allows you to locate elements on the page that correspond to a given color and find out the CSS rules that specify a certain color. ColorZilla also features a online palette viewer that allows choosing colors from pre-defined color sets and saving the most used colors in custom palettes. With this beautiful extension you can Zoom the page you are viewing and measure distances between any two points on the page

5. Page Speed is a browser extension (for Firefox and Chrome) developed by Google that analyzes a web page and tells you where improvements can be made to increase the site’s speed. It’s a great tool for testing a web design’s ability to render fast. Alternatively, you can use Page Speed Online, which is a web-based version of the add-on. You can also check out YSlow, which functions similarly to Page Speed.

6. ImTranslator, Online Translator performs real-time translation for Albanian, Arabic, Bulgarian, Catalan, Chinese (Simp.), Chinese (trad.), Croatian, Czech, Danish, Dutch, English, Estonian, Filipino, Finnish, French, Galician, German, Greek, Hebrew, Hindi, Hungarian, Indonesian, Italian, Japanese, Korean, Latvian, Lithuanian, Maltese, Norwegian, Polish, Portuguese, Romanian, Russian, Serbian, Slovak, Slovenian, Spanish, Swedish, Thai, Turkish, Ukrainian, Vietnamese languages and their combinations.

7. GreaseMonkey prepares your browser to support Greasemonkey scripts. The add-on puts a small monkey icon in the bottom right corner, from where you can add new scripts and manage the ones you’ve already installed. Other than that, it doesn’t include any configuration options. The first time you launch Greasemonkey you’re presented with an introductory website which contains basic information and a link to Userscripts, where you can download scripts. Be sure to bookmark this site, as Greasemonkey doesn’t include a link to it anywhere. Surely, you can also create your own scripts and use them with Greasemonkey – but that requires coding knowledge.

8. Screengrab allows you to take screenshots with much more flexibility. First of all you’ll be able to take a screenshot of the entire page you are visiting. That is, the screenshot will contain even the parts that were below the fold. Second, you can also manually choose a section for the screenshot, which is useful if you just want a small picture of the website to use in a blog post, for instance. Finally, you can choose if you want to save the screenshots to the clipboard or as a file.

9. Snapper allows users to designate an area of a web page for a focused snapshot, cutting out the additional work needed for cropping unecessary information. And starting with version 2.1, Snapper can also be used to capture a screenshot of an entire webpage, the visible portion of a webpage, or even a specific frame on a webpage.

10 YSlow add-on for firefox is a website performance checker by Yahoo. If you are a web developer then you need to check the performance of your website, loading time, page loading etc. YSlow is an add-on from Yahoo. This add-on gives you the complete test result of your website based on the bench marking set by Yahoo. It gives you the tips to optimize your web pages also. You can install YSlow by using the search function in Firefox’s Add-ons Manager, or you could also get it straight from YSlow page.After clicking the “Run Test” button, YSlow will start analyzing your site. A short moment later, it will present you the complete result with overall grades, individual grades and short notes about each items.The “Statistics” tab will show you the result in a more graphical manner. You can quickly compare the size of each components just by looking at the graph.

Leave a Reply