A fav… what???

Put simply, a favicon is that little logo you see next to the web site title in your browser tab bar and bookmarks list. Think of it as a graphical fingerprint for the site.

A favicon :

• makes your site look more professional.
• visually tags your site in bookmark lists and browser tab navigation.

The Wiki entry reads…

A favicon (short for favorites icon), also known as a website icon, shortcut icon, url icon, or bookmark icon is a 16×16 pixel square icon associated with a particular website or webpage. A web designer can create such an icon and install it into a website (or webpage) by several means, and most graphical web browsers will then make use of it. Browsers that provide favicon support typically display a page’s favicon in the browser’s address bar and next to the page’s name in a list of bookmarks. Browsers that support a tabbed document interface typically show a page’s favicon next to the page’s title on the tab. The Microsoft Windows Shell also uses favicons to represent “Internet shortcuts” to web pages.

You can wade through the wiki page or follow the easy guide below to make your own now.

Create a favicon by uploading an image to the following site….

http://tools.dynamicdrive.com/favicon

You will need to have some idea of what you want you favicon to look like, and I recommend the use of a transparent background on your image, otherwise you could get an unwanted border around the icon.

Crop the image to best capture what you want to have as the icon. In my case I decided to use the E in Enci. Here is the result.

Next, upload the generated file (“favicon.ico”) to the root of your site. Verify it’s there by typing in your browser: http://yoursite.com/favicon.ico

Finally, insert the following in the HEAD section of your pages:

<link rel="shortcut icon" href="favicon.ico">
<link rel="icon" href="favicon.ico">

Done, and Done.

There you have it.. easy. No software to download, just a few minutes work and you should have a nice visual tag. Go make yours now and tell your friends! RUN!!

Note: It can take a little while to appear in your browser, be patient. It will appear.