Как сделать favicon для сайта онлайн (иконка в адресной строке браузера)
На сегодняшний день, когда компьютеры довольно мощные и ресурсы системы экономить не надо, у большинства пользователей в браузере открыта не одна, а несколько вкладок, иногда даже очень много. Текст с сайта на вкладке уже не отображается, и определить какая вкладка откроет нужный сайт бывает непросто. Однако, если у вашего сайта узнаваемая иконка (так называемая favicon.ico), это несомненно добавит к удобству его обнаружения среди других вкладок. Сделать favicon и добавить к себе на сайт довольно просто.
Favicon - это изображение 16x16 пикселей, которое можно создать в любом графическом редакторе. Сохранить созданный файл очень желательно в формате .ico и с названием favicon, так как этот формат поддерживают все браузеры, в отличие от .png и др.
Однако не обязательно искать редактор и учиться разбираться в нём, для тех кому это не нужно существуют бесплатные онлайн сервисы по созданию favicon.
1. Создайте файл favicon.ico
Если вы создаете файл в графическом редакторе сами, то не забудьте - его разрешение должно быть 16x16 пикселей. Мы рекомендуем воспользоваться специальным онлайн сервисом, например, Favicon.cc.
Слева площадь для рисования вашей будущей иконки, справа вся палитра цветов, ластик, настройки прозрачности, подбор цвета и возможность подвигать полученный результат. Снизу вы сразу же видите получающийся результат на фоне вкладки браузера и кнопку скачать.
2. Скачайте иконку на компьютер
Когда ваш фавикон вас устроит - скачайте его на компьютер. Он будет автоматически создан в правильном формате и правильного разрешения. 
Если вы создавали его сами в графическом редакторе - сохраните как файл favicon.ico.
3. Загрузите файл на сайт
После создания фавикона загрузите его на сервер со своим сайтом в корневую директорию, и убедитесь что на всех ваших страницах между тэгами
<head></head>
прописан код
<link rel="icon" href="/favicon.ico" type="image/x-icon">.
Если вы жаждите увидеть ваш новый favicon сразу, то придется очистить кэш браузера и обновить страницу.
Комментарии
28 октября 2014 в 19:36
Клево, там еще есть куча готовых фавиконов на этом сайте, можно ченить подобрать себе
7 ноября 2014 в 19:13
Гораздо удобнее чем заморачиваться в фотошопе и прочих пейнтах. Есть кстати еще русский такой же сервис, прям один в один, видимо как всегда нагло спертый скрипт. В общем сенкс, соорудил себе иконку, даже анимированную кстати можно сделать, только это пипец какое уже извращение получается)))
4 декабря 2014 в 14:52
За статью премного благодарен, все по делу, достаточно много кто это использует
10 апреля 2015 в 15:09
Thniknig like that shows an expert at work
9 июля 2016 в 12:20
С того момента, как вы сделаете картинку и разместите ее на своем сайте до ее появления в результатах поиска и в браузере может пройти время, так что не пугайтесь и не кричите, что не отображается фавикон потерпите.
Оставить комментарий