As some of you may have noticed, I now have a favicon for this site. This is something that I have had on my “to do” list for awhile and just finally took the few minutes required to get it done.

For those who do not already know what a favicon is, it is the little 16×16 image that appears to the left of the URL when you are viewing this site. It will also show up next to the site name in your bookmarks if you bookmark this site.

Some of the benefits of having a favicon are that it makes your site stand out a bit more when users have a long list of bookmarks and your site is on that list or when a user has a browser that uses tabbed browsing and your site is on one of the tabs. Many people say that having a favicon also makes a site look and feel a bit more professional.

If you would like to add a favicon to your site, it is not as complicated as you might think. All you need is a 16×16 pixel image (or you can take a larger image and scale it down to 16×16) with the name favicon.ico that you can put on your website. If you don’t want to make the 16×16 file yourself, you can use the Dynamic Drive FavIcon Generator to make the file.

To use this tool, simply browse to the image you would like turned in to your icon and click “Create Icon” and a preview will be generated. There are also options to create a 32×32 or 48×48 icon from the same image to use on your desktop if you so desire. After you see the preview, click on the button to download the icon and save it on to your computer.

Once you have the icon file, simply upload the file named favicon.ico to the root of your website and verify it is there by typing http://www.(your website here).com/favicon.ico and you should be able to see your favicon. Once this is complete, your favicon should begin to appear. However, to be sure the icon appears when users come to your site, there are two lines of code that should be inserted in the head section of your webpage:

<link rel=”shortcut icon” href=”http://(your website here)/favicon.ico”>
<link rel=”icon” href=”http://(your website here)/favicon.ico”>

After inserting these lines of code and double checking that your favicon appears when you type in http://www.(your website here).com/favicon.ico your favicon should begin appearing when users visit your website.