Most people who use the Internet regularly are probably accustomed to seeing favicons, but chances are your average Internet user doesn’t know too much about them, other than where they’ve noticed them – if they have noticed them.
So before I go into why favicons are used and how to make them, here’s a brief review of what they are. When I use the term “favicon” I’m referring to an icon that is associated with a particular website, and which web browsers display in three places – next to:
Is it absolutely essential to have a favicon on a website? Of course not. But incorporating one into your design is one of those small touches that goes a long way towards improving the overall quality of a website, and it can also have a few smaller benefits for your visitors.
If my clients ask about it, I always tell them the little icon isn’t there just for looks. It has a subtle – yet important – role in building the brand on their website. When a visitor sees one on their website, that can be a strong indicator that they came to the right place – which can also be reassuring in a sense.
But using favicons also serves a more practical purpose as well, at least from your visitor’s perspective. How so? By saving people time when browsing the Internet.
It’s the same principle that applies elsewhere on your website. When you look at a web page, your eyes notice an image before the text surrounding it. So when I’m looking through my folders and folders of bookmarks, looking for the favicons of the websites I’ve filed away helps me find what I’m looking for that much quicker.
In the image I used above, you can see what I mean. When a website doesn’t use a favicon, your web browser will use a little blank page icon next to the website’s name in your bookmarks list. If you get enough of these in a column, then it becomes a bit tedious to sift through all of them to find the website you’re looking for.
But if a website does use a favicon, it makes it all the more easier and quicker to look through a list of bookmarks and find then one that you’re looking for, because your eye will notice the colorful favicons before it does the text of each bookmark’s name and the blank icons surrounding it.
A favicon is a special file that ends in an .ICO extention, so you can’t just use any old image. But you can design your own image and then use one of the many websites out there that can convert your image into a favicon.
Favicons are 16 pixels by 16 pixels in dimension, so you want to be sure that when you’re designing your icon, whatever your including will actually be readable. Again, this is why so many favicons are simply the logo of the organization or business.
Here are some places where you can upload an image and convert it into a favicon for your website:
So the next time you’re browsing through your bookmarks or your favorite websites, take a closer look and see if you can notice the favicons that are used. And if you have any other thoughts about favicons, share with everyone by commenting on the form below!