Thursday, February 10, 2011

How to make a favicon for your website or blog

How to make a free favicon for your website or blog explains simply, the basic design and conversion issues needed to make a favicon for your site. This process is quite easy and importantly FREE.

A Favicon is also known as a website icon, URL icon, or bookmark icon. It is the little graphic that displays in the top left of the browser address bar, the sites bookmark and sometimes the tabs bar on the users browser window.

A favicon is a file containing an image or images usually at 16 x 16 pixels in size.

You can use any graphics program to make a favicon but you need to be able to see it magnified and at final size while you are working on it to get the best from it.

The 16 x 16 pixel image is a small size so there are some design issues to overcome.

I used Photoshop to design the icon for the site

Gold and

(you can see the enlarged version above).

To make a favicon work well it needs to be clear at 16 x 16 pixels so for a simple solution I chose the letter H for the logo. I viewed this at 100% magnification until it was readable at 16 x 16 pixels. Enlarging the image to about 400% made it easier to edit and work on the 2 layers I needed.