Mar 06

Favicons: The Finishing Touch for Your Web Site

Attention to small details can add a nice finishing touch to a well-designed Web site. One such item is the site’s bookmark image, known as a favorite icon. The Favicon.ico file is a 16×16 pixel graphic that is displayed in the address bar and favorite list of Internet Explorer and most other popular browsers. It appears in a user’s favorites list after they bookmark a page on your site.

Strategically, a favicon can make your Web site stand out in a list of bookmarks and, if well executed, add an additional level of professional appearance to your site. The images shown here illustrate favicons from some hospital and well-known media Web sites.

Sites that don’t carry a favicon will display the familiar Internet Explorer “e” icon instead (if you’re using IE as your browser, of course). Also, if you don’t have a favicon, you’ll notice that your log files carry this error message:

/favicon.ico 404 file not found

In addition to the specific, small size, Microsoft’s technical specifications for a favorite icon include a limit of 16 colors in the palette. An icon editor is generally required to create a favicon. When completed a copy should be placed in your site’s root directory (some recommend every directory on your site). Alternatively, your HTML programmer can place code in the Head section of your pages or use other techniques to reference the favicon file.

Favicons are held in a browser’s cache, so they have a bad habit of disappearing. As you work with favicons, you’ll want a tool to restore these icons. The original tool developed for this purpose is the small utility FavOrg written by Patrick Philippot and available for a small fee from pcmag.com.

Some additional helpful sites regarding favicons:

Technorati Tags:

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>