15 Must Have Google Chrome Extensions for Web Development

extensions

In this article you’ll find 15 Must Have Google Chrome Extensions for Web Development. It includes the best Google Chrome Extensions for any web developer which can greatly increase development speed, reduce debugging and testing time, and improve quality of the output. Here are the Google Chrome extensions that you should find very useful.

You may also be interested in one of these older posts
20 Awesome Firefox Add-ons For Web Developers
12 Indispensable Adobe AIR Apps for Web Developers
List Of Essential PHP Quick References And CheatSheets
10+ Rare WordPress Theme Options Page Tutorials To Get You Started

1. Pendule

pendule

Extended web developer tools for Chrome. Use this extension in addition to the built-in Developer Tools (Ctrl+Shift+I).

2. Chrome Sniffer

chromesniffer

Chrome Sniffer is a Chrome Extension allow web developer to inspect web framework / CMS and javascript library running on current browsing website. The extension will display an icon indicates the detected frameworks. Currently, this extension can detect up to 70 popular CMS and javascript libraries, and more will be added in future releases.

3. Chrome Web Developer Tool

ChromeWebDeveloperTools

This extension made easy the web development. Our current goal is to develop a clone of the “Web developer toolbar” of Firefox. If you want to give your contribute to this project, do not exitate to contact me.

4. IE Tab

ietab

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. 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 (i.e. file:// URLs).

5. Window Resizer

resizer

This extension resizes the browser’s window in order to emulate various resolutions. It is particularly useful for web designers and developers by helping them test their layouts on different browser resolutions.The resolutions list is completely customizable (add/delete/re-order).

6. Chrome SEO

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, PageRank Checks and other daily SEO tasks.

7. Xdebug helper

xdebug

Debugging and profiling PHP code with Xdebug is very powerful, but enabling Xdebug by setting a cookie or adding POST/GET variables is unnecessary hard. This extension will help you to enable/disable debugging and profiling with a single click.

8. Color Picker

colorpicker

Color picker is a full featured color editor which will make your life as a designer easier. It’s easy to use and loads fast, so it’s always there when you need it!

9. Lorem Ipsum Generator

loremipsum

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.

10. MeasureIt!

measureit

Draw out a ruler that will help you get the pixel width and height of any elements on a webpage.

11. Chrome Editor

chromerditor

I often find myself flipping between browser and a code editor. This extension allows you to code right within the browser. You also have the ability to save a code reference for later use. It saves it to your computer locally. I have predefined basic code to get you started coding.

12. CSS Reloader

cssreloader

CSS Reloader is an extension that allows you to reload all the CSS of any site without you have to reload the page itself.

13. Alexa Traffic Rank

alexa

Alexa Traffic Rank is Alexa Internet’s free extension for Chrome, and is the only extension that includes you in Alexa’s traffic panel. The Alexa extension accompanies you as you surf, providing you with Alexa data about the sites you visit without interrupting your browsing.

14. Aviary Screen Capture

aviary

Take a screenshot of any webpage and edit it directly in your browser with Aviary.com applications. Plus convenient access to the Aviary website and tools.

15. Instant Image Editor

imageeditor

Simply right-click any image or element on a web page with a background image while holding down the alt key to edit the image instantly in a new tab.