Как создать иконку для сайта или блога

В этом посте я расскажу, как сделать иконку для блога, по-другому ее еще называют favicon .

Что такое favicon? — это небольшая картинка в формате .ico, имеющий размеры 16 на 16 пикселей и цветовую гамму TrueColor, которая отображается рядом с адресом вашего сайта, в адресной строке браузера и рядом с названием вашего сайта в «Избранном» или в «Закладках».

Сделать favicon можно в любом графическом редакторе, который поддерживает этот формат. Но проще и быстрее сделать иконку в он-лайн сервисе.

Варианты создания иконки

Первый вариант

Все делается достаточно быстро, у вас уже должна быть готовая картинка, из которой необходимо сделать иконку, для этого проходим следующие шаги:

1. Переходим на сайт Favicon.ru

2. В поле «Обзор…»  выбираем картинку с вашего компьютера. После чего жмем «Создать favicon.ico!»

3. Далее нажимаем на кнопку «Скачать favicon.ico!» и сохраняем ее.

Второй вариант

Для любителей креатива, то есть нарисовать иконку самостоятельно.

1. Заходим на сайт favicon.cc . Перед нами открывается страница с полем для рисования по центру и палитрой в правой колонке.

2. Выбираем нужный цвет и…рисуем нашу будущую иконку. Все лишние детали можно потом удалить ластиком. Чуть ниже можно посмотреть превью с иконкой.

3. Сохраняем нашу иконку, нажав на «Download Favicon».

Установка Favicon на блог Вордпресс:

•  Загружаем нашу иконку favicon.ico в корневую папку на хостинге. Обычно это путь: название_блога/docs/favicon.ico

•  Переходим на ваш блог в раздел Внешний вид –> Редактор .

• Вставляем HTML код в главный файл вашего сайта header.php перед закрывающимся тегом </head>.  Соответственно, вместо ваш_сайт, впишите адрес вашего блога.

<link rel=»shortcut icon» href=»http://ваш_сайт/favicon.ico» type=»image/x-icon» />
<link rel=»icon» href=»http://ваш_сайт/favicon.ico» type=»image/x-icon» />

•  После того как указали путь и вставили код, нажимаем внизу «Обновить файл»

Если вы не увидите иконку сразу необходимо подождать некоторое время, пока сервер не обновит файлы.

Каким должен быть фавикон?

Пару советов по созданию иконки.

•  Фавикон должен хорошо ассоциироваться с сайтом.

•  Должен быть прост для восприятия, пользователь должен сразу понять что изображено на иконке. Не стоит пытаться разместить в фавиконе целую картину, но и «Квадрат» Малевича, думаю, тоже мало что скажет.

• Фавикон по сути является визитной карточкой, точно так же как и дизайн вашего блога/сайта, поэтому он должен быть выполнен в одном стиле.

Если будут вопросы, задавайте их в комментариях. Удачи 🙂