Skip to content

Learning from the best favicons

Last month I ran a couple of pieces about the increased importance of your site’s ‘favicon’. This little icon is now appearing in Google’s mobile results and I expect we’ll see it in the desktop results soon too. There’s been some discussion online about how to deal with this, and it’s clear that people think it’s another step in Google placing increasing importance on brands. The individual search results, in their own little panels leading with the site’s icon, now really appear brand-based.

Take a look at any search results on a mobile device and you’ll see that some sites’ favicons look much better than others. The display here is almost certainly smaller than the designer ever intended, and Google’s shrinking of the image to 16×16 pixels leaves something to be desired.

Perhaps more by luck than judgement, a few jump out of the page. We need to learn from these. The adverts are shown with a black ‘Ad’ in place of the favicon, so you don’t want your favicon to even vaguely resemble that; best advice is to use a bright colour, and get it down to something as simple as possible. Our ‘BMON’ logo, for example, may have some colour in it, but it’s looking very average due to having even a middling level of complexity.

Google says: “Your favicon should be a multiple of 48px square, for example: 48x48px, 96x96px, 144x144px and so on. Google will rescale your image to 16x16px for use in search results, so make sure that it looks good at that resolution. Note: do not provide a 16x16px favicon.”

The Moz blog noted: “Of course, like all changes, we don’t know how long this one will last. Like most major design shifts, we can assume that Google has been testing this one for some time, but if favicons are manipulated or abused to the point that automation can’t handle the problem, they may have to change course.”