Personalise your users experience with the use of a favicon.ico file. Web browsers check to see if you site has a Favourites Icon which allows a user to easily identify your website in their favourites list. Some browsers; most popularly Chrome, FireFox, and IE 7+; show the icon in the tabs for easy identification.
This website uses a simple 100px*100px image created in minutes in Adobe Fireworks. The icon file was generated using this Favicon Generator. Although I generated mine at 32px*32px, currently the icons are rendered at 16px*16px. For this reason your graphic needs to be extremely simple, while easily recognisable to your users.
Upload the generated file to http://www.yourdomain.com/favicon.ico and it should work out the box. If you wish to store your icon under a different file path, the XHTML code for your <head> section is as follows:
<link rel="shortcut icon" href="http://www.yourdomain.com/path/icon.ico" />
…and in HTML:
<link rel="shortcut icon" href="http://www.yourdomain.com/path/icon.ico" ></link>
You may wish to include the shortcut icon meta data if your website audience will be using IE<6.
haha your code has vanaished
nice white boxes!
Do you ever sleep?
Brilliant – easy to follow and took me about 3 minutes from start to finish. Now I have a nice icon in browser tabs where many others still have a plain grey tab.
Cheers for the tip and keep them coming!