Фавикон (favicon) — небольшой квадратный значок сайта, который помогает узнать его среди вкладок, закладок и других элементов интерфейса браузера. Поисковые системы также могут показывать favicon рядом с результатом поиска. В большинстве современных браузеров иконка уже не отображается в адресной строке в том виде, как это было раньше.
Фавикон не является самостоятельным фактором ранжирования, но это важная часть визуальной идентичности сайта: он помогает быстрее узнать ресурс во вкладках и закладках, а Google может использовать его в поисковой выдаче рядом с названием сайта.
Дочитав статью до конца, у вас сформируется четкое понятие, что такое фавикон, как создать, как установить фавикон, какие для этого использовать сервисы.
Фавикон под микроскопом
Наличие этой иконки значительно упрощает поиск, так как, глядя на результаты выдачи, легко можно найти знакомый ресурс. Не менее полезным фавикон становится при добавлении сайта в закладки. Достаточно одного беглого взгляда, чтобы из десятков сайтов визуально отыскать необходимую закладку.
Старое правило «favicon должен быть 16×16 и обязательно в ICO» сегодня уже слишком узкое. Для Google иконка должна быть квадратной; минимально допустимы очень маленькие размеры, но для нормального отображения рекомендуется использовать изображение кратное 48 пикселям — например 48×48, 96×96 или более крупный исходник. Современные браузеры работают с PNG, SVG и ICO. На практике удобно хранить качественный квадратный исходник, а затем подготовить нужные варианты под браузеры и устройства.
В современных браузерах favicon в первую очередь заметен на вкладках, в закладках, истории и других элементах интерфейса. В адресной строке большинство браузеров давно отказалось от старого способа показа favicon, поэтому ориентироваться на него как на главный сценарий уже не стоит.
Обновление 2026: скриншот ниже сохранен из первоначальной версии статьи. Он показывает, как favicon выглядел в поисковой выдаче Яндекса на момент публикации материала. Интерфейс и механика поисковых систем со временем меняются, поэтому этот фрагмент стоит воспринимать как историческую иллюстрацию, а не как актуальную техническую инструкцию.
Сегодня важнее учитывать требования Google Search: поисковик может показывать favicon рядом с названием сайта, если иконка доступна для обхода, имеет стабильный URL и соответствует требованиям к размеру и формату. После замены значка обновление в выдаче может произойти не сразу — роботу требуется повторно обойти главную страницу и сам файл favicon.
Создание фавикона — небольшой, но важный этап оформления сайта. К практическим преимуществам использования фавиконов можно отнести:
- узнаваемость бренда;
- доверие посетителей;
- повторные посещения;
- экономия времени пользователей.
Основная выгода — узнаваемость бренда. Знакомая иконка помогает быстрее найти нужную вкладку или закладку и может сделать результат сайта более узнаваемым в поисковой выдаче. При этом не стоит обещать favicon прямой рост позиций, трафика или конверсии: его задача гораздо прозаичнее — быть понятным, заметным и ассоциироваться с вашим проектом даже в очень маленьком размере.
Осталось разобраться, как создать и установить фавикон на сайт.
Как создать фавикон
Файл favicon не обязан лежать строго в корне сайта и не обязан иметь размер только 16×16 пикселей. Его можно хранить в удобном каталоге и явно подключить через <link rel="icon"> в секции <head>. Для исходника лучше использовать квадратное изображение большего размера, а 16×16 и 32×32 рассматривать как размеры для проверки читаемости, а не как единственный исходный формат.
Создать основу можно в Photoshop, GIMP, Figma, Illustrator или любом другом графическом редакторе. ICO сегодня не является единственным «правильным» форматом: для современных сайтов часто достаточно PNG или SVG, а ICO можно оставить как дополнительный вариант совместимости.
Удобно и просто сделать его, воспользовавшись специальными онлайн генераторами, которые будут приведены ниже.
Вариант для ленивых — скачать готовый favicon из онлайн-каталога или галереи.
Обзор онлайн-генераторов, где найти коллекцию фавиконов
Favicon generator — сервисы, где можно сотворить «мини-логотип» для сайта или преобразовать подходящую картинку в нужный формат.
Faviсon.cc
Проверено 19 августа 2026: сервис работает, доступны создание favicon с нуля, импорт изображения и скачивание готового файла. Интерфейс за годы почти не изменился, поэтому старые скриншоты ниже все еще хорошо передают логику работы.
Удобный сервис, в котором можно сделать эксклюзивную иконку — нарисовать ее с нуля попиксельно. Для этого переходим на сервис и в меню слева нажимаем кнопку «Create New Favicon».
В центральной части окна находится область, в которой каждый квадратик — это пиксель будущего фавикона. Следует закрасить эти квадратики в разные цвета. Чтобы это проделать, нужно обратиться к блоку «Color Picker», который расположен в правой части сервиса. Здесь необходимо выбрать из предоставленной палитры необходимый цвет и щелкнуть по определенной области, где находится пиксельная сетка. Чтобы удалить неправильную закраску, достаточно поставить галочку возле чекбокса «transparent» и щелкнуть по квадрату, после чего он станет прозрачным.
Чтобы переместить рисунок по холсту сервиса, ставится галочка возле чекбокса «move». Для того чтобы посмотреть что получилось предусмотрен блок «Preview», который находится под пиксельной сеткой. Для скачивания готового фавикона на компьютер нужно нажать кнопку «Download Favicon».
Если вы не Пабло Пикассо и нарисовать с нуля для вас равносильно прыжку из парашюта, загрузите на сервер для будущего фавикона картинку любого формата и размера, она будет, как болванка. Чтобы загрузить изображение на генератор, нажимается кнопка «Import Image» в левом меню.
На открывшейся странице нужно кликнуть кнопку «Выбрать файл», найти на компьютере подходящую картинку. При загрузке прямоугольной картинки можно отформатировать ее в квадрат (16х16). Для этих целей предусмотрена вкладка «Shrink to square icon». Учтите, в таком случае изображение будет искажено по одной из осей.
Чтобы соотношение сторон остались прежними, поставьте точку в чекбоксе «Keep dimensions».
После всех манипуляций нажимаем кнопку «Upload». Редактирование загруженной фавиконки будет доступно аналогичным способом, что и создание с нуля. Для скачивания готового шедевра на ПК следует нажать кнопку «Download».
Этот онлайн генератор еще и предоставляет коллекцию фавиконов, которые создавались другими пользователями этого сервиса ранее. Они выложены в общем доступе. Чтобы посмотреть галерею нужно в левом меню нажать кнопку «Latest Favicons» — экспонаты, отсортированные по дате или кнопку «Top Rated Favicons» — по рейтингу.
Чтобы скачать понравившийся экземпляр кликните левой кнопкой мыши по его названию и на открывшейся странице выберите «Download Favicon».
Logaster / ZenBusiness
Обновление 2026: прежний сервис Logaster в описанном ниже виде больше недоступен. Страница перенаправляет на ZenBusiness, где собственный favicon-генератор на момент проверки помечен как Coming Soon. Скриншоты и старая инструкция сохранены, чтобы не вырывать историческую часть материала из контекста.
Сервис логотипов, который плюс к этому еще может эксплуатироваться для создания фавиконов. Тут не нужно рисовать или конвертировать фавикон с логотипа.
Для создания фавикона необходимо ввести название компании или сайта и нажать кнопку «Далее».
Онлайн генератор предоставляет уже готовые к использованию шаблоны фавикона. Для скачивания иконки нажмите кнопку «Посмотреть и скачать» и на открывшейся странице «Скачать».
Имейте в виду, чтобы сохранить фавикон вам придется создать на сервисе аккаунт.
FaviconGenerator
Проверено 19 августа 2026: генератор работает: можно загрузить PNG, JPG или GIF и получить favicon.ico и набор иконок. Часть пояснений на самом сайте выглядит устаревшей, но основная функция генерации доступна.
Преобразует в необходимый формат любую загруженную с компьютера картинку.
Последовательность действий следующая: выбираем файл и нажимаем кнопку «Create Favicon».
На заключительном этапе остается только кликнуть по ссылке «Download the generated favicon» и на ваш ПК будет скачан архив полный разноразмерных фавиконов.
AntiFavicon
Проверено 19 августа 2026: сайт доступен и по-прежнему позиционируется как простой онлайн-генератор favicon. Интерфейс старый, но сама идея сервиса — быстро сделать двухстрочную текстовую иконку — сохранилась.
Сервис, предоставляющий возможность создавать фавикон с надписью. Цветовая гамма настраивается в области «Colors», а текст надписи вводится в полях «Top text» и «Bottom tex».
Для скачивания готового значка следует кликнуть по миниатюрной надписи «save as favicon file».
Iconj
Обновление 2026: при контрольной проверке сервис не удалось стабильно открыть. Поэтому инструкция и скриншоты ниже оставлены как часть первоначального материала, но рассчитывать на IconJ как на основной рабочий инструмент сейчас не стоит.
От остальных отличается тем, что позволяет созданную иконку не скачивать (но можно и скачать), а оставить непосредственно на сервисе и получить ссылку к этому файлу.
Для создания фавикона выбираем файл и нажимаем «Upload Now».
Спустя секунду изображение можно будет скачать на компьютер по ссылке «Click here to download your Favicon.ico File». Здесь же можно скопировать HTML код, который затем нужно разместить в файле главной страницы сайта. Помимо этого сервис генерирует ссылку на фавикон, которую можно расположить на страницах сайта.
Также в сети можно найти множество других генераторов, которые создают favicon с нуля или конвертируют готовое изображение. Список таких сервисов быстро меняется: часть проектов закрывается, переезжает на новые домены или меняет условия, поэтому перед использованием лучше проверить актуальную доступность и правила скачивания.
Можно использовать и готовую иконку из открытых коллекций, но здесь важно проверить лицензию и право коммерческого использования. Старый список галерей из первоначальной версии статьи оставлен ниже как ориентир:
- Галерея иконок для сайта favicon.ico;
- Iconj;
- Favicon.cc;
- The Favicon Gallery.
Если берете готовый знак, лучше не ограничиваться только внешней привлекательностью: проверьте, разрешено ли его использование, и убедитесь, что иконка не выглядит чужим логотипом. Для бренда надежнее иметь собственный простой знак.
Как установить фавикон на сайт
Есть некоторые отличия между установкой favicon в Joomla и WordPress, а старые инструкции для этих CMS сегодня требуют оговорок.
Joomla. В современных Joomla 4/5/6 сначала стоит проверить настройки активного шаблона или его фреймворка. Если шаблон позволяет выбрать favicon в панели настроек, это надежнее ручной замены файла: обновление шаблона не затрет вашу иконку.
Старые скриншоты ниже сохранены намеренно. Они показывают ручной способ через файловый менеджер хостинга, который был типичным для Joomla 3 и старых шаблонов. На современном сайте лучше использовать настройки шаблона, child template или предусмотренное шаблоном переопределение, а не менять файлы оригинального шаблона без необходимости.
Если favicon все же подключается вручную, файл можно загрузить через ISPmanager, SFTP или другой файловый менеджер. Важно, чтобы шаблон или тег <link rel="icon"> ссылался на реальный доступный URL изображения. В старой инструкции для этого открывался каталог сайта и папка templates:
После этого файл загружался непосредственно в каталог активного шаблона. Такой способ по-прежнему может работать в отдельных конфигурациях, но перед заменой файла стоит проверить документацию конкретного шаблона.
WordPress. В современных версиях WordPress favicon лучше назначать через штатную настройку Site Icon или соответствующее поле темы. Расположение пункта зависит от типа темы и интерфейса, но для обычного сайта ручное редактирование header.php уже не является предпочтительным способом.
Скриншот ниже оставлен из старой версии статьи. Он полезен как иллюстрация прежнего интерфейса темы, но конкретные пункты меню в актуальном WordPress могут выглядеть иначе.
Если штатной настройки действительно нет, подключать favicon лучше через дочернюю тему, предусмотренный темой hook или другой способ, который переживет обновление. Минимальная современная разметка выглядит так: <link rel="icon" href="/favicon.png" type="image/png">.
Если favicon не отображается, не зацикливайтесь на имени favicon.ico: современный файл может называться иначе. Сначала откройте URL иконки напрямую, проверьте тег rel="icon" в исходном коде, затем очистите кеш CMS, браузера и CDN. Если речь о Google Search, обновление в выдаче может занять время после повторного обхода.
Итог
Если у проекта до сих пор нет favicon, его действительно стоит добавить. Хорошая иконка не обещает автоматического роста позиций или конверсии, зато делает сайт аккуратнее и узнаваемее во вкладках, закладках и поисковой выдаче. Создать ее можно самостоятельно или с помощью генератора — главное, чтобы знак хорошо читался в маленьком размере и не терял связь с брендом.
