Фавикон из логотипа: размеры для браузера и Google

Какие файлы для каких мест?

Для Google выбирайте поддерживаемые форматы, например PNG или ICO: SVG нет в текущем списке. Квадратный значок должен быть не меньше 8×8 px; Google рекомендует больше 48×48, поэтому 96×96 полезен, а не устарел. Разместите ссылку на главной странице, сохраните постоянный URL и разрешите Googlebot загружать страницу, а Googlebot-Image — изображение. Выполнение правил не гарантирует показ.

Создание и публикация значка

1. Начните с узнаваемого знака; уберите слоган и тонкие детали.
2. Проверьте форму в 16 и 32 px на светлом и тёмном фоне.
3. Экспортируйте из вектора. Выберите одну папку фавиконов в пакете LogoSaga и сохраните пути манифеста.
4. Добавьте ссылки ниже только на существующие файлы сервера. PNG96 — дополнительный экспорт для поиска.

<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48" />
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
<link rel="icon" href="/favicon-96x96.png" type="image/png" sizes="96x96" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180" />
<link rel="manifest" href="/site.webmanifest" />

SVG может использовать prefers-color-scheme, но проверяйте поддерживаемые браузеры и версии. Знак, читаемый на обоих фонах, — надёжный запасной вариант. Значки Apple touch и манифеста — отдельные файлы, не автоматические версии SVG браузера.

Почему значок не появился?

Откройте URL напрямую: он должен возвращать изображение, а не ошибку или вход в систему. Проверьте ссылки главной страницы и доступ роботов. В браузере обновите страницу или очистите локальный кеш значков. Для Google сохраните URL и запросите индексирование главной страницы в Search Console; обработка может занять дни или недели. Постоянное переименование не исправляет поиск.

Связанные практические руководства: Тест логотипа: 10 проверок перед публикацией · Логотип для профиля компании Google: размер и загрузка

Создайте логотип с подходящим фавиконом

Часто задаваемые вопросы

Какого размера должен быть фавикон?

Для Google выбирайте поддерживаемые форматы, например PNG или ICO: SVG нет в текущем списке. Квадратный значок должен быть не меньше 8×8 px; Google рекомендует больше 48×48, поэтому 96×96 полезен, а не устарел. Разместите ссылку на главной странице, сохраните постоянный URL и разрешите Googlebot загружать страницу, а Googlebot-Image — изображение. Выполнение правил не гарантирует показ.

В каком формате должен быть фавикон — SVG, PNG или ICO?

Фавикон — маленький символ сайта. Используйте знак логотипа, а не уменьшенное полное название. Вкладки, Google и установленные веб-приложения имеют разные требования; проверяйте реальное место использования.

Может ли фавикон меняться в тёмной теме?

SVG может использовать prefers-color-scheme, но проверяйте поддерживаемые браузеры и версии. Знак, читаемый на обоих фонах, — надёжный запасной вариант. Значки Apple touch и манифеста — отдельные файлы, не автоматические версии SVG браузера.

Почему мой фавикон не отображается или не обновляется?

Откройте URL напрямую: он должен возвращать изображение, а не ошибку или вход в систему. Проверьте ссылки главной страницы и доступ роботов. В браузере обновите страницу или очистите локальный кеш значков. Для Google сохраните URL и запросите индексирование главной страницы в Search Console; обработка может занять дни или недели. Постоянное переименование не исправляет поиск.