make-favicon-ico

You'd be amazed at some of the simple things that people can't do computer / internet-wise. They can install Linux on their computers or set up a webcam security system but when it comes to simple basic things, their minds go completely blank!

So I've decided to go "back to basics" for a while, go through my Gmail archive, look at some of the email requests that I have received, and show Make Use Of readers some of the simple basic stuff.

One of the emails I get the most from people is how to create a "favicon" for their blog or website. In case you don't know what a favicon is, it's the little logo next to the website address in the browser. Make Use Of has one.

create-a-favicon

If you have a blog or website then creating a favicon is a very good idea. For a start, if someone has your site bookmarked in their browser then your favicon will also show in their bookmark list. This makes your link stand out from all the links that don't have favicons. Secondly, a favicon brands your site and gives it that extra professional look.

To give you an idea of how important a favicon is, just look at all the fuss that was made when Google changed their favicon! Some people can attach a lot of importance to what they see in their browser bookmarks and URL bar.

So here is your easy 3 step guide to making your own favicon. Hopefully without all the controversy that Google managed to stir up with theirs! You can only do this if you have your own self-hosted domain.

1. Decide what you want your favicon to be

This can be the hardest part. For big blogs like Make Use Of, it can be the easiest part if there is a logo which can be easily adapted. But if you don't have a readily available logo to use then you will have to give some thought as to what you want your favicon to be.

For my blog, I used the initials of my blog title- BTT. Before that, I had a Scottish flag and before that a Star Trek logo. Try to find something that represents you, that says something about you or your blog. Try to get something that you are not going to change either. You want something that people are going to remember. Then again, I'm not in a position to say that to you, considering how many times I changed mine! :-)

2. Create the favicon

how-to-make-favicon

OK, once you have your logo, now it's time to shrink it down to favicon size. First of all though, a little trick. If you decide to use letters for your favicon like I did, you can make it by typing the letters onto a MS Word document then when you have them the way you want them, make a screenshot of the letters using a screenshot app such as SnagIt or IrfanView.

To create your favicon, there are LOTS of favicon creators on the internet. We have profiled quite a few in the Directory here, here, here and here. The one I have always used and which has never let me down is this one.

As the site says, just upload your image to the site and it will create a smaller 16x16 version for you. This is done in seconds and you should make sure that the smaller version has an ".ico" file format.

3. Upload the favicon to your blog / website

OK, we're nearly there. You have your newly made favicon in your computer and now you need to get it uploaded to your domain so that when people come visiting to your site, they'll see your logo sitting on their browser URL bar. So how do you get it there? Very easy.

First of all, the favicon's location in your site has to be at http://yoursite.com/favicon.ico. So upload the favicon to your site using a FTP program or perhaps your hosting company offers their own uploading program? Just make sure that the favicon sits in the main root directory at http://yoursite.com/favicon.ico and at no other location, otherwise it won't appear when it needs to.

Next, go to the template of your blog and at the beginning of the template, you'll see a piece of code that says <HEAD>. Immediately after <HEAD>, enter the following :

Then save the whole lot.

Now one of two things will happen - your favicon will either appear instantly or it may take some time to appear. With my Scottish flag one, it appeared instantly and with my "BTT" one, it took 3 or 4 days to show up!! It's even worse with Internet Explorer. So after you've done the above, and you don't see anything, don't start to get angry and think "I've wasted all that time for nothing!". It WILL work eventually - it may just take a day or two for the favicon code to kick in properly. But when it does, it will work 24/7.

So does anyone have any strange and unique favicons that they would like to tell us about? What do you have sitting up on the URL bar when net surfers come to visit?