Sunday, December 13, 2009

The 'Favicon' - Making Your Blog More Professional

I’ve noticed quite a lot of blogs that do not have a favicon for their site. Actually, let me back up for a second….what IS a favicon???

Favicon stands for ‘Favorites icon’ and is a little 16×16 pixel image with extension of .ico that is used to represent your site in a web browser’s bookmarks/favorites menu. It will also show up in the tab next to your site name in your browser’s currently open tabs. To use this site as an example, if you look at the browser tab for this site you will see a little Ninja head icon on the left of the site name ‘Wordpress Ninja’. If you bookmark this page it will use that icon in your list of bookmarks in your browser.

While by no means essential they add a nice touch of class imho.To use a favicon properly you should first create the icon. There are several ways of doing it but ill suggest my preferred two methods:

i) create your image in Photoshop or other graphics app. Resize it to 16×16 and save it as a JPG or GIF file. Do not include alpha (transparency) yet. Download and use this program Irfanview which is a brilliant freeware application that will allow you to modify images and also to save out .ico files. Load your image into Irfanview and choose to save as a .ico file. In the options for the .ico dialog menu select if you want alpha transparency or not and save it. Now upload this .ico file to your folder root on your hosting webserver. This would be under public_html/ - it’s very important to get the location right or it won’t work. Test it out by opening your site in a browser. If it doesn’t work, clear your browser cache then try again. If you are using IE6 you need to first bookmark the site and clear your cache before it will show up right. If it still doesn’t work, place the .ico file in your wp-content/themes/ root folder.

ii) This method is much easier – go here favicon.cc and create or import your image to be used and export it out when done. Then upload to your server using the method in the above step (i).

That’s it, not too difficult and helps stamp your brand on your site, maybe sets you apart from other sites that don’t have one or don’t have a very good one