Thursday, December 14, 2006

Create Favicons for your website

If you a regular surfer on internet you would have probably seen small pictures or designs on the left hand side of the address of a website in your navigation toolbar. Like for example take Google website. when you type in on the navigation bar the first thing that you would see in the navigation bar is the favicon. For Google its looks like this

Some of the popular website favicons:
  • Yahoo
  • MSN
  • CNN
  • Youtube
Ever wondered how to create one of those favicons for your website. well let me help you in creating a favicon for you. first choose any picture that you like and save it your desktop for easy access. One suggestion would be to use the initials of your website address as the favicon. It makes sense as it matches your website address.

There are a number or free favicon sites that would help you in generating favicon's. Some of my personal favourite sites are
In the first site that i mentioned all you have to do is upload the image file that we discussed(to be stored in desktop) and click on the button enerate

Once the favicon button is generated a link appears below and you can either click the Download button or right click the image to store it on desktop

So now you would be thinking ok i have created the favicon so what to do next.....

For that you need to do two steps
  • Upload the favicon online
  • Add a link in your website
For the first step my personal favourite(if you dont own a webspace) i would suggest Its absolutely free and gives you free space to store files

once a page is created on the right hand side would be a column called Files Uploaded. Below that would be a link named upload.

click on the upload link and an address bar with a browse button appears above it. click the browse button and upload the favicon file

once the file is uploaded. you need to feed the address of this file in your webpage for the favicon to appear in your website.

So here is an example:

i have uploaded the favicon in my google pages with my username being tom1989 and the file name as test.ico

The address of my favicon wouldbe .Then insert this piece of code right below

And you are ready to go. Refresh the page and your favourite favicon will appear instantaneously. if you like my posts you can subscribe to my newsletter

No comments: