Do you often make updates to your site and wish you could change the look and feel in the live site without making changes to the site files? Google Chrome provides helpful extensions that when combined, allow you to achieve great changes to the site.
Below are a list of some very useful extensions and how you can use them to perform changes.
This extension is a wonderful addition for developers to cross browser check the look of the site in IE browser without having to installing the actual browser. Chrome will change the current tab being viewed to an IE tab.
The Eye dropper is an extension that allows you to obtain colors in Hex value from the current page being viewed. One of its features provides a history of the colors you have selected from a webpage; this is a great way to be able to reuse the color without having to use the eyedropper twice to know its value. The only restriction faced, was using the eyedropper on Google pages, since you are not allowed to retrieve any color from Google pages due to a Google Chrome policy.
This tool helps you get measurements in pixel width and height that can be very useful when making updates to a website. These changes can include changing the width of the entire website, an image or a container of contents, this being a table or a div.
This extension allows you to save a page and perform a crop, add text, lines and circles that help you illustrate the changes you would like the page to have. This can be a very useful tool to communicate between clients & designers as well as developers & designers. The tool also provides a back function to undo any of the additions made to the page. You can then right click and save the image as jpg.
This is an open source and a very user friendly tool, which allows you to change the styles of a website as well as remove content from the page. It allows the selection of tags and the ability to change their color, font size, location on the page as well as visibility. This is a tool that can come in handy when requested to make quick changes for review before implementing the actual change.
When combining some of these tools together you can create a great and fast work environment when it comes to making style updates to sites as well and saving a jpeg of the changes with comments on each of the changes. These tools can also help show clients how a few changes can make their site load faster, as well as explain in detail changes that will help the site be more search engine friendly.
Are you interested in trying another tool to track your website analytics? There is a new free tool, currently in beta testing, that helps you track your visitors in real time. That tool is called seevolution.
SeeVolution has many useful features to help you see the behavior of your visitors; they include an X-Ray feature that uses a heatmap technology, which allows you to track using an overlay layer of your site displaying the areas of the page with high/low user activity. Another feature is the Overlay Tool Bar, which focuses on site based data and user behavioral data. Seevolution also monitors the site for performance, up time and any malfunctions by providing alerts.
The service provided by Seevolution is not as detailed as Google Analytics or Mint, but it does provide a different view of how to see user behavior and a different perspective on how to view the analytics of your site by providing a toolbar within your site that allows you to track the information. The great thing about it is that you stay on your site, there is no going to a secondary site. I would recommend to use this tool as a secondary means of tracking analytics, since it does not provide as much information as you can obtain using Google Analytics or Mint.
Google has created a font API that allows a range of fonts to be use in websites. The types of fonts available can really transform a site and make it more attractive to users.
Google also provides a font previewer, where you can test how a font will look and help you decide if any of the fonts available in font previewer will work on your site, as well as customizing it. To implement one of these fonts all you need to add is a link to an external stylesheet and customize your site’s styles with the new font. You can view an example of how to set it up here.
Even though this API is still in Beta testing, it shows how impressive it’s use is, and how easily it is to set up. The only problem that will need to be faced is how fonts that are not open source, fonts you need to pay to use, will be considered in this API. Buying once, will allow anyone visiting the site to view that font and this could create a problem. Google only provides open source fonts, and they seem to work fine in most browsers, but questions about fonts that are not open source will soon be raised. Below you can view a font called tangerine, added using the Google fonts API and how it renders in 4 different browsers IE, Chrome, Firefox and Safari.
The flexibility allowed from this API can create sites with a more distinguished look and feel and also allow older sites currently using images to change those images and replace them with text, especially navigation items. This will improve the site’s SEO ranking as well as making any updates to the site easier and a lot faster.