• Favicon.ico – What Does It Do?

    Date: 2011.02.22 | Category: WebDesign | Tags:

    Favicon.ico is the name of the graphic Internet Explorer 5+ uses in the address bar and when someone views their favorite bookmarks. There should be one beside the address of this page now if you are using IE5+. If you want to see favicon.ico in action among your favorites bookmark our site now by right clicking and selecting ‘Add to favorites’.

    Internet Explorer looks for this file in the same directory as the HTML page currently being displayed, if it cant find favicon.ico it will then display the default Internet Explorer icon in the address bar. As for viewing of favorites, IE will check its temporary folder to see if favicon.ico is there again, if it is not located it will display the default white background with a blue ‘e’ icon.

    For a webmaster there are three main advantages to using the favicon.ico ‘trick’.

    The first, is that it helps to brand your site with a nice little icon that is easy to recognize.

    The second, is that it makes your website more professional.

    The third, is that your entry will stand out in surfers bookmarks over the others. This is especially good as, if you can get a surfer back to your site then you have another chance at making a sale.

    Many internet users have a multitude of site bookmarks so, you need to use favicon.ico to give you an edge. I highly recommend using it and, now I’m going to tell you how.

    First, you will need to create an icon file which is exactly 16 x 16 pixels. If the icon is larger or smaller IE5+ will just ignore it. As for the colors in it, 16 is standard. You can use more colors if you want but, the more colors you use, the larger the .ico file becomes and, the longer it takes to load.

    You now know the standards the favicon.ico file has to be, now to actually create this file you can take one of two routes.

    The first is to convert and existing 16 x 16 BMP or GIF graphic with 16-32 colors into an .ico file using converter software making sure to save it as favicon.ico.

    You know the standards the favicon.ico file has to be, now to actually create favicon.ico . The easiest way of creating a favicon.ico file is to convert an existing 16 X 16 BMP or GIF graphic with 16 – 32 colors into a .ico file using converter software making sure to save it as favicon.ico.

    Once you have created your favicon.ico file all you need to do is to upload it to any directory on your server that contains html pages. This way, when IE5+ searches for favicon.ico it will be bale to find it regardless of which page you are on.

    That’s nearly all the areas of favicon.ico covers apart from, what if you want different icons for different parts of your website? Can this be done? The answer is yes it can. All you have to do is place the following HTML code between the <head> and </head> tags of your web page.

    <LINK REL=”SHORTCUT ICON” HREF=”differenticon.ico”> (SHORTCUT ICON should be kept in uppercase).

    Now when someone adds a web page with that code to their favorites, IE5+ will not look for favicon.ico but will look for differenticon.ico and if it’s there it will display it, if not the default icon will be displayed.

    Using favicon.ico or the SHORTCUT ICON code is nice way to add a unique touch to your site, and of course will result in more repeat visitors than if you were not using it – which is always good for any webmaster.

    Article Written By Le