A favicon, short for “favorite icon” is the small icon (16×16 pixels) that appears in the tab of your web browser for a website. Ideally, each website has their own identifying favicon. I recently updated mine to go with my new color scheme. I typically keep it simple with my first initial “M”. Maybe one day I’ll get fancy and have an actual logo/icon for my favicon.
Go ahead and open up some new tabs with common websites you go to. Google, Yahoo, Facebook, Twitter, you get the idea. See how distinctive each tab is? Sure you can read the text, but you can also know by simply looking at the favicon. So here I am going to pick on a couple of websites… hate to do it, but you need some “non-examples” to get the idea of what happens when you don’t take the extra step to add a favicon. Check out ITWales.com, also take a look at BZA.com. I hope they spend more time and effort making your “Website Design” than they did on theirs should you decide to pay for their design services.
Now that you understand the importance of the favicon, how do you include it? WordPress has some fantastic instructions for adding a favicon to your wordpress hosted website. The process is similar for other websites. You simply create your 16×16 .ico image and then place it in the root directory as “favicon.ico”. If you don’t see it appearing in the tab, then you may have to add some code to the <head> section of your website.
<link rel="icon" type="image/ico" href="http://www.mysite.com/favicon.ico"/>Most default image creation programs don’t save as .ico. I believe Gimp is one of the exceptions. However, if you don’t want to go to the trouble of figuring out how to install a plugin for this, check out these websites that will convert png and other files to ico.