# Что такое фавикон и зачем он нужен сайту

Обновлено 29 октября 2026 г. · 2 мин чтения · Студия AETHER · https://aether-studio.ru/blog/favikon

Фавикон — маленький значок сайта во вкладке браузера, в закладках и рядом с сайтом в результатах поиска. Он крошечный, но его видят чаще, чем любую другую картинку на сайте. Разбираем, какие форматы и размеры нужны, как установить фавикон и что делать, если Яндекс его не показывает.

## Где видно фавикон

- во вкладке браузера — особенно важно, когда у человека открыто двадцать вкладок;
- в закладках и истории браузера;
- на главном экране телефона, если сайт добавили туда как ярлык;
- в результатах поиска Яндекса и Google — рядом с адресом сайта.

В выдаче фавикон работает как маленький логотип: по нему сайт узнают среди десятка ссылок.

## Какие нужны размеры и форматы

| Где | Что подготовить |
| --- | --- |
| Браузеры | SVG — чёткий на любом экране; на всякий случай ICO или PNG 32×32 |
| Яндекс | 120×120, 32×32 или 16×16 пикселей; лучше SVG или 120×120 — так значок в сервисах Яндекса заметнее; анимация не поддерживается |
| Google | Квадрат со стороной, кратной 48 пикселям: 48×48, 96×96, 144×144 |
| iPhone и iPad | PNG 180×180 для ярлыка на главном экране |
| Android | PNG 192×192 и 512×512 в файле манифеста сайта |

## Как сделать фавикон

- **Из логотипа, а не логотипом целиком.** Полное название в квадрате 16×16 превратится в серое пятно. Нужен знак, первая буква или упрощённый символ.
- **Контрастный и простой.** Проверьте, как значок выглядит на светлой и тёмной вкладке браузера.
- **С отступами.** Знак, который упирается в края квадрата, выглядит обрезанным.
- **Квадрат с фоном** часто читается лучше прозрачного: на тёмной теме браузера тёмный знак без фона пропадает.

Генераторы фавиконов соберут все размеры из одной картинки, но исходник лучше нарисовать под маленький размер, а не просто уменьшить логотип.

## Как установить

- **Сайт на коде.** Файлы кладут на сайт, а в раздел `<head>` каждой страницы добавляют ссылки на них — это делает разработчик за несколько минут.
- **Тильда и другие конструкторы.** В настройках сайта есть поле для иконки — достаточно загрузить картинку.
- **WordPress.** В настройках темы обычно есть пункт «Иконка сайта».

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

## Почему фавикон не появляется в поиске

- **Нужно время.** Поисковик обновляет значок не сразу — иногда несколько недель.
- **Файл недоступен роботу.** Проверьте, что он открывается по прямой ссылке и не закрыт в robots.txt — подробно о нём в статье [«robots.txt простыми словами»](https://aether-studio.ru/blog/robots-txt).
- **Не тот размер или формат.** Сверьтесь с таблицей выше.
- **Ссылки нет на главной странице.** Поисковики ищут указание на фавикон в коде главной.

Если значок не появился через несколько недель, посмотрите сообщения в Яндекс Вебмастере — о нём статья [«Яндекс Вебмастер»](https://aether-studio.ru/blog/yandeks-vebmaster).

## Как устроено у нас

Наш фавикон — знак студии, стилизованная буква A, белая на тёмном квадрате со скруглёнными углами. Это не уменьшенное название AETHER, а только знак: в размере вкладки целое слово не прочитать. Основной файл — SVG, отдельно — PNG для ярлыка на iPhone. О том, какие ещё версии логотипа нужны сайту, — в статье [«Логотип для сайта»](https://aether-studio.ru/blog/logotip-dlya-sajta).

## Если сайт ещё предстоит сделать

Фавикон, заголовки и описания страниц для поиска проще продумать при разработке, чем добавлять потом. Базовая подготовка к поиску — заголовки, описания, разметка — входит в наш лендинг.

**Услуга «Лендинг»:** от 4 рабочих дней, от 30 000 ₽, обычно 30 000–70 000 ₽. Подробнее: https://aether-studio.ru/services/landing

**Обсудим ваш сайт.** Ответим в течение рабочего дня, зададим несколько вопросов и назовём вилку по сроку и бюджету. Бесплатно и без обязательств. Написать: [Telegram @aether_agency](https://t.me/aether_agency), почта aether-studio@mail.ru, форма — https://aether-studio.ru/#contact.