IWorkInPajamas.com

Look up at the address bar in your browser. Go ahead…I’ll wait….

See that little green icon with the money sign in it? Cool, huh? It’s called a favicon. It’s kind of like a vanity license plate on a car: they don’t really serve a purpose, but they catch the eye, and they look pretty cool.

To make a favicon, you could visit a favicon generator website, where you could make a favicon with a few clicks of the mouse. The problem is: some of those sites are pretty stinkin’ spammy, and some of them will install spyware or malware on your computer. Not worth it, for a cute little picture on your website, is it?

You can easily make your own, in just a few steps.

• Choose a picture that you want to shrink down to use as your favicon. I suggest you find an image that is large and without much detail. If you have a photo of three kids, you’re not going to be able to tell what the heck it is once it’s shrunk down. Think simple and bright.
• Use a photo editor to shrink down your photo. I use irfanview. Resize the image to a size of 16×16 pixels (yes, that is pretty small).
• Save the new resized image with the name “favicon.ico” (without the quotation marks, Buster!). Note that this is being saved as a .ico file, NOT a .jpg or .gif as it was before.
• Upload the image (favicon.ico) into your public_html, or wherever your website files are located.
• Then put this code into style sheet, within the <header> </header> codes:
  <link rel=”shortcut icon” href=”/favicon.ico” />

That’s it! You’ve now got yourself a snazzy new picture in the address bar, and you did it yourself!