5 tips on branding

Favicons and your online brand

Favicons and your online brand

July 17th, 2017 – 8 Comments

Those used to tabbed browsing know why favicons are important. Your site will stand out from the rest if your favicon is recognizable. After all, a picture says more than a thousand words. Personally, I often find myself pinning websites in Google Chrome, still my browser of choice. As a to-do list, or simply because I want Gmail at hand anytime. Or that specific spreadsheet in Sheets. Or Facebook. That little favicon is the only reference to what site is hidden in that tab. You simply need a good favicon for your website.

New to SEO? Learn the Basics of SEO in our Basic SEO course »

Basic SEO training Info

Make your favicon stand out

You should make sure your favicon stands out from that long list of tabs. Check if it matches your logo and website well. Especially when you are not one of the big brands, you want people to recognize your favicon. Two tips directly related to that are:

  • avoid too many details in your favicon,
  • and please use the right colors, so the favicon doesn’t blend in with the gray of your browser tab.

Both are closely related to branding. Your brand should be recognizable in your favicon. Although we’re able to use more colors and more depth in our favicons nowadays, the fact is that the space available on that browser still hasn’t improved from the small 16×16 pixels it used to be in the early days. It doesn’t look like 16×16 pixels anymore, but that’s because we have better screens, not because that space increased. The main improvement is that lines are sharper and you can use all the colors you want.

Proper branding is making sure people will relate your favicon to your website immediately. I listed a number of favicons for you to test. Drop me a line in the comments about what favicon belongs to what brand:

favicons quiz

Too easy? In that case, these brands did a good job on translating their brand to their favicon.

SEO benefits of favicons

Are there real SEO benefits to favicons? Tough one. Besides branding, probably not, though opinions may differ on this a bit. One might argue that you can now add an image of 1MB as a favicon and that this will slow down loading times. You could say that a proper favicon highlights a bookmark and might increase return visitors. I have even found a story where someone stated that some browsers automatically look for a favicon and return a 404 if it’s not there.

My 2 cents? If there is an SEO benefit, it’s so small that all other optimization, like proper site structure or great copy, should always have priority. Does that mean you don’t need that favicon? Hey, didn’t you read that part about browser tabs? You do need it, even if it’s just to stand out.

WordPress just made your day: favicons in the Customizer

If you use WordPress, you might already know that there’s been a favicon functionality in WordPress core since version 4.3. So you can use this default functionality, without hassle. It’s located in the Customizer and is called Site Icon. In fact, WordPress recommends using this option to add a favicon. You don’t even need to create a favicon.ico file, like you used to, years ago. Just use a square image, preferably at least 512 pixels wide and tall. That seems to contradict with the recommendation to keep it as small as possible. But if you optimize your image, it won’t slow down your site :)

More information on how to go about this in WordPress is in the WordPress Codex. Go read and add a nice favicon to your own site!

Read more: ‘5 tips on branding’ »


8 Responses to Favicons and your online brand

  1. Hindi Shayari
    By Hindi Shayari on 25 July, 2017

    Yeah Favicon always show our web identity and thanks for the sharing amazing article.

  2. Sunny Kumar
    By Sunny Kumar on 25 July, 2017

    When I Create a Website, Favicon And Logo Were The First Thing I Always Look For..
    Well Thank For Writing This Post ? I Enjoyed Reading.

  3. John Smith
    By John Smith on 25 July, 2017

    I also use Favicon into my website. Thank you for writing about it.

  4. Android
    By Android on 23 July, 2017

    A 16×16 favicon won’t be of 1MB in size. Yes I agree that favicons are must to make your blog popular. Nice tips.

  5. sahil jangid
    By sahil jangid on 21 July, 2017

    Oooh………………great information Michiel…………..

    Really a good favicon helps you lots in many ways………….like: In SEO and in many places. thanks again Michael for sharing this amazing information with us and make us part of it.

  6. Christoph Daum
    By Christoph Daum on 19 July, 2017

    Another addition, a lot of browsers will still look for yoursite.tld/favicon.ico

    I’ve added a line to my .htaccess to avoid having to put the file outside of the theme.

    RewriteRule ^favicon.ico /wp-content/themes/your-theme/favicon.ico [QSA,L]

  7. Liton Biswas
    By Liton Biswas on 18 July, 2017

    Many of us ignore favicon. But think it’s something to recognize a blog. I didn’t add a favicon yet in my new blog “SharpBlogger”. Thanks for remind me.

  8. Luca Todesco
    By Luca Todesco on 17 July, 2017

    I normally pick an icon and then plug into a favicon tool to create multiple versions for different devices.

    As for its SEO benefit, I don’t think Google or any other search engine for that matter, uses it to rank webpages.


Check out our must read articles about User eXperience (UX)