Notice anything different?

Look closely. Very closely. You probably won't notice it right away, but today I made a favicon for my blog! What's that? Well, it's that little tiny picture that appears next to my blog URL on the top of the screen, and it also appears next to my blog name if you add this site to your favourites.


If you don't already have a favicon for your blog, I suggest you make one! It's simple, doesn't require any HTML knowledge, and, to be honest, is quite cute. Here's how:

Step 1:
Make an icon that you'd like to use for your favicon. It doesn't have to be anything elaborate, because the image is so tiny you probably won't see any detail. For mine, I simply used a coloured background and added a black "P". Paint is really good for this. Make sure to save your image on your computer! Oh, if you already have an icon that you'd like to use, feel free to use that. You only need to make one yourself if you don't have anything usable.

Step 2:
Click here to visit a favicon hosting site and upload your image. It gives you the option to download the icon, or to host it on their site. I recommend choosing the second option. Highlight and copy the code it gives you under the "Host it on IconJ (Direct link)" header.

Step 3:
Go back to blogger, sign in, and edit your blog's HTML. I suggest you copy and save your current layout before you change anything, in case you mess it up accidentally! Once you've done that, find the part in the code that looks like this, without the spaces:

< t i t l e > < d a t a : b l o g . p a g e T i t l e /> < / t i t l e >

It should be close to the top. Now, paste the code you copied earlier on the line directly underneath this.

Step 4:
Click on the preview button, just to confirm that nothing else was accidentally changed in your layout. Press save, and you're done!

Wasn't that simple? The whole process, including making your icon, should only take fifteen minutes or less. Enjoy your new favicon!

Credit: I was inspired by this blogger to create my own favicon.