Favicon Hints

Home

What are the current best practices for building favicons?

Currently we recommend the following:

  1. Create a 2 image favicon. One icon 32x32 and the other icon being 16x16. Both 256 colors (stick to Windows Default Palette). Reason: In some browsers, you can drag the favicon to the desktop where it becomes a link. Often, this desktop icon is 32x32 pixels.
  2. Name your file 'favicon.ico'. Reason: Some browsers search for this file by default.
  3. Place the favicon at the highest level of your site (in directory of your default web page - ie index.html).
  4. Use the LINK tag on every page: <LINK REL="SHORTCUT ICON" HREF="/favicon.ico">. Reason: Some browsers will not attempt to retrieve the favicon unless there is a LINK tag such as the one below:
<HEAD>
<LINK REL="SHORTCUT ICON" HREF="http://www.mydomain.com/myicon.ico">
<TITLE>My Title</TITLE>
</HEAD>

For the ultra-convservative: If you wish to be a little more conservative, use only the standard windows 16 colors. Some users have created 4 image favicons. 2 16x16 images and 2 32x32 images, having one image with 16 colors and one image having 256 colors keeping size constant. Of course, Have you ever looked at your web site at 16 colors? I doubt it looks that good. Some people believe that the systems tray only allows 16 color icons.