The last few years I’ve been developing websites primarily using Firefox as the frontend testing environment. Developing for other browsers is another story! Don’t even start me on IE…
Are You To Used to Firefox?
Most developers on the web will tell you they use firefox as a means to debug and view there front end applications, in the last few months Google Chrome has come along with relatively no development extentions, but now after months of being out in the open, loads of them have poped up, even the ones your more accustomed to in firefox is now available on Chrome.
So today I bring you my Top 10 Google Chrome Extentions for developing web based apps/sites instead of using firefox, (Although slight variations between firefox extentions and Chromes will differ as will some functionality…)
Web Dev toolbar by Chris Pederick
The Web Developer extension adds a toolbar button to the browser with various web developer tools. This is the official port of the popular Web Developer extension for Firefox written by the same person.
Html Validator by robnyman
HTML Validator is an extension to validate the HTML code of the current web page. Click the icon, press the keyboard shortcut (see below) or have it run automatically to validate the current web page.
You can choose to get the validation results directly inline in the current web page, or open them in a new tab with the W3C validator results. It also supports validating local HTML, i.e.code in a page that is not globally accessible on the internet.
The extension badge will show the number of validation errors once validation is complete.
homepage
Eye Dropper – Color from page by kepicz
Eye Dropper and Color Picker extension which allows you to pick color from any webpage or from advanced color picker.
Eye Dropper DOESN’T work on Google chrome extensions web and because of Google strict policy it also DOESN’T work on local pages (starting with file://)
Eye Dropper DOESN’T work on image page (if you display only image not included on some page), it is bug in Google chrome #33015
Measure It by nirzoref
Draw out a ruler that will help you get the pixel width and height of any elements on a webpage.
Firebug Lite 1.3.0 beta by pedrosimonetti
Firebug Lite is not a substitute for Firebug, or Chrome Developer Tools. It is a tool to be used in conjunction with these tools. Firebug Lite provides the rich visual representation we are used to see in Firebug when it comes to HTML elements, DOM elements, and Box Model shading. It provides also some cool features like inspecting HTML elemements with your mouse, and live editing CSS properties.
For more detailed information, visit:
http://getfirebug.com/releases/lite/chrome/
IE Tab by Blackfish Software
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).
Lorem Ipsum Generator by niko.pufal
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.
Chrome SEO by Sean Banniste
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.
Speed Tracer (by Google) by speedtracer@google.com
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).
Webpage Screenshot by Amina
Fast&Simple extension to capture the whole webpage. Even long pages are saved in one image file. This extension lets you save PNG image of any webpage.
Just one click. Designers can choose to resize the window before capturing.
Your privacy is important, therefore this is a local extension.
It means that the extension doesn’t send ANYTHING to any server.
It can work even when there is no internet connection.
So… their you have it, my run down for the best extentions to use along side your chrome browser,
although until firebug is in the same league as its firefox counterpart then ill be sticking with firefox.
whats your thoughts? Leave your comments below..
