Favicons and your online brand: Make sure you stand out!

Favicons are those little icons you see in your browser tabs. When you have lots of open tabs in your browser it helps you recognize and find the page you were looking for or working on. Those favicons are important for your branding, even more so, because Google recently decided to add them to the mobile search results. So, let’s take a closer look at favicons and your branding here!

What is a favicon?

Not too long ago, you would only see those little icons, called favicons, in your browser tabs:

Which would help you find the tab you need when you had many open tabs in your browser. But, for some time now, Google shows those favicons in their mobile search results too:

favicon mobile search results

If your favicon represents a trustworthy brand, you can help people recognize it through this little icon, so you can boost the click-through rate to your site. After all, a picture says more than a thousand words!

Make your favicon stand out

You should make sure your favicon stands out, whether it’s from that long list of tabs or the search results. 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;
  • 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. Proper branding is making sure people will relate your favicon to your website immediately.

As to which format and size to use for your favicon you best stick to Google’s guidelines for favicons. This is what they recommend:

Your favicon should be a multiple of 48px square, for example: 48x48px, 96x96px, 144x144px and so on. SVG files, of course, do not have a specific size. Any valid favicon format is supported. 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.

SEO benefits of favicons

Are there real SEO benefits to favicons? Well, the advantage of favicons certainly became bigger now it’s present in the mobile search results. While adding a favicon won’t make your page rank higher directly, it might increase the click-through rate to your page, when it is shown next to your URL in the search results. But, beware: this only works if your favicon is associated with a positive feeling regarding your brand or website. In practice, this means you should invest time in holistic SEO: making your website (and product/service) awesome in every way!

Favicons in WordPress

If you use WordPress, you might already know that there’s been a favicon functionality in WordPress core ever since version 4.3. So you can use this default functionality, without hassle. It’s located in the Customizer and is called Site Icon. Here, you can read how to change your site’s favicon in WordPress, step by step.

Final note: when you upload your icon, don’t forget to optimize the image, so it won’t slow down your site :)

Read more: 5 tips on branding »

Make Yoast SEO & Woo work together smoothly

  • Make your products stand out in Google
  • Get more buyers to your online store
  • Make products easier to find on your site
  • Have a cleaner XML sitemap & more
More info

8 Responses to Favicons and your online brand: Make sure you stand out!

  1. Hindi Shayari
    Hindi Shayari  • 2 years ago

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

  2. Sunny Kumar
    Sunny Kumar  • 2 years ago

    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
    John Smith  • 2 years ago

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

  4. Android
    Android  • 2 years ago

    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
    sahil jangid  • 2 years ago

    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
    Christoph Daum  • 2 years ago

    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
    Liton Biswas  • 2 years ago

    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
    Luca Todesco  • 2 years ago

    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.