Adding A Favicon To Your Website
This tutorial is all about how to add a Favicon to your website using Adobe Dreamweaver, but should also be applicable to any HTML editor.
Introduction
A Favicon is the little icon that appears beside your websites adress in the adressbar, or the tab with your website on it(if your browser supports tabs, which most modern ones do). If your website doesnt have a Favicon, the default browser icon will be displayed(Internet Explorer: IE Logo, Firefox: Red Square with Dots, etc). Unfortunatly, Adobe Dreamweaver does not currently support adding a Favicon automaticly, you have to use HTML code for this. Dont be scared, adding a Favicon is easy.
Preparation
Your Favicon has to meet some requirements, first of all, it MUST be 16x16, and it has to be a .ico file. Unfortunatly, programs such as Photoshop do not support saving as a .ico natively. There are converters out there that allow you to convert a normal image(.jpg, .png, .gif, etc)to a .ico file. I recommend www.favicon.cc, it can import any image you like and save it as a .ico, and you can even create the icon right in the program. After your done creating the Favicon, click the "Download Favicon" button(this is assuming your using the recommended site), and save the Favicon to your web folder.
The Code
Now we can move onto the last step, inserting the favicon. Now, you can just leave the Favicon file in your websites root folder, or, if you want it more organized, put it in an images folder, or whatever you want. This tutorial assumes you are looking to organize your web folder. This doesnt make much of a difference, you only have to put the folder name(for example, "images")and a slash in front of "favicon.ico". Alright, lets get to the code:
<link rel="shortcut icon" href="images/favicon.ico" />
This code should be inserted just under your pages "title" tags.