Have you noticed how some of your favorite websites have their logos next to their url in the browser? That’s called a “favicon” and I’m going to show you how to make your own.

First up you’ll need to have your website logo on hand. Don’t have one? You can use free tools like CoolText.com. Once you have your logo ready you’ll jump over to the tried, tested, and true (read: free and easy) tool for Favicon generation from DynamicDrive.

DynamicDrive’s tool has just a few limitations. It supports gif, jpg, png, and bmp formats. If you want a transparency then you can keep it with your .gif or .png formats. You’ll also be limited to 150 kB filesize.

I start with a 64×64 pixel avatar style icon and then let the favicon tool shrink it down to 16×16 .ico file for me. You can start with any size within the filesize limitation, but make sure it’s already square or you could get an odd aspect ratio squishing effect.

After creating your file you can save it to your computer and then using an FTP client (I prefer FileZilla) upload it to your root directory. If you’re running WordPress then that would be the same location as your wp-admin, etc. folders where you find other files like index.php, etc.

It’s that easy. Don’t be alarmed if you don’t immediately see your favicon show up next to the site address as this can take some time to appear. If you switch to a new browser that you don’t often use (I’m looking at you IE) then you might see it faster.

Congratulations. Now you’re one step closer to a more professional, authoratitive looking blog!

Did You Enjoy this Post? Subscribe for free to Problahgger updates

Related Posts on Problahgger:
  • No related posts
Recent Posts on Problahgger: