Graphically Enhance Your URLs
Jun 9th, 2011 by Jenn
You spend a lot of time working up a look and branding for your sites online. Why not add a little extra personalization through the use of Favicons?
Favicons are those small images you see in the address bars and in bookmark lists linked to a specific url.
Microsoft introduced the favicon as a 16 x 16 pixel image saved as a Windows icon file and located in the root directory of a site. The favicon continues to evolve and is adopted by more and more browsers. In fact most modern browsers automatically look for a favicon file when pulling up a webpage. There is even a movement to have favicons used as a universal av for blog posts and on boards, replacing the gravatar system.
Although the ico file is still the standard for favicons more browsers are allowing the use of gif and png files as well. The Mozilla web browser for example added support for favicons, in a way that conformed to web standards and let web designers add favicons in any supported graphics format by including the following into the head section: <link rel=”icon” type=”image/png” />
Many other web browsers have since added support for this feature. But, it is still a good idea to also have the file called favicon.ico in the site’s root directory which will still be found by those browsers which do not process the link elements(Windows IE). The root directory is the same one that holds the main index.html file for your site.
Have multiple sites on a single domain? You can even have seperate customized favicons for each section! Say I want my art logo on the gallery pages, my leaf logo on the family blog and my business logo on the store pages. I can do this with favicons. Simply put in an alternate image name in the reference section by using the call http://example.com/icon2.ico where icon2 is a different image than favicon.ico which is used by the rest of the site.