favicon.ico how-to

Some of you have probably noticed that if you bookmark a site in Internet Exploder Explorer there is a small custom icon image for that site. In other browsers like Firefox, the icon shows up all the time (something that IE really should do but doesn't for some reason).

To create your own custom icon - this is how it's done:

First of all, that icon is called favicon.ico and it is saved in the root directory of your web site (where the home page index.html or default.htm is).

To make a favicon.ico, there are commercial tools out there to do it, but who wants to pay for a stupid little icon?! Sheez! My suggestion is to use png2ico, a FREE utility that will convert a PNG to an ICO file that you can use.

To those who don't know, a PNG is a high-color graphic, like a JPG. It's just a different format. Photoshop and Paint Shop Pro (my preference) will do PNG graphics. For those who don't have those and don't have any money, get GIMP for Windows. It also does PNG graphics.

At this point, download png2ico mentioned above and extract it somewhere. Then, get any graphic and size it down to 32x32. Save it as PNG to where your png2ico directory is.

-- Begin severe noob instructions here --
(if you're not a noob to Windows, skip this part)

PNG2ICO is a command-line program. You will need to launch a command prompt in Windows in order to use it.

In Windows 98/98/ME, this is done by clicking Start then Run then typing command in the box that appears then click OK. A black box will come up. This is a command prompt.

In Windows NT/2000/XP, the same is done by clicking Start, then Run, then type cmd and click OK.

Assuming you have installed png2ico at c:\png2ico, you get to that directory by typing cd\png2ico at the prompt.

-- End severe noob instructions --

Launch a prompt. Go to where you installed png2ico which is also where you saved your 32x32 PNG file you want to use as your icon.

Type this:

png2ico favicon.ico whatever_you_named_the_file.png

This will create your favicon.ico. Upload to the root of your web directory. Done deal. That's it.

Published 2004 Sep 27