What you need to know before adding a favicon to your site

Table of contents:

What you need to know before adding a favicon to your site
What you need to know before adding a favicon to your site
Anonim

Currently, not a single site can do without a favicon. Standard icons are laid down when creating the platform. Only they do not always suit the user. The problem is that not every resource owner knows how to add a favicon. The action is not that difficult. But the result will allow you to identify the site among several others in the search results. After all, keywords can be similar, but the favicon will not let you down. It is his addition that often explains the visitor's decision to visit the resource.

Favicon for website

Before you can put a favicon on the site, you need to create it. To do this, you can choose one of the proposed options:

  1. Order a layout from a designer.
  2. Create your own on online services on the Internet.
  3. Create your own in Photoshop.
  4. how to add favicon to yandex
    how to add favicon to yandex

Standard image is saved with ICO extension. Its size is desirable to choose 16x16 pixels. There are sizes and more. They are needed when the user saves the page on the desktop.

Next, place the image in the root of the site. To do this, enter the line https://site.ru/favicon.ico, where instead of:

  • site.ru write the name of your own resource;
  • favicon.ico enter the name of the favicon file.

For correct reflection in the search engine, you must enter the image in the code. Use the tag to download. The string is inserted into it. There is another option -.

How to add a favicon
How to add a favicon

After that, the designed logo will be installed. You can see it both on the site and in the query results. There is an icon in front of the resource address.

Favicon and browsers

Before adding a favicon, you should decide on its extension. It can be:

  • ICO.
  • SVG.
  • PNG.
  • APNG.
  • GIF.
  • JPEG.

But different browsers support different extensions. Which browser is loyal to which favicon format, the table below will show.

Browser type ICO SVG PNG APNG GIF JPEG
Internet Explorer 2 3 1 1 1 1 1
Google Chrome 3 3 2 1 2 1 2
Firefox 2 1 2 2 2 3 3
Opera 2 2 2 2 2 2 2
Safari 3 1 2 1 2 1 2

1 - does not support;

2 - does not support all versions;

3 - supports all versions.

Because many still prefer the standard format. By adding such a favicon, it will be possible not to worry about the client's browser type. If you do not take into account the age, professional and other preferences of the audience before adding a favicon, you can be left without a logo.

If you want to add some favicons

Sometimes there is a desire or need to add a small image for each page or make different formats for viewing on different browsers. In this case, to the question of how to add a standard favicon, you need to add a couple more strokes.

Inscribing a favicon insert in the site root is very simple. But this is not enough to create multiple extensions. To do this, you need to insert into the HTML code, after framing the line.

When creating such a structure, you should remember that for Internet Explorerthe word icon is not enough. It is necessary to enter shortcut in front of it. In this case, the standard browser will respond to the phrase, and the rest - only to the last word.

There are many questions on the forums on how to add a favicon to Yandex. If the image is added to the root of the site, then registration is not required. Robots will find it by default.

Added and lost

It happens that all actions are done correctly, but when checking in search engines, there is no picture. After all, the main thing is not how much to add, but how to add a favicon. In Yandex. Direct, if added correctly, image moderation will take from 2 to 4 weeks. During this time, the site will be displayed without a favicon. It is also worth mentioning that if the site is ranked low in the search results, the icon may not be displayed at all.

If the time has passed and there is no icon, the extension may not match the browser. You can check the presence of a favicon:

  • for "Yandex" –
  • for "Google" –
how to add a favicon to Yandex Direct
how to add a favicon to Yandex Direct

After being recognized by the system, the favicon will become an integral part of the website and the company's image. Therefore, it is worth treating it responsibly. A correctly chosen and correctly added icon will become a guiding light for customers. And this means an increase in conversion and, accordingly, a greater profit.

Recommended: