ВойтиРегистрация

Значок сайта (favicon)

пошаговая инструкция · Быстро: 5–15 минут

← Все инструкции

1. Что произошло

Маленькая картинка во вкладке браузера и в результатах поиска.

2. Почему это важно

Сайт выглядит менее аккуратно, в мобильной выдаче нет значка. После исправления: Узнаваемость во вкладках и в поиске.

3. На каких страницах обнаружено

Файл /favicon.ico и теги link rel="icon" в head главной страницы.

Чтобы увидеть адреса на вашем сайте, откройте инструкцию из отчёта или добавьте домен в адрес: /fix/favicon/ваш-сайт.ru.

4. Как исправить

Для WordPress

  1. Внешний вид → Настроить → Свойства сайта → «Значок сайта» (минимум 512×512). WordPress сам добавит нужные теги.

Общее для любого сайта

  1. Подготовьте квадратную картинку: 512×512 PNG или SVG. Из неё сделайте favicon.ico 32×32 (можно онлайн-генератором).
  2. Положите favicon.ico в корень сайта и подключите остальные размеры тегами в head (код ниже).
  3. Яндекс и Google обновляют значок в выдаче с задержкой до нескольких недель.

5. Готовый код

Замените example.com на свой домен. Перед правкой конфигурации сделайте резервную копию файла.

Любой сайт

Теги в head
<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">

6. Как проверить результат

  1. Код 200 и тип image/…; значок виден во вкладке браузера (обновите страницу через Ctrl+F5).
  2. Нажмите «Перепроверить сайт».
Файл отдаётся
curl -sI https://example.com/favicon.ico | head -n 2

Чтобы перепроверить сайт, откройте отчёт и нажмите «Проверить заново».