Favicon (favicon) is a small icon, 16x16 pixels in size, which is displayed:
- next to the name of the bookmark in the manager and browser bookmarks panel;
- near the title in the browser tab;
- next to the title in the history of browser visits;
- near the site URL in the address bar of some browsers;
- near the title or URL in the results of some search engines (for example, DuckDuckGo, Yandex.Search and Search@Mail.Ru).
The main task of the favicon is to speed up the search for the desired site among many open browser tabs and in its bookmarks.
Why is it important to add a favicon to your site?
Despite the tiny size of the favicon, it plays an important role in online brand promotion. With a thoughtful approach to its creation, this icon becomes the same element of branding as, for example, a logo and a slogan.
Sites with a favicon are also more likely to be bookmarked or among open browser tabs. After all, instead of reading the name of each of them, the user can easily identify the web page he needs just by looking at its icon.
By creating a favicon that differs in color or shape from the favicons of competing sites, you can also easily increase CTR with this element. Such an icon will immediately highlight your site in the output of search engines (if they display it). And without a doubt, this favicon for the site will attract the attention of users.
Pay attention! The icon is an important, but not the only, factor in increasing CTR. The indicators of this characteristic are greatly influenced by the correctness of the composition of the title and description. For successful promotion, it is also important to understand how to correctly compile a site map , to know how to eliminate duplicate pages and how to perform correct linking.
Guidelines for creating the right favicon
- Use favicon size wisely. Using a website or company logo as a favicon is a common practice. And if the logo is drawn in a minimalist style and does not include many small details, this is the right approach. Another thing is if the image that identifies the company or brand contains tiny elements and many colors. In this case, when compressed to a size of 16x16 pixels, the beautiful logo turns into a smear. Consider this when creating a favicon.
- Create an icon for the site taking into account its identity. Use only company colors, font and graphic elements when drawing a favicon. Remember that this tiny image will eventually become a branding element.
- Use the first letter, abbreviated version or abbreviation of the brand or company name. Look at the favicons of such "giants" of the web as Facebook, Wikipedia, Google and Yandex. They include the first letter of the company name, decorated in a corporate style. Consider this option when creating a favicon. Especially if you don't have a logo yet or are using a text logo.
Pay attention! As a favicon, you can use not only letters from the company name, but also from the domain name (if it differs from the name of the brand or trademark). You can register a domain in an international, regional or thematic zone at a low price with us.
How to make a favicon
We have dealt with the principles of creating a site icon. And now it's time to learn how to make a favicon correctly:
- Create a picture that you will use as a blog or online store icon. We recommend doing this using the free software GIMP or its commercial counterpart Adobe Photoshop.
- Make sure the image size is 16x16 pixels.
- Save the icon as favicon.ico.
- Upload the favicon to the root directory of the site.
If for some reason you cannot use an .ico file as a favicon or place it in the root directory of the site, add the following code to the HEAD section of each web page:
< link rel=”shortcut icon” href=”/icons/favicon.png” type=”image/png” >,
where /icons/favicon.png is the default icon path and image/png is the MIME type of the image you are using. A list of image MIME types is available on Wikipedia.
This completes the installation of the favicon!
Pay attention! If your site runs on a popular engine, it is very likely that you can add a favicon directly from the CMS admin. For example, to do this in WordPress, select Appearance > Customize in the Console, then select Site Properties and upload the favicon in the Site Icon block.
You have just learned what a favicon is, why it is important and how to create it correctly. With this knowledge, you will quickly draw an easy-to-remember site icon, which will eventually become a branding element no less powerful than the logo and color palette of an online resource.
Was the publication informative? Then share it on social networks and join our Telegram channel. We remind you that you can buy Ukrainian hosting from the hosting company CityHost. For technical questions, contact the online chat or call ?? 0 800 219 220.
Like the article? Tell your friends about it: 
