Create a Web site icon

Applies To
OS:
IE:		 Win, Mac
4 or higher
Now and then you see the icon in the Internet Explorer address bar change from icon like this ie address icon to something else like this vbrad website icon. This normally happens when you place a site into Favorites. Ever wonder how this happens? 

Follow these steps to assign an icon to a web site:

  1. Create a standard windows icon 16x16. If you have to have 32x32 - that will work too (even though documentation says it won't), but 16x16 is better since this is how Internet Explorer displays them by default. Basically, if you use a 32x32 icon, IE will have to scale them down, thereby losing resolution.
  2. Rename this icon to favicon.ico
  3. Copy favicon.ico to the root of your web site.
  4. Test this by placing www.vbrad.com on your Favorites list.
  5. Note: the website must be on your Favorites list for the icon to show up. It will not show up if you are just casually browsing the site.
There is a another less-used method that allows you to assign an icon to a page. It requires IE 5.0 or Konqueror for KDE 2.1 (yep, out of all browsers this would be the one that you would expect not to support a MS-proprietary feature). This icon should be 16x16 or IE really will ignore it. Simply include the following inside your web page: 
<HEAD>
  <LINK REL="SHORTCUT ICON" HREF="http://www.vbrad.com/pageicon.ico">
  <TITLE>My Title</TITLE>
</HEAD>
Thanks to Dale Sampson for pointing out the second method.

Update (11/18/2002). The second method has now become the actual preffered way of displaying the page/site icon, even though it still is not supported by the dominant IE browser. Browsing the major sites (even some microsoft ones) with a supported browser like Mozilla will prove showcase this. Below is a partial list of browsers supporting the second method: