I like to use Chrome for all my web development work, I assume you are probably very familiar with Chrome and know that there are literally hundreds of Chrome extensions available for web designers, what I want to do is to let you know what Chrome Extension works best for me.
Advanced Rest Client
Advanced Rest Client – The web developers helper program to create and test custom HTTP requests.
Feed Intent Viewer
Feed Intent Viewer – Web Intent to view RSS and Atom feeds as pretty-printed XML.
Formerly known as ChromePHP, Chrome Logger is an extension for debugging server-side applications in Chrome.
DomFlags is a DevTools extension that allows you to create keyboard shortcuts/bookmarks to DOM elements so that inspecting can be achieved much quicker.
Validity – Quickly validate your HTML docs.
Flat Colors Guide
Flat Colors Guide – An extension for quick access to flat color schemes.
Web Developer Checklist
Web Developer Checklist – An essential checklist for launching a new site.
Dimensions is an open-source extension for measuring screen dimensions. It’s a handy tool for when you’ve been given a new graphical UI mockup; just open it in Chrome, activate Dimensions and start measuring.
45to75 is a simple character counter for optimizing line-length between 45 and 75 characters, thus ensuring that text line lengths meet their standards.
Minimalist Markdown Editor
The Minimalist Markdown Editor app is perhaps the ‘simplest and slickest’ Markdown editor currently available for Chrome. It allows you to view the markup as you type and also features a one-click HTML conversion tool.
Yes, there are many Chrome extensions available that allow you to test your responsive designs at different resolutions, this one just happens to be my favorite. Window Resizer does exactly what you would expect, it re-sizes the browser’s window in order to emulate various resolutions.
Sourcegraph allows you to browse Github code just as though you were using an IDE. It adds instant documentation and type tooltips to the code view on GitHub, and it also makes every identifier a jump-to-definition link.
jQuery Audit is a Developer Tools extension for easily auditing jQuery.
PHP Console is an extension that allows you to handle PHP errors & exceptions, dump variables and also remotely executes PHP code.
ModHeader is an extension that can add and modify the HTTP request headers sent to web servers.
The EnjoyCSS extension allows you to access all of the handy CSS3 tools from the EnjoyCSS website all within the comfort of an extension. You can create 2D & 3D transforms, multiple complex transitions, multiple linear and radial gradients, text shadows and everything else you can think of.
SnappySnippet will grab the CSS & HTML from any selected element and with just one click will send the code to either CodePen, jsFiddle or JS Bin for further editing/testing.
Fontface Ninja is an interesting extension that not only allows you to discover what fonts are actually being used on a website but also allows you to download them as well. The developers of this extension implore you to not abuse its functionality.
Type Sample is a tool for identifying and testing the web fonts from any page. You can edit the size, create your own text and also save your work. There’s also a bookmarklet available.
Google Font Previewer
Google Font Previewer is a handy extension that allows you to access the Google Font API directory and choose a font, and then either apply it to the entire page or a specified CSS selector.
This is the official extension for Google’s PageSpeed Insights app. It allows you to evaluate the performance of your web pages and offers suggestions on how to improve them. To learn more about PageSpeed Insights you should have a look at this post.
As I mentioned previously, there are hundreds of Chrome extensions available that will help your web design and development workflow, and I’m pretty confident that I have missed a few that you guys will probably deem essential. I would love to hear about them in the comments below.