Chrome Browser Extensions For Augmenting Your Site

Google Chrome is no longer a thing for the geeks but this minimalistic web browser has now become quite a popular choice, all over the world. This is not surprising in the wake of the remarkable job that Google has done in coming up with some excellent features that can blend in with your Google account.

Till now, the habitual IE or FireFox users were hesitant to give up their favorite web browsers as they found the integrated plug-ins or add-ons extremely useful. However, the Chrome extensions introduced by Google are the answer to this. These extensions have successfully replaced or replicated the functionality of plug-ins found in a typical browser.

Below given are a set of extensions that you might find useful:

HTML and CSS

Every developer who wants to use FileSystem API must have the HTML extension. This extension will help you browse the contents of your local Web filesystem along with giving you a clear idea of how much data the app can store. On the other hand, with CSS reloader, you will not have to reload the page itself while reloading CSS. All stylesheets can be reloaded via keyboard shortcut F9.

Debugging

With the Web Developer extension, your browser will have a toolbar button from where you can access various web developer tools. Also, Firebug Lite does not work as a substitute for developer tools but is used in conjunction with them. It is not only faster to load but also provides for browser toolbar integration.

Performance Tuning

Performance Tuning extensions enhance the speed of your web applications. Speed Tracer helps in the identification and fixing the performance of your web applications. This means that you will be able to have a clear picture of how the applications are using up your time. Also, YSlow analyzes the performance of web pages and gives suggestions to improve the same.

Fonts

The font extensions like WhatFont provides you with an easy and elegant way to inspect web fonts. You can do so by simply hovering over the web fonts. Additionally, it also helps you detect the services used in these web fonts.

Testing Responsive Resizing

The Responsive Inspector allows you to inspect page media queries. It is quite useful in the development of responsive web layouts as you can clearly see the resolutions that are defined in CSS. If you wish to test the responsiveness of design media queries, responsiView is your tool, which will allow you to test media queries in a new sized browser. With Resizer, you can quickly and easily change the dimensions of a website and test its design responsiveness. Finally, Window Resizer resizes the window of your browser so as to emulate different screen resolutions.

Images

Image extensions like Image Size Info and Simple Image Resizer helps you play with your Google images. The former is a simple extension which helps you view the height, width and size of images while the latter helps you resize photos and images, without compromising on the quality.

Testing Mobile Websites

The Mobile toolkit helps you in a page’s code validation, check its responsiveness with different mobile emulators and provide ways to improve compatibility. Mobile Tester emulates screen resolution and user agent so that you can test your web pages against mobile devices. Finally, User-Agent Switcher for Chrome is the answer for your need to switch quickly between user agent strings.

Google Chrome, with its new set of extremely innovative and useful extensions, is like a dream come true for those web developers who deal with responsive design and wish to enhance their productivity. With the help of the above given extensions, you will easily be able to design and produce a highly responsive website.

No comments yet.

    Sign in or sign up and post using a HubPages Network account.

    0 of 8192 characters used
    Post Comment

    No HTML is allowed in comments, but URLs will be hyperlinked. Comments are not for promoting your articles or other sites.


    Click to Rate This Article
    working