--
Published on Thu, Jun-17-2010 by Dainis

30+ Substantial Firefox Addons for Web Developer


Here is a very useful list of Firefox Addons for Web developer. Firefox is very easy to use and also powerful and popular web browser. It is also my favorite web browser and Firefox use most of the web designers and developers. Why? One of the reasons is the huge amount of Firefox Addons that facilitate the work of web designers, for example, with some Addons you can check errors on your website and with others you can check how your website will looks at other browsers and with different screen size. For this reason, today we give you ultimate list of most important Firefox Addons for Web developer. Totally is this list we include more than 30 extremely useful Firefox Addons.

You May Be Interested In The Following Posts


JSView

All browsers include a “View Source” option, but none of them offer the ability to view the source code of external files. Most websites store their javascripts and style sheets in external files and then link to them within a web page’s source code. You can use the JSView extension to solve the problem. You can access it from the context menu, from the toolbar, from the view menu, or from the status bar.

JSView

CS Lite

This extension will allow you to easily control cookie permissions. It can be accessed from the statusbar, a toolbar button, or the context menu. Just click on the icon to allow, block, or temporarily allow the site to set cookies.

CS Lite

FirePHP

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 a set of X-FirePHP-Data response headers. This means that the debugging data will not interfere with the content on your page.

FirePHP

FireFTP

FireFTP is a free, secure, cross-platform FTP client for Mozilla Firefox which provides easy and intuitive access to FTP servers. Along with transferring your files quickly and efficiently, FireFTP also includes more advanced features such as: directory comparison, syncing directories while navigating, SFTP, SSL encryption, search/filtering, integrity checks, remote editing, drag & drop, file hashing.

FireFTP

OperaView

OperaView is Firefox addons that lets you check how your website looks in Opera browser. This addon open pages in Opera from Firefox context menus.

OperaView

Codetch

Get the feel of Dreamweaver in a Firefox extension. Edit your documents right next to your web pages as you surf.

Codetch

Screengrab

Screengrab saves webpages as images. It will capture what you can see in the window, the entire page, just a selection, a particular frame… basically it saves webpages as images – either to a file, or to the clipboard.

Screengrab

IE Tab

IE Tab – an extension from Taiwan, features: Embedding Internet Explorer in tabs of Mozilla/Firefox. 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.

IE Tab

FireShot

FireShot is a Firefox extension that creates screenshots of web pages (entirely or just visible part). Unlike other extensions, this plugin provides a set of editing and annotation tools, which let users quickly modify web captures and insert text annotations and graphical annotations. Such functionality will be especially useful for web designers, testers and content reviewers.

FireShot

Web Developer

The Web Developer extension adds a menu and a toolbar to the browser with various web developer tools. After installing the extension there is a ‘Web Developer’ menu under the ‘Tools’ and context menu of the browser, as well as a new toolbar. 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.

Web Developer

GridFox

Draws a grid on top of a website. This is useful for checking designs that are supposed to follow a grid-based layout. Right click anywhere on a website, and go to GridFox > Toggle Grid. In the bottom right, you’ll see some buttons to help you create, edit and save a grid. You’ll also see some arrows which let you browse any existing grids for the site you’re looking at.

GridFox

ColorZilla

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.

ColorZilla

CodeBurner for Firebug

CodeBurner is a Firefox add-on that integrates with Firebug, to extend it with reference material for HTML and CSS. The extension’s core functionality is centered around a new Reference panel, which contains a search tool for looking up HTML elements, attributes, and CSS properties.

CodeBurner for Firebug

Modify Headers

Add, modify and filter http request headers. You can modify the user-agent string, add headers to spoof a mobile request (e.g. x-up-calling-line-id) and much more.

Modify Headers

Html Validator

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.

Html Validator

Firebug

Firebug integrates with Firefox to bring a wealth of development tools at your fingertips, while you are traveling on the network. You can edit, debug, and view CSS, HTML and JavaScript in real time on any page in the network.

Firebug

YSlow

YSlow analyzes web pages and suggests ways to improve their performance based on a set of rules for high performance web pages. YSlow is a Firefox add-on integrated with the Firebug web development tool. YSlow grades web page based on one of three predefined ruleset or a user-defined ruleset.

YSlow

EditCSS

EditCSS is a stylesheet modifier for sidebar. EditCSS makes this part really easy and well as intuitive attributed to its approach. It come with features like live inline previewing of styles and a unique grouping system, which is providing a lot of competition in this field because EditCSS is a bargain.

EditCSS

Open With Photoshop

Open With Photoshop is a new companion for web designers, graphic designers and in general whom like to use Photoshop. Open With Photoshop send any web image via right click context menu to the Photoshop. It is valuable tool for time saving.

Open With Photoshop

Rainbow

Color tools for web development. Colors can be tried out on websites by dragging a color area from the picker, inspector, or library to webpage content, or by selecting an element to paint with the color picker. Color values can be viewed in hex, rgb, and hsl CSS formats.

Rainbow

Font Finder

FontFinder is created for designers, developers and typographers. It allows a user to analyze the font information of any element on a page, copy any piece(s) of that information to the clipboard, and perform inline replacements to test new layouts.

Font Finder

Professor X

The Professor X Extension let’s you see inside a page’s head without viewing the sourcecode. When applied to a page it will display the contents of the page’s head element, including Meta, Script and Style content. This can help you see how a website was constructed without having to go back and forth between the sourcecode and the page in your browser.

Professor X

View Source Chart

Source Charting is a User Interface useful for navigating the DOM at lightning speed. It is also an excellent visual aid for those learning HTML. View Source Chart users can take advantage of a built-in browser feature (Ctrl + -) which results in zooming out of Source Charts.

View Source Chart

Domain Lookup

Domain Lookup is a Firefox extension that helps you discover valuable domain names while surfing the web. 60+ popular domain registrars are already supported.

Domain Lookup

ColorSuckr

This Add-on allows you to right-click any image on the web and extract the 12 most common colors from it. You can then build color schemes from the results as well as many other features on the ColorSuckr website.

ColorSuckr

Window Resizer

Resize your browser to various standard resolution sizes. 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.

Window Resizer

Total Validator

Perform multiple validations and take screen shots in one go. This 5-in-1 validator works with external, internal, or local web pages using the Total Validator service or local copy of the desktop tool.

Total Validator

MeasureIt

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

MeasureIt

Aardvark

Cool utility for cleaning up a page (for printing or better viewing) as well as for web development. Displays a red rectangle on the element under the mouse — hit “w” to go wider (get the containing element), then hit other keystrokes to remove

Aardvark

Poster

A developer tool for interacting with web services and other web resources that lets you make HTTP requests, set the entity body, and content type. This allows you to interact with web services and inspect the results.

Poster

Load Time Analyzer

The Load Time Analyzer allows developers to measure and graph how long web pages take to load in Firefox. Load Time Analyzer produces graphs that show the occurrence of events such as requests for the page, images, stylesheets and scripts, along with events like the execution of an onload script.

Load Time Analyzer

LinkChecker

Check the validity of links on any webpage.

LinkChecker

View Dependencies

View Dependencies adds a tab to the Page Info window, in which it lists all the files which were loaded to show the current page.

View Dependencies

W3Techs Website Technology Information

The W3Techs extension shows with one mouse click which web technologies the current site is using. The technologies shown include content management systems, server-side and client-side programming languages, JavaScript libraries, markup languages, character encodings, web servers, operating systems, traffic analysis tools and advertising networks.

W3Techs Website Technology Information

Advertisement


8 Responses

  • mike say:

    Have you ever used Google’s Page Speed? I’ve never seen it mentioned in any of the these “15+ plugs every web developer needs”

    http://code.google.com/speed/page-speed/

    You need firebug as it adds more functionality.

    1
  • Kent Tan say:

    Cool list of addons. You know, i’m stuck with firefox because of some of these awesome addons – measureit, colorzilla, firebug. Can’t do without them!

    2
  • Joynal Abedin say:

    Really great collection of Forefox addons for web developer. I am interested in Link Chcker, Window Resizer….

    3
  • Pixelbox Design say:

    Excellent Article, Added to favs, keep up the good work.

    4
  • Player Profiles say:

    Maybe you could make changes to the page subject 30+ Substantial Firefox Addons for Web Developer – Psdeluxe to more better for your subject you write. I enjoyed the blog post withal.

    5
  • Sliding doors interior say:

    Great post! I’ll be sure to add a link to this article… Check out my site if you like…

    6

Leave Your Response

About PsDeluxe

Psdeluxe is a Design blog dedicated to mainly Photoshop lovers and enthusiasts. We regularly update blog with free and easy to learn free Adobe photoshop tutorials, useful freebies for design projects, powerful tools that will make your work easier and we publish showcase of most beautiful and interesting designers works around the work that hopefully will inspire. Learn Adobe Photoshop techniques with us. Talented and professional designers are always welcome to join our author team. Feel free to subscribe to our Rss feed to be first who get all valuable information for designers.



     Hostgator Coupons | ThemeLabs | MaxReview theme | Review themes

Recommended Links



Wordpress review theme