Favicon (фавикон) – это маленькая иконка, размером 16x16 пикселей, которая отображается:
- возле названия закладки в менеджере и панели закладок браузера;
- возле тайтла во вкладке браузера;
- возле тайтла в истории посещений браузера;
- возле УРЛа сайта в адресной строке некоторых браузеров;
- возле тайтла или УРЛа в результатах выдачи некоторых поисковиков (например, DuckDuckGo, Яндекс.Поиск и Поиск@Mail.Ru).
Главная задача favicon – ускорить поиск нужного сайта среди множества открытых вкладок браузера и в его закладках.
Почему важно добавить фавикон на сайт
Несмотря на крохотный размер favicon, он играет важную роль в продвижении онлайн-бренда. При продуманном подходе к его созданию, эта иконка становится таким же элементом брендинга, как, например, логотип и слоган.
Сайты с фавиконом также быстрее находятся в закладках или среди открытых вкладок браузера. Ведь вместо того, чтобы читать название каждой из них пользователь легко идентифицирует нужную ему веб-страницу, лишь взглянув на её иконку.
Создавая favicon, который отличается цветом или формой от фавиконов сайтов-конкурентов, вы также сможете с помощью этого элемента легко повысить CTR. Такая иконка будет сразу выделять ваш сайт в выдаче поисковиков (если они отображают ее). И несомненно этот фавикон для сайта привлечет внимание пользователей.
Обратите внимание! Иконка – важный, но не единственный фактор увеличения CTR. На показатели этой характеристики в огромной мере влияет корректность составления тайтла и дескрипшна. Для успешного продвижения важно также понимать, как правильно составляется карта сайта, знать, как устранить дубли страниц и как выполнить корректную перелинковку.
Рекомендации по созданию правильного фавикона
- Используйте размер favicon с умом. Использование логотипа сайта или компании в качестве фавикона – распространенная практика. И если лого нарисовано в минималистском стиле и не включает множество мелких деталей – это правильный подход. Другое дело, если изображение, которое идентифицирует компанию или бренд, содержит крохотные элементы и много цветов. В таком случае при его сжатии до размера 16x16 пикселей, красивый логотип превращается в размазанное пятно. Учитывайте это, создавая favicon.
- Создавайте иконку для сайта с учетом его айдентики. Используйте фирменные цвета, шрифт и графические элементы, рисуя фавикон. Помните, что это крохотное изображение со временем станет элементом брендинга.
- Используйте первую букву, сокращенный вариант или аббревиатуру названия бренда или компании. Посмотрите на фавиконы таких «гигантов» веба, как Фейсбук, Википедия, Гугл и Яндекс. Они включают первую букву названия компании, оформленную в фирменном стиле. Рассмотрите этот вариант, создавая фавикон. Особенно, если у вас пока что нет логотипа или вы используете текстовое лого.
Обратите внимание! В качестве фавикона можно использовать не только буквы с названия компании, но и с доменного имени (если оно отличается от имени бренда или торговой марки). Зарегистрировать домен в международной, региональной или тематической зоне по низкой цене можно у нас.
Как сделать favicon
С принципами создания иконки сайта мы разобрались. И теперь пришло время узнать, как сделать фавикон правильно:
- Создайте картинку, которую будете использовать в качестве иконки блога или интернет-магазина. Рекомендуем сделать это с помощью бесплатного ПО GIMP или его коммерческого аналога Adobe Photoshop.
- Убедитесь, что размер изображения составляет 16 x 16 точек.
- Сохраните иконку, присвоив ей имя favicon.ico.
- Залейте фавикон в корневую директорию сайта.
Если по каким-то причинам вы не можете использовать в качестве фавикона файл в формате .ico или разместить его в корневой директории сайта, добавьте в раздел head каждой веб-страницы следующий код:
< link rel=”shortcut icon” href=”/icons/favicon.png” type=”image/png” >,
где /icons/favicon.png – условный путь к иконке, а image/png – MIME-тип изображения, который вы используете. Список MIME-типов изображений есть в Википедии.
На этом установка фавикона завершена!
Обратите внимание! Если ваш сайт работает под управлением популярного движка, очень вероятно, что добавить фавикон можно непосредственно с админки CMS. Например, чтобы сделать это в WordPress, выберите в Консоли пункт меню Внешний вид > Настроить, далее выберите Свойства сайта и загрузите favicon в блоке Иконка сайта.
Только что вы узнали, что такое фавикон, почему он важен и как правильно его создать. С этими знаниями вы без труда нарисуете запоминающуюся иконку сайта, которая со временем станет не менее мощным элементом брендинга, чем лого и палитра цветов онлайн-ресурса.
Публикация была познавательной? Тогда поделитесь ею в социальных сетях и добавляйтесь в наш Telegram канал. Напомним, что купить украинский хостинг вы можете у хостинг-компания CityHost. По техническим вопросам обращайтесь в онлайн чат или по телефону ☎️ 0 800 219 220.