What is Favicon and how to do it? –

Hosting Mautic QuickStart -50% with support in Spanish
24 hours and free training

Send up to 1,000,000 emails/year. Mautic support in Spanish 24 hours, 365 days

dowhat is a favicon? What is it for? How is it done?

If you have had several tabs open in the browser, you will have noticed that a small image appears next to each name, which we call favicon.

We are going to show you what it is, how to identify it, what it is used for and how to create your own favicon.

what is a favicon

A favicon is basically the icon that represents your page in tabs, when bookmarked, or in shortcuts on the Google home page.

If you have trouble identifying it, you can carry out the following process: open your browser, open several tabs with different websites to your liking. Now look at the different tabs, they have an icon next to the name, right? Well that’s what we call favicon.

This identifying icon of your web page has square dimensions, usually 16×16 or 32×32 pixels. Usually, the logo of the website or brand is used, or a variation of it is used.

Keep in mind that favicons are also considered to be icons that appear in iOS and Android appsand that have a different format but fulfill the same function.

What is a favicon for?

Your main task is identify your page and facilitate the user experience in your navigation. In other words, when a user browses the internet, it is normal for them to have several tabs open.

That is why it is very important that, with just a quick glance, the user identifies which tab corresponds to our website thanks to the favicon.

This favicon also appears when a user bookmark our page or when entering the Google home page next to shortcuts.

The favicon is like the “summary” of our logo, with which our website and our brand will be identified.

In addition, it is noteworthy that the favicon contributes a lot to the corporate image of our brand. In other words, by being always present, it transmits that image at a glance and permeates users.

Having a favicon does not have a direct effect on SEO, but it does cause a problem: When a user accesses your web page, your browser makes a request where it requests this icon of your page to show it in the tabs and navigation bar, for so if none is displayed (because you don’t have a favicon), you’ll get a 404 error.

How to make a favicon

For some time, having a favicon is practically essential.

Remember that the favicon has to be either your logoor a identification element of this For example, if your page is called “Butterfly” and your logo is a butterfly next to the name “Butterfly”, for the favicon you would use only the visual part, that is, the image of the butterfly without the name.

Yes, always It must have the corporate colors of your website or brand.

There are several ways to know how to create a favicon:

1. Through design programs like Photoshop or Illustrator. If you are good at designing, you can create it yourself with the appropriate dimensions (32×32) and adapting your logo. Then you must transform the image to the “.ico” format.
2. using online tools for creating favicons. Some of them are used to design a favicon from scratch like: , or . Others use an image that you upload to edit it and transform it into a favicon like: , or .
3. Via WordPress. From the WordPress menu in “Appearance > Customize” it allows us to upload an image and use it as a favicon. This image will be saved in your WordPress.

   You can also download plugins that facilitate the creation of the favicon.

4. Entrusting it to professional designers to adapt your logo to the favicon.

Either way, go for it!

Help us improve our content by sharing your opinion

SEO Specialist at .com