Favicon? It Very Simple!

What is a favicon?
A favicon, also known as favorites icons or website icons, is just a small image which is displayed for a website. It is often shown next to the address bar, in the favorites/bookmarks, and/or the taskbar. It is purely for looks, although it adds a nice touch to a website. Most modern web browsers automatically look for a favicon on every site you visit. If you have ever taken a look at your log files and seen a lot of requests for this missing file you will see what I mean (unless you are using one already). Not only will a favicon make your site look a bit nicer, but it will keep those (harmless) errors out of your log files.
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. The Microsoft Windows Shell also uses favicons to represent “Internet shortcuts” to web pages.If a particular site does not have a favorites icon, an image resembling a blank white page is often displayed.
Well, the first thing you’ll need to do is select an image that you’d like to use. Open your image editor and scale or crop it to 16×16 pixels or 32×32 pixels. (Other square dimensions may work, but those listed here are standard.) Now, for maximum compatibility, save the file as in the .ico format.
Or you can simply to generate your Favicon with Favicon Generator:

After you have created or generated your favicon and saved it to your computer, it must be renamed to favicon.ico (since the files this tool generates are given a random name). It’s very important!
The common method for using a favicon is to simply upload it to the root directory of your public web space. This is where most web browsers automatically look for it.
Just uploading the file is generally fine, but for the best support across various browsers, place the following lines in the head section of your HTML:

Be sure to add that code in all of your html files – not just the index.

Enjoy!

If you enjoyed this post, make sure you subscribe to my RSS feed!