Статья обновлена 10.06.2025
Когда смотришь на пёстрое море открытых вкладок, крошечная иконка рядом с названием страницы решает, заметят ли твой ресурс или пролистают мимо. Именно здесь всплывает вопрос — какой же размер фавикона для сайта считается правильным в 2025 году? Пока стандарты постоянно меняются, давайте разберёмся, что сегодня рекомендуют браузеры и поисковики, а что — просто здоровый смысл.
Что такое фавикон и почему без него никак
Фавикон (favorite icon) — это крошечное квадратное изображение, которое:
- быстро «приклеивает» логотип к бренду;
- помогает искать нужную вкладку среди десятков открытых;
- выводится в выдаче Google и Яндекса, добавляя сайту солидности;
- способствует лучшему пользовательскому опыту, даже если пользователь не отдаёт себе в этом отчёт.
Некогда фавиконы были 16 × 16 px в формате
.ico. Сейчас устройств стало больше, разрешения выросли, а требования — усложнились.
Оптимальный размер фавикона для сайта в 2025 году
Базовая линейка размеров сегодня выглядит так:
| Где отображается | Минимум | Рекомендация |
|---|---|---|
| Старые десктоп-браузеры | 16 × 16 | 32 × 32 |
| Retina/4K экраны | 32 × 32 | 64 × 64 |
| Google Search | ≥ 48 × 48* | 96 × 96 или 144 × 144 |
| Яндекс Поиск | 120 × 120 | 120 × 120 |
| Apple Touch | 180 × 180 | 180 × 180 |
| Android Chrome | 192 × 192 | 192 × 192 |
*Google в 2024-м официально снизил нижнюю планку до 8 × 8 px, но настоятельно советует не опускаться ниже 48 px, сохраняя квадратное соотношение сторон 1:1. searchenginejournal.comuserp.io
Практика
Создавайте набор: 16, 32, 64, 120, 180, 192 px (+ SVG). Так можно увереннее покрыть старые и новые платформы.
Поддерживаемые форматы
- ICO — старожил, надёжно хранит несколько размеров в одном файле.
- PNG — лёгкий, прозрачно-фонный и понятный всем браузерам.
- SVG — масштабируется без потери качества, но не дружит с отдельными старыми движками.
- JPG — редкий гость из-за артефактов сжатия.
Совет: держим
.icoдля совместимости,pngдля большинства задач,svg— для hi-res интерфейсов.
Пошагово: как нарисовать идеальный favicon
Дизайн
Упрощаем: крупные формы, минимум деталей.
Фокус на логотипе или буквенной монограмме.
Текст делаем от 8 px, иначе он превратится в шум.
Инструменты
Photoshop, GIMP, Figma или онлайн-генераторы (Favicon.io, RealFaviconGenerator).
Экспорт
Готовим квадрат 260 × 260 px, а сервисы сами порежут на нужные размеры.
Тестирование
Проверяем на десктопе, смартфоне и эмуляторе Retina; смотрим, не «плывёт» ли мелкая версия.
Внедрение на сайт
Файлы кладём в корень (
favicon.ico) и в папку/icons/— для остальных размеров.HTML-теги:
CMS-лайфхак
В WordPress: «Настройки → Внешний вид → Иконка сайта».
В Tilda: «Настройки страницы → Favicons & Social».
Частые ошибки
- Перегруженный дизайн: детали исчезают на 16 px.
- Один-единственный размер: иконка выглядит мыльно на 4K.
- JPG вместо PNG/ICO: появятся «лесенки» на прозрачном фоне.
- Без тестов: фавикон слетает в тёмной теме браузера.
Итоги
Фавикон — мелочь, определяющая первое впечатление. В 2025-м мы ориентируемся на набор из 16 – 192 px, придерживаемся форматов ICO/PNG/SVG и не забываем о тестах. Настройте свой набор однажды — и вкладки ваших читателей всегда будут отличаться.
