This series is supported by Rackspace, the better way to do hosting. Learn more about Rackspace’s hosting solutions here.

As a web developer, you’re probably among the earliest adopters of new browser technologies. Google’s relatively new Chrome browser is one of those products that developers jumped all over as soon as it became available, but its initial lack of extensions was a dealbreaker for many.

Now extensions are supported in Chrome and some of the tools you’re accustomed to using in Firefox have become available, plus a few unique to Chrome. We’ve compiled a list of ten of the most useful Chrome extensions for web developers right here; if you use these extensions, you might even be able to make Chrome your main workhorse. Maybe!

Look at the list and give it a try — and if there are any great ones that we missed, be sure and share them with us and the other readers in the comments.

1. Firebug Lite

Arguably the most popular Firefox extension for web developers, Firebug lets you look at and edit the HTML, CSS and JavaScript of any page on the fly without leaving your browser. Firebug Lite is a scaled-down version of Firebug made for Chrome. You can inspect a page for errors then quickly edit to fix them.

Though Firebug Lite doesn’t have all the same features as Firebug, it has most of the essentials, and there’s a console interface for power users.

2. IE Tab

Microsoft’s Internet Explorer web browser is not at all popular with web developers, but it’s by far the most popular browser for the general population. With IE Tab you can open any website in a tab that’s actually running Internet Explorer instead of Chrome. You can make sure your website runs correctly for those millions of people who aren’t using Firefox, Safari, Chrome, or Opera.

3. Eye Dropper

With EyeDropper, you can find useful information on any color on a website you’re viewing in Chrome. Click the extension button and a color wheel interface drops down. From there, you can click the color picker button, then click anywhere on the site to see where the color for that pixel falls in the wheel, what its RGB levels are, and what its HTML color code is.

4. Chrome SEO

Tapping the Chrome SEO button after the extension has been installed will give you website information that’s important for search engine optimization. You can check backlinks, traffic measures like the Alexa Rank and Google PageRank, popularity on social bookmarking sites like Delicious, and more.

5. Lorem Ipsum Generator

The Lorem Ipsum Generator extension will generate filler text for your websites so you can make sure your formatting works well without wasting time typing several paragraphs of text. This extension is lightweight and minimalistic, so it’s easy to use and it won’t take up a lot of memory. That means it’s easy to pop in and out of as needed.

6. Resolution Test

Resolution Test’s purpose is right there in the name — it re-sizes the browser window to show what your website will look like at various popular screen resolutions. As a web developer, you probably have a very high-resolution display. Good for you! But most of the visitors to your site don’t; this extension will help you make sure the site’s formatting looks ok to them.

7. Speed Tracer

Speed Tracer uses the browser’s built-in metrics tools to record how much time your web application is spending on various tasks so you can find out what the hang-up is if your site is running slowly. It can tell you how much time the browser is spending interpreting layout, Javascript, and other details.

The only downside to this useful tool is that for it to work, you have to run the browser with the command line flag “–enable-extension-timeline-api.” But if you’re a developer, that’s probably not a big issue, right?

8. MeasureIt!

MeasureIt! is pretty straightforward — it gives you the dimensions (pixel width and height) of any element present in a website you’re looking at. Like a lot of the other extensions on this list, it was previously available for Firefox.

9. Pendule

Pendule pops up an easy-to-use, well-laid-out control panel full of miscellaneous tasks helpful to developers. Examples include reloading or disabling CSS, viewing JavaScript scripts, hiding images, a color picker, a display ruler, viewing source, and several script validators. It works well as your basic, catch-all web developer’s extension.

10. BuiltWith

BuiltWith gives you a profile of the website you’re hanging out at, including a list of all the technologies it can find there. It will tell you what widgets the site is using, which analytics tracker the webmaster is using, which frameworks are present, which advertising platforms are in use, and so on.

Rackspace is the better way to do hosting. No more worrying about web hosting uptime. No more spending your time, energy and resources trying to stay on top of things like patching, updating, monitoring, backing up data and the like. Learn why.

Tags: development, extensions, Google, google chrome, rackspace, web development series