When it was introduced in 1999 by Internet Explorer, Favicon was not an essential component for websites.
But over time, this small 16×16 size icon that appears on the browser tab is sort of becoming an important SEO factor, not only for designers but also for SEO professionals. Shall we find out why?
What Is a Favicon?
A Favicon is a small icon that you can use on your Website to help the users identify your tab easier when they have multiple ones opened. Of course, this has little impact on SEO.
But things started to change in late 2019 when Google began using the Favicons when displaying the search results on mobile devices.
Recently, Google even launched a version of the desktop result, which had Favicon. However, they reverted back the change after people complained of clumsy design.
However, Google continues to test Favicons on its desktop results, and sooner or later, they will roll it out with minor tweaks.
If you look at other search engines such as DuckDuckGo, you can find Favicons in both desktop and mobile search results.
What Is the Use of Favicon?
Of late, websites have been using Favicons as part of the strategy to increase the click-through rate.
Some highly recognized brands benefit from it as it becomes easier for the users to identify and visit a popular brand with the icon displayed.
And of course, with people now opening an average of 10-11 tabs on their Browser, Favicon definitely serves its purpose.
Some people mistake favicons for logos. 99% of the time, the logo is converted into a favicon, but it’s saved in a different location. Also, it’s smaller than the conventional logo size.
Where Can You See the Favicon?
Consider Favicon as a feature that helps the users identify your Website from a host of others. That means it’s visible on all browsing features where your Website has found a place.
1) Search Results
3) Browser Tabs
4) Toolbar Apps
5) Browser History
6) Search Bar
Why Are Favicons Important?
In this new era, businesses should create a favicon. It’s a small but vital step to setting up a business website.
Favicons are an excellent way to convey your brand online and make your Website look more professional.
They serve as visual indicators for Websites, enabling an easy and quick way for the visitors to find your page when there are multiple similar tabs open.
SEO Benefits of Having Favicons
As I mentioned before, Favicons are not directly responsible for better rankings on search engines. Let me reiterate that it’s also not a ranking factor!
But a Favicon can definitely help in SEO.
- As you know, the websites that get a high click-through rate and dwell time always get the upper hand in SERP rankings. A website with Favicon on the search result is bound to get more click than the one which doesn’t.
- When users can identify your Website inside the bookmark, history, or among multiple tabs through the Favicon, it increases the interaction, and the users are not distracted by other websites that may be offering similar information as yours.
- Favicons help in branding your Website. Users are made accustomed to your brand logo, and this tends to trigger brand recollect. When they see the logo next time while searching on Google or within multiple browser tabs, they have the tendency to click on it. Provided they were happy with the first experience offered by your Website.
How to Create Good Favicons
Favicon is a small yet essential image. It should be simple and recognizable for your audience. It is important that the Favicon leaves a lasting impression on users because it will help them identify your brand later.
Here are some tips to help you produce the best Favicon possible.
1. Make It Attractive and Recognizable
Until recently, Favicons just had to be identifiable to the users who land on one of your pages. But this has changed with search engines starting to show the Favicon on search results pages.
It’s now necessary to make the Favicons both attractive and recognizable. When a user finds your search result with an unrecognizable or unrelated Favicon, it may deter them from clicking your results.
Also, when the top competitors appear with better Favicons, the users are naturally attracted to them. Since this happens even before they visit your page, it’s essential to develop an attractive Favicon.
2. The Best Favicon Is Your Logo
The purpose of having a Favicon is to create a connection between your Website and the users. With the rise of the internet, users are now accustomed to identifying a brand using logos.
Since your website’s logo is the best identification symbol that you can provide to the users, it’s recommended to use the resized version of your logo as Favicon.
3. Avoid Text
The Favicon is a 16×16 size image and trying to add Text inside it serves no purpose because the users cannot read it. Also, adding Text reduces the real estate of the logo, which will further reduce the Favicon’s clarity.
4. Don’t Use a Photo
Using a photo as Favicon is a bad practice as photos are not intended to be so small. A 16×16 size photo will look blurred and the users will never be able to recognize what is inside it, which means you lose the benefit of having the Favicon.
5. Consider Dark Mode
We have seen an increase in the number of browsers supporting dark mode. Chrome browser, for example, looks pretty cool when used in dark mode, and most of the users are adapting to the change because it’s less stressful for the eyes.
So, consider creating two versions of the Favicons to support both light and dark themes. You may need a little bit of coding help to implement this. Check out this page to know how to enable dark Favicon.
If coding is not your forte, just keep the Favicon transparent so that it doesn’t look awkward on dark themes.
How to Show Favicon on Search Results?
Here is what Google Recommends website owners to do if they want Favicons to appear in search results.
Step 1: Create a favicon.
Step 2: Add a tag to the header of your home page with the following syntax:
The URL of the Favicon. It can be a relative path (/smile.ico) or an absolute path (https://example.com/smile.ico), but it must be in the same domain as the home page.
Note: Earlier, it was mandatory to use the .ico file name for the Favicon, but now all browsers support .png .svg formats.
Is the favicon not showing at Google Search? Here are Google’s Guidelines
Not all Favicons will show up on search results, even if you have implemented the right steps.
Google says showing a Favicon on SERP is under its discretion. In the majority of the cases, following these guidelines will make a website automatically eligible for Favicons.
1. Favicon file and the home page must be indexable for Google crawlers.
2. It must be unique to your brand and should help users identify your Website.
3. You can use square sized icons of size 48x48px, 96x96px, 144x144px and so on. Keep in mind that Google doesn’t recommend 16×16 Favicon, possibly because of the low resolution. However, it resizes all the high-res favicons to 16×16 while displaying them on the search results page.
4. The Favicon URL must not be changed frequently.
5. Google will not show any favicon that it deems inappropriate, including pornography or hate symbols. Any such icon will be replaced with a default icon.