What Is A Favicon?

What are favicons?

The small graphical representation of the website you are visiting, visible on the left to the website’s name in the address bar, is called a favicon. It is a shortened expression for ‘favorite icon.’ It helps you identify the visited website among the many open tabs. For example, The fancy P that appears on the tab left of the ProCreator website’s address bar is the favicon for us.

People tend to confuse it with the logo. It can or cannot resemble the logo, but the intent of both of these a very different. Favicons are generally a square of 16 x 16 px used by web browsers. However, the size can vary when you design the favicon for a mobile screen. The favicon is the favorite apps you set on your home screen on a mobile screen.

Various Favicons Examples

Here are multiple examples of how the big tech giants design favicons for them.

Google makes use of a circle with a G written inside it.

Facebook makes use of its logo itself, with the alternate color scheme.

Amazon also uses a square with an ‘A’ written inside, resonating with the first letter of their logo.

How to make a favicon?

It can be achieved in the simple steps mentioned below-

• Choose the correct image resonating with your brand’s identity or logo. It makes it easier for the user to identify your website or app. The image you choose can be of PNG, JPG formats. The most accomplished is the ICO format, which is easily recognized by all web browsers.
• Choose the correct size. It can range from 16px (accepted by all web browsers) to 128px (for Chrome Web Store).
• People easily choose to select an online tool and then download the resulting icon.
• The icon can then be exported and sent across to the developers.

What is the purpose of a favicon?

Favicons have become popular because of the branding strategy the companies follow. It’s an excellent way to make your brand feel recognized among the thousand other opened tabs in the browser.

This helps in user recall, thus enhancing the user experience. It gives a boost to your online branding and helps set up a recognizable entity for your brand.

When a user bookmarks your website, at a later point when they decide to return to the site, the favicon will make it easier for them to recognize it. It increases the chances of a visitor’s click for your website.

Conclusion

Adding favicons adds legitimacy to the website and helps you identify the bookmarked sites and the many opened tabs on your browser. A small piece of design but can very well act as a reference for your brand or product.

ProCreator is an award-winning UI/UX Design agency in Mumbai, focusing on establishing an end-to-end product solution, from product design to development.

Originally Published at ProCreator Blog, by — Rashika Ahuja.