Create an animated favicon

Favicons are the small icon that you can see on the left side in the url field in the browser. It's really simple to create on of these actually.

(If you use Firefox you see that the icon is animated... we will talk about that later...)

First of all you need to create an icon and call it favicon.ico. An icon can be created with lots of programs and it is basicly a small image (16x16 pixels), in windows icon format. If you have photoshop or other graphics programs you might have a function there to convert into ico. If you don't I would recommend this great site for generating an icon from an ordinary image: Go to the site

Anyway, when you have your icon, rename it to favicon.ico and upload it into your web root.

Then add this code between < head > and :

<link rel="shortcut icon" xhref="favicon.ico" />
Remove the x from xhref to get it working!

This tells the browser to show your icon as favicon :-) Pretty simple right...

Different favicons

If you want to you can have one favicon for every page you have on your site. Just change the

Remove the x from xhref to get it working!

Animated favicons

Actually it is possible now to have animated favicons for some browsers. It only works right now for Firefox users. If you user Firefox, reload this page and look at the favicon to understand what I talk about :-)

If you want an animating icon you need to create and animating gif file and upload it to your file root. Then add this row after the first favicon row:

Remove the x from xhref to get it working!

Of course you can do exactly the same thing as with the ordninary favicon and show different icons for different sections. Just modify the file name :-)

(The site I refered to above can help you create an icon similar to the one I have at this site...)

A small bonus is that the ordinary favicon is shown in your bookmark list if you bookmark the site. This might be the extra thing to get more visitors, because they recognise your icon in their bookmarks...