Как Создать Favicon

Уважаемые блогеры и вебмастера, favicon — супер важная вещь. Никогда не забывайте делать ее уникальной при создании блога или сайта. Любой блог или сайт, который я создаю, обязательно заканчиваю добавлением фавиконки. Для меня это что-то вроде вишенки на торте, без этой вишенки торт выглядит не так вкусно.

Иконка favicon.ico — это то изображения которое вы видите обычно в браузере возле адреса сайта. Это достаточно важный атрибут уникальности сайта, несмотря на ее размеры 16х16 пикселей.

Я постараюсь, показать как я создал фавиконку для своего блога. Из многих сервисов для создания фавиконок я выбрал favicon.cc

Не судите строго мои дизайнерские возможности, я люблю минимализм. Итак, как создать favicon?

1. Заходим на сайт и видим перед собой экран из точек, который мы можем наполнить пошагово любыми цветами.
Как создать Favicon.ico
2. Сначала я создал черный фон, выделив все квадратики черным цветом.

Создайте фон Favicon

3. Затем белым цветом я выделил те точки, чтобы получилась надпись блог.
Favicon создана

4. Вот так выглядит моя фавиконка возле адреса моего блога теперь. Нажимаем «Download Favicon» и включается автоматическая загрузка в формате .ico
Загружаем Favicon

Потрачено времени — 2 минуты. Теперь поместите ее в корневой каталог своего сайта и она должна начать автоматически отображаться. Если иконка не отображается, то внесите в код страницы между тегами:

и

следующий код:

Теперь иконка отобразится точно!

Кстати, вы сможете создать иконку, если владеете Adobe Photoshop. Я, к сожалению, не умею работать в этой программе, поэтому для меня очень удобен favicon.cc.

Фавиконка — один из обязательных элементов в создании уникального дизайна блога, об этом я подробно писал в статье про обязательные элементы дизайна блога.

Как конвертировать изображение в формат ico

Если Вы не хотите рисовать иконку, что я не рекомендую, вы можете конвертировать изображение в любом формате в формат ico. Сделать это можно с помощью сервиса — Convert to ICO

Вот и все, фавиконка создана, продолжайте дальше работать на улучшением юзабилити и дизайна сайта! Совершенству нет предела!

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *