Google Chrome has been impressive till date with its light weight, quick startup & performance. Since its introduction, the most sought feature has been the availability of an extension system, the feature currently dominated by Firefox. Finally the extension system is there in beta with impressive 1000+ extensions already in the store after its launch in December 2009.
The main attraction of firefox is its customizable environment for the users to meet their tastes and requirements in terms of themes and plugins. As themes were already available with the chrome, the introduction of extension system brings it closer to firefox in terms of customization.
Here I am listing some of the chrome extensions available for web designers & developers.
Chrome Web Developer Tools
This extension aims at replicating the Web Developer Toolbar of Firefox.
Our current goal is to develop a clone of the “Web developer toolbar” of Firefox.
The functions it offers to web designers are some standard ones like validation, disabling CSS, hiding images, outline tables and showing images with an alt description etc counting to around 40 different features.
Download Chrome Web Developer Tools
Web Developer Mini
Web Developer Mini is a handy tool which offers easy access to validate your CSS and HTML, view the Page Source, in addition to giving you direct access to BrowserShots (a screenshot generating app).
Firebug Lite
This is the stripped down port of the firebug project to Chrome. Firebug Lite is a tool for web developers, that allows you to edit, debug, and monitor CSS, HTML, and JavaScript live in any web page. A similar functionality can be achieved by the inbuilt Webkit debugger.
Pendule
Pendule is a very useful extension that gives you a wide array of easy to use developer tools. Some of its features include: View Page Source, Color Picker, Display Ruler and Disable CSS. On top of that you also have some handy image tools: Hide Images, Show Alt Text, Show Dimensions and Show paths. And, to top it all off, it even has tools that will validate CSS, HTML and Feeds. The UI of this extension is fantastic
Chrome Sniffer
Chrome Sniffer is an extension that allows you to inspect the web framework/CMS and javascript library running on any website. The extension will display an icon indicates the detected frameworks. Currently, this extension can detect up to 45 popular CMS and javascript libraries
BuiltWith Technology Profiler
BuiltWith is a web site profiler tool. Upon looking up a page, BuiltWith returns all the technologies it can find on the page. BuiltWith’s goal is to help developers, researchers and designers find out what technologies pages are using which may help them to decide what technologies to implement themselves.
The BuiltWith Chrome Extension lets you find out what a website is built with by a simple click on the builtwith icon!
BuiltWith technology tracking includes widgets (snap preview), analytics (Google, Nielsen), frameworks (.NET, Java), publishing (WordPress, Blogger), advertising (DoubleClick, AdSense), CDNs (Amazon S3, Limelight), standards (XHTML,RSS), hosting software (Apache, IIS, CentOS, Debian) .
It will tell you what analytical tracking system they use, their Javascript library, server information; P3P policy, if any; advertising system and document information including which version of HTML and meta text.
Download BuiltWith Technology Profiler
MeasureIt
Draw out a ruler that will help you get the pixel width and height of any elements on a webpage.
Known issues:
- There is no support on Google extension gallery.
- There are some problems with Ubuntu. Hope to fix it soon.
Speed Tracer
Speed Tracer is a tool to help you identify and fix performance problems in your web applications. It visualizes metrics that are taken from low level instrumentation points inside of the browser and analyzes them as your application runs. Speed Tracer is available as a Chrome extension and works on all platforms where extensions are currently supported (Windows and Linux).
Using Speed Tracer you are able to get a better picture of where time is being spent in your application. This includes problems caused by:
* Javascript parsing and execution
* Layout
* CSS style recalculation and selector matching
* DOM Event handling
* Network resource loading
* Timer fires
* XMLHttpRequest callbacks
* Painting
* and more …
Eye Dropper
Eye Dropper and Color Picker extension tries to replicate Colorzilla on Chrome. The extension allows you to pick color from any webpage or from advanced color picker.
As of now there are two known major bugs, first is that sometime color is inexact and second that sometimes, part of screen show only black color.
IE Tab
Use Internet Explorer to display web pages in a Chrome tab. Some sites can only be displayed using IE, and with this extension you can now see those sites without leaving Chrome. The Extension is great for web developers who want to test the IE rendering engine, users who use sites with ActiveX controls, and users who want to use the explorer view for local files.
Chrome SEO
The Google Chrome SEO extension provides easy access to Search Engine Optimization Tools that can help you with Competitive Analysis, Keyword Research, Backlink Checks and other daily SEO tasks.
Chrome Flags
Chrome Flags displays a country flag indicating about the physical location of the websites you’re visiting. The extension also provides access to detailed information regarding the website’s servers, owners, traffic and trustworthiness.
Resolution Test
An extension for developers to test web pages in different screen resolutions, with an option to define your own resolutions.
Lorem Ipsum Generator
Chrome Extension that generates random “Lorem Ipsum” text. It uses a minimalist and well looking design.
Many other extensions of this type – in other browsers – simply complicate this task, using really extensive code, XHR, etc. The main purpose of this one, is to use the less amount of code (and also memory) and help the developer/user to get the job done.
Download Lorem Ipsum Generator
4 Responses to Ultimate collection of chrome web designer & developer extensions
-
Owais Lone Says:January 19th, 2010
Nice post. Anything like IE Tabs for Linux Chrome?
-
Ehsan Quddusi Says:January 19th, 2010
Unfortunately not yet. Hope for something in near future
-
Tom Says:January 23rd, 2010
I am using firefox, but reading this may change my browsing frame.
-
Justin Germino Says:July 17th, 2010
Awesome list of Chrome extensions and I was looking for equiv ones to replace some of my Firefox plugins.
