For the past couple of months, Google has been experimenting with a new layout for their search results. The most important change to this new look is the inclusion of favicons in search results. Here’s what this change means for your website’s SEO and how to take advantage of the change.
What is a favicon?
A favicon is a small icon that browsers use in several different ways to identify a website. Many browsers first used favicons in browser tabs, displaying the icon next to the page’s title. Browsers also use favicons in other places such as favorites and history. Saving a page to your phone’s home screen will use the favicon as the icon as well.
It’s also important to note that a favicon is different from a WordPress featured image. A featured image is designed to be used on list pages like blog pages for some themes, on social media, and sometimes on the page itself, depending on the theme. The biggest difference between favicons and featured images other than their usage is their size. Featured images are designed to be viewed at moderately large sizes — often up to 1200×1200 or even fullwidth, while favicons are often displayed at a very small size. Phone icons on retina devices display the favicon at a decently large size, but browser tabs and favorite lists often display favicons at sizes as small as 16×16.
What that means for you is that you should design your featured images to be viewed at larger sizes, but you should ensure favicons still show up well at very small sizes. Favicons, therefore, should have less detail than featured images.
What is Google doing with favicons?
Like browser tabs, Google is implementing favicons to the left of the page’s title in search results. At this time, they are only displaying on mobile, but there’s a good chance the change will be coming to desktop search results as well if Google feels like the change is successful on mobile. Google’s guidelines for featured images specify that they should be square and sized in a multiple of 48 pixels — 48×48, 96×96, 144×444, etc. Google will display favicons at 16×16, so ensuring your favicon looks good at that small size is important for Google as well.
How do I add a favicon on my website?
WordPress refers to a favicon as a “site icon,” and adding one to your WordPress website is very simple. In your WordPress Dashboard, go to Appearance → Customize, then click Site Identity, then click Select Image under the Site Icon heading. WordPress requires site icons to be at least 512×512 pixels, but remember to ensure that your icon will display well when reduced to 16×16 for browser tabs, Google search results, etc.
How else does this change affect SEO?
The inclusion of favicons is mostly a positive change, but it also has potential for abuse. The downside of favicons is that websites can use favicons to try to emulate other sites. Combined with the fact that Google no longer shows complete URLs in search results on mobile, a lesser-known company could create a favicon and obscured URL to try to pretend to be a more reputable company — and this is already happening.
To which phishing sites & bad actors are going to have a field day with.
Something already expressed by many to their team obscuring URLs.
Tell me which is the right site?
— Kristine Schachinger (@schachin) May 26, 2019
You may have to click on the tweet above and open the image to see it in its entirety, but in the example, a Las Vegas company called Muscle Moverz is pretending to be U-Haul, even using an icon designed to emulate theirs. This trick will only work on mobile — for now — as Google’s desktop search results still currently display the entire URL of a site, but given that Google sees the majority of searches on mobile, it could still become a huge problem if this activity becomes more common.
Until something changes, it’s a good idea to search for your brand from time to time and keep an eye on the results. If something looks to be emulating your site or your brand, be sure to report it to Google so the bad actors are removed from their search results.