I have found myself thinking many times about how to fit the meaning of a website into a small square about the size of push-pin. For a long time, this was just me being picky and wanting to put the finishing touch on a website. Now, it’s more about identity and ease-of-use than it ever has been.

With the increased popularity of tabbed browsing brought about by Firefox (and, common sense, in my opinion) favicon stock has gone up dramatically.

When I made my first site (the now defunct odinweb.net) I learned CSS and HTML over a spring break in 1999 mostly from w3schools and webmonkey. A part of that journey was a small article about favicons that I took rather seriously at the time, given its relatively unimportant role in a site’s design (mostly ornamental).

So if IE 5 saw this at the webroot it’d put an icon next to the bookmark for the page. Big fricking deal, right?

Enter Firefox, Opera, Safari. Out with 90 windows open, or maybe even just 5 if you’re using some online manual reference while you’re coding. We all pretty much agree that tabs are the way to minimize wasted screen space both in desktop applications as well as in web pages themselves.

So what happens when you have more than a few pages open? Your tabs get smaller and smaller until you can’t see what the hell you have open, right? The main identity of each open page now becomes their favicon and the first couple of letters in their <title> tag.

When I was browsing today I realized how much the Mozilla favicon sticks out, in its bright red, and how much my own favicon completely marks my own pages. It really makes a significant difference.

So if you are planning on making a website with a lot of return visitors that might be using tabbed browsing, think about the lowly favicon and how it can actually be king of the tab it sits on.

Some Favicon Resources

• webmonkey.com’s favicon article – the actual site I first encountered favicons on
• Favicon article by Ross Shannon – pretty decent guide
• Favicon @ wikipedia – the wikipedia page for favicons has pretty much everything you need, including a list of other resources

These stupid favicons are probably responsible for 50% of all 404’s.