Фавикон: как сделать и подключить значок сайта
Требования Google и Яндекса к значку сайта, как правильно прописать его в коде, сколько ждать появления в поиске и почему вместо вашего значка иногда показывается значок хостинга.
- Обновлено
- Чтение
- 3 минуты
- Рубрика
- SEO
Коротко о главном
- Требования разные. Google: квадрат от 8×8, лучше больше 48×48. Яндекс: 120×120, 32×32 или 16×16.
- Адрес файла менять нельзя. Google прямо требует стабильного адреса значка.
- Робот должен иметь доступ. Googlebot-Image скачивает файл, Googlebot обходит главную страницу.
- Две недели ожидания. У Яндекса значок появляется в поиске в течение двух недель.
Что такое фавикон и где его видно
Фавикон — маленький значок сайта. Его видно во вкладке браузера, в закладках, в истории и в результатах поиска рядом с адресом.
Задача у него одна: сделать сайт узнаваемым в списке одинаковых строк. В выдаче, где десять похожих сниппетов, значок — единственное цветное пятно рядом с вашим названием.
Требования Google и Яндекса
Они разные, и это первое, что путает.
Google: значок должен быть квадратным, с соотношением сторон 1:1, размером не менее 8×8 пикселей. При этом рекомендуется использовать значок больше 48×48, чтобы он хорошо выглядел в разных местах. Поддерживаются форматы BMP, GIF, ICO, PNG, JPEG, PPM и TIFF.
Яндекс: размер 120×120, 32×32 или 16×16 пикселей, форматы SVG (рекомендуется), ICO, GIF, JPEG, PNG, BMP. В справке прямо сказано, что размер 120×120 или формат SVG позволяют отображать логотип сайта чётче и заметнее на сервисах Яндекса.
Отсюда практический вывод: если делать один набор под обе системы, ориентируйтесь на квадратное изображение 120×120 и добавьте SVG-версию.
Как подключить
Значок объявляется тегом link в head главной страницы:
<link rel="icon" href="/path/to/favicon.ico">
Google поддерживает четыре значения rel: icon, устаревшее shortcut icon, а также apple-touch-icon и apple-touch-icon-precomposed. Яндекс тоже отмечает, что робот может скачать фавиконку в том числе из тега apple-touch-icon.
Два требования, о которых забывают чаще всего:
- Адрес файла должен быть постоянным. Google формулирует это прямо: адрес значка должен быть стабильным, не меняйте его часто. Система с версионированием файлов, которая после каждой сборки выдаёт новый адрес, здесь вредит.
- Робот должен иметь доступ. Googlebot-Image должен иметь возможность скачать файл значка, а Googlebot — обойти главную страницу; закрывать их от сканирования нельзя.
Сколько ждать появления
Мгновенно значок не появится.
Яндекс: если робот загрузил фавиконку, она появится в результатах поиска в течение двух недель. Если запросить переобход страницы, значок обновится в течение трёх дней.
Google конкретного срока не называет и советует дать время на повторное сканирование и обработку данных главной страницы.
Почему значка нет в поиске
Разбор идёт по порядку.
Файл закрыт от обхода. Самая частая причина: папка с изображениями запрещена в robots.txt, и робот просто не может скачать значок.
Не сработало и это — смотрим дальше.
Адрес менялся. Если значок переезжал с адреса на адрес, поиск мог не успеть обновить информацию.
Сайт был недоступен. У Яндекса на этот счёт есть отдельная формулировка: если во время обхода сайт недоступен для робота, в поисковой выдаче вместо вашей фавиконки может отобразиться фавиконка вашего хостинга. Если видите чужой значок — дело обычно в этом.
Содержимое. Google не покажет значок, который сочтёт неприемлемым, включая порнографию и символы ненависти.
Каким должен быть сам значок
- Один элемент, а не весь логотип. В 16 пикселях полное название не читается. Работает буква, монограмма или простой знак.
- Проверяйте в реальном размере. Уменьшите изображение до 16×16 и посмотрите с расстояния вытянутой руки: если не узнаётся, упрощайте.
- Контраст. Значок должен быть виден и на светлой, и на тёмной панели вкладок.
- Без мелких деталей и тонких линий. При уменьшении они превращаются в грязь.
Как это делаем мы
Проверяем значок в числе первых мелочей: он не влияет на позиции, но влияет на то, замечают ли сайт в списке похожих. Это часть продвижения сайтов в Яндексе. Как устроен сам адрес сайта — в статье про домены, а что ещё можно проверить на сайте самостоятельно — здесь.
Значок сайта — это не про позиции, а про узнавание. Когда человек второй раз видит вашу строку в выдаче и цепляется за знакомый знак, он с большей вероятностью нажмёт именно на неё. Стоит это одну картинку и десять минут работы.
Александр Молодцов, сооснователь Seo Rezult
Читайте по теме:
SEO-продвижение сайта →Частые вопросы о фавиконе
Какого размера должен быть фавикон?
У Google — квадрат с соотношением сторон 1:1 размером не менее 8×8 пикселей, при этом рекомендуется использовать значок больше 48×48, чтобы он хорошо выглядел в разных местах. У Яндекса — 120×120, 32×32 или 16×16 пикселей.
Какие форматы поддерживаются?
Google: BMP, GIF, ICO, PNG, JPEG, PPM и TIFF. Яндекс: SVG (рекомендуется), ICO, GIF, JPEG, PNG, BMP. По справке Яндекса размер 120×120 или формат SVG позволяют отображать логотип сайта чётче и заметнее.
Как прописать значок в коде?
Тегом link в head главной страницы. Google поддерживает значения rel: icon, устаревшее shortcut icon, apple-touch-icon и apple-touch-icon-precomposed. Яндекс отмечает, что робот может скачать фавиконку в том числе из тега apple-touch-icon.
Можно ли менять адрес файла значка?
Не стоит. Google прямо указывает, что адрес значка должен быть стабильным и его не следует часто менять. Сборка, выдающая новый адрес файла после каждого обновления сайта, мешает показу значка.
Сколько ждать появления значка в поиске?
По справке Яндекса, если робот загрузил фавиконку, она появится в результатах поиска в течение двух недель. При запросе переобхода страницы значок обновится в течение трёх дней. Google конкретного срока не называет.
Почему вместо моего значка показывается чужой?
Яндекс объясняет это так: если во время обхода сайт недоступен для робота, в поисковой выдаче вместо вашей фавиконки может отобразиться фавиконка вашего хостинга.
Почему значка нет совсем?
Чаще всего файл закрыт от обхода: Googlebot-Image должен иметь возможность скачать значок, а Googlebot — обойти главную страницу. Также значок не покажут, если Google сочтёт его содержимое неприемлемым.
Что изображать на значке?
Один элемент, а не весь логотип: в размере 16 пикселей название не читается. Работают буква, монограмма или простой знак с хорошим контрастом на светлой и тёмной панели вкладок.
Автор статьи
Александр Молодцов
Сооснователь Seo Rezult, SEO-стратег
Больше 10 лет в SEO. Занимается стратегией продвижения, Яндекс Картами и 2ГИС, контентом сайтов. В блоге объясняет простыми словами и по шагам, как привести на сайт клиентов из поиска и Карт.
- В команде
- Seo Rezult: 10 лет, 10+ специалистов, 280+ проектов
- Впервые опубликовано