How to use Favicons

Favicons are 16x16 icons used at the top of your browser. They are generally .ico files and it's one of the little details that makes your website a lot better. Ours looks like this:

So, how do you get a favicon on your own website?

• Make a 16x16 image. In any image editor, make a 16x16 pixel image. Make sure the background is transparent, as most browsers don't have white headers anymore. It's easiest if your image editor allows you do save as a .ico file, but if it doesn't, just save it as .gif or .png (make sure it's png 24), so you can convert the image here and keep the transparency.
• Upload the image to your home directory as favicon.ico
• Go to your domain host and change your favicon if the option is available.
• Add the following into the head of every page you want it displayed (easiest with PHP layouts; just add it to the layout files):
  <link rel="icon" href="favicon.ico" type="image/x-icon"> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
• You're done!
If you're using a CMS such as Wordpress, follow the first 2 steps and then see if your CMS has the option for a favicon.