I’m sure there’s many of you out there who wanted one, even if you don’t know exactly what it’s called! 😀
What is the FAVICON?
FAVICON is that little image that commonly appears right in front of the Address / URL bar of any web browser, just before the HTTP part. As you can see the FAVICON for goldfries.com is that little black square with some orange artsy curves.
Have a look at your browser’s bookmark, the list of sites are very likely to have their icons shown there as well. As you can see it’s a very useful way to locate your favourite sites in your bookmark, it’s like it carries the image of the site. 😀 Good to have one, isn’t it?
How to make one
A FAVICON file is an image that is 16×16 pixels in dimension, saved under ICO format with the .ico extension. Most people just name theirs “favicon.ico”.
If you don’t, then there’s this really cool web-based ICO conversion service at HTML-Kit.
After acquiring your ICO file, the next step is to upload it to a host where you could call it from your website.
The HTML for calling the FAVICON is very simple.
<link rel="Shortcut Icon" href="your.ico" />
Simple, right? It should work as long as it’s on the root folder of your website. In case it doesn’t work, you could use the full URL
<link rel="Shortcut Icon" href="http://www.yoursite.com/your.ico" />
If you’re unclear of the location of the file, just keep on trying and do remember to clear the cache.
Have fun creating your own FAVICON!