Information about favicon.ico

Question

Information about favicon.ico.

Answer

What is favicon.ico?

The favicon.ico is a small icon found in the URL address bar and on any bookmark created in Internet Explorer 5.0 and above and all other recent releases of Internet browsers such as Mozilla Firefox and Opera.

Microsoft Internet Explorer address bar

For example, as seen above the Computer Hope URL has a small icon (Computer Hope favicon example) in the front of the address.

How can I create a favicon?

The favicon can be created using any free icon generator or in a free online favicon generator such as favicon.cc. The file favicon.ico must be 16x16 in dimension - 16 colors and must be saved as an .ico file.

Finally, the file favicon.ico should be uploaded into the root directory on the server hosting your web page.

Can the icon be animated?

Yes, if the icon generator you're using to create the icon supports animation and the browser you're using to view the web page supports it this icon can be an animated. For example, if your browser supports an animated icon you should see that the favicon on this page is animated (fading the CH in).

Can the file be named something else, other than favicon.ico?

Yes, within your HTML code add the below tag in the <head></head> section of your code.

<link rel="shortcut icon" href="pictures/favicon2.ico">

This will cause the browser to look for favicon2.ico file and use it instead of the favicon.ico. If an older browser or a browser that does not support this feature is being used, the tag will be ignored.

In addition to using a different file name or directory the favicon can also be pulled from another website. For example, to use the Computer Hope favicon on your site you could add the below tag in your <head></head> section.

<link rel="shortcut icon" href="http://www.computerhope.comfavicon.ico">

Tip: All browsers today do not require this tag to be placed in every page you create as long as there is a favicon.ico file stored in the root (home) directory. We suggest using this tag only when you want a page to use a specific favicon or your web host does not support hosting .ico files.

What is favicon.gif?

More recent Internet browsers are adopting using favicon.gif in addition to favicon.ico. If you're a web site or blog developer we suggest not only having a favicon.ico, but also a favicon.gif file in your root directory and other sub directories to help prevent 404 errors in your server log.

Why is my browser not showing the favicon?

This can be caused by any of the below reasons.

  1. If you or someone else using your computer has recently cleared your Internet cache the favicons will be lost in many browsers because they're stored in this temporary cache.
  2. Page has not been loaded recently or the browser does not look in the proper location for the favicon. Try refreshing the browser page (pressing the F5 key on the keyboard is a common shortcut key for doing this).
  3. If you're the webmaster of a web page and are unable to get your favicon.ico to be displayed make sure the icon is stored in the root directory and if the page is stored in a folder or other directory try placing the favicon.ico file in that directory.
  4. Finally, earlier browsers have had other various issues related to the favicon.ico file. Make sure you're running the latest available Internet browser version for your operating system

Additional information

  • See the favicon definition for further information and related terms.