What is a favicon?

A favicon is a small, 16×16 image that is shown inside the browser’s location bar and bookmark menu when your site is called up.

From Wikipedia, the free encyclopedia –

A favicon (short for ‘favorites icon’), also known as a website icon, a page icon or an urlicon, is an icon associated with a particular website or webpage. A web designer can create such an icon, and many recent web browsers 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.

Some samples include the W for the Wikipedia site, G for the Google site, and a small tree for my own genealogy website.

Sample favicon from Wikipedia.

Picture of Google Favicon.

Tree Favicon sample.

You can create your own favicon with your graphics program or use one of the on-line generators.

Dynamic Drive Favicon Generator

Once you have created your favicon, save it to your website on your hard drive. You will then need to add it to your website on the server.

  1. Upload the file (favicon.ico) to your site. Verify That it is actually there by typing http://mysite.com/favicon.ico in the browser’s location, where “mysite.com” is your site’s address.
  2. Insert the code shown below in the HEAD section of your pages.
    <link rel=”shortcut icon” href=”favicon.ico” />
  3. Your favicon may not appear immediately after you’ve completed the above two steps.

It’s as simple as that. Make sure you you add the code to pages in another directory, that you adjust the path of the url.

Speak Your Mind