What is a favicon?
A favicon (short for â€œfavorites iconâ€), also known as a page icon, is an icon associated with a particular website or webpage. A web designer can create such an icon, and many graphical web browsers â€”such as recent versions of Internet Explorer, Firefox, Mozilla, Opera, Safari, iCab, AOL Explorer, Epiphany, Konqueror, and Flockâ€”can then make use of them. Browsers that support favicons may display them in the browserâ€™s URL bar, next to the siteâ€™s name in lists of bookmarks, and next to the pageâ€™s title in a tabbed document interface.
The following are guidelines for displaying a favicon on your website:
linkelements must be inside the
headelement (between the opening and closing head tag) in the HTML.
- The image can usually be in any image format supported by the web browser, the major exception being IE, which only supports ico.
.icofile format will be read correctly by all browsers that can display favicons.
- Use the appropriate color depths (ICO: 16X16;4, 8, 24 bppâ€”i.e. 16, 256 and 16 million colors GIF: use 16Ã—16 in 256 colors PNG: use 16Ã—16 in either 256 colors or 24-bit).
- I have found that you do not have to place html on your website.Â You can just place a favicon.ico in the root directory of your website, but it may take longer to show up in some browers.
Creating an animated favicon
Animated favcons are easy to create.Â After following theÂ guidelines from above, you just need to create an animatedÂ gif and rename it: favicon.ico.Â It is currently not supported in Internet Explorer.
Examples of sitesÂ that have animated favicons: