What Are Favicons: do they really matter? 

What is a favicon? It is the little icon that appear next to the webpage title in a browser tab. 

Why Do Favicons Matter?

Why do you need a favicon? Users will remember and recognize it, they would find a tab with your favicon among other tabs faster, scanning, as we all do, and not losing time trying to read the tab name. 

Favicons also add to overall branding consistency and their absence might be seen as unprofessional.

Where Are Favicons Used?

Favicons are used in browser tabs, browser history,  toolbar apps, bookmarks dropdown, search bar, and search bar recommendations. 

In all of these, especially in the bookmarks and history tabs, that consist of lists of URLs all looking the same, the favicon makes it faster to find that web-site you’re looking for.

Favicons and what size they should be

First, your Favicons’ format is  always .png

Their standard size for placement on a web browser is 16×16 px  

Favicon Design Tips

The key to favicon design is simplicity. You have a tiny amount of space to work with and details will not be visible, so it’s important to keep the shapes clean. Sometimes you can fit letters, but the general rule is to avoid them if your logo doesn’t have a “short” version like LinkedIn’s does. Some of the logos can be used for favicons as they are, and some only in the simplified version, and of course you need to keep the colors of the favicon on brand.  

Examples of good favicon design (Humbleteam’s logo has a red dot in the end, that is used in their favicon)

Remember to test your favicons on different backgrounds, since different browsers, systems and view modes can affect the visibility of your favicon.

Conclusion

A favicon on your website is definitely of benefit.  When you share the right favicon for your website – it helps elevate your brand. 

Some of us still bookmark webpages, some of us add websites to the home screen and use them like apps, some of us use bookmarking sites. Start designing your Favicon today.