Как сделать и загрузить иконку сайта

Иконка сайта или favicon – это идентификатор вашего ресурса. По нему пользователи будут его узнавать. И так как у людей более развита визуальная память, favicon имеет большое значение на получение популярности сайта.

Особо важна индивидуальная иконка, если пользователь во время web-сёрфинга открывает сразу много страниц во вкладках браузера. Тогда надписи видны не будут, пока не навести на них мышь, и чтобы среди всех вкладок найти ваш сайт, посетитель будет ориентироваться по favicon.

Как сделать favicon

Чтобы установить индивидуальную и неповторимую иконку для сайта, её нужно будет сделать самому, так как скачанные в интернете будут не только на вашем сайте. Дело пяти минут времени.

Favicon – это изображение в формате png с разрешением 16 на 16 или 32 на 32 пикселей. Сделать такую можно на Photoshop или каком-то другом редакторе изображений, поддерживающим определённые функции.

Для удобства рекомендуется сделать изображение побольше, например 256 на 256 пикселей. А потом просто уменьшить его до нужных размеров.

Некоторые старые версии Internet Explorer могут демонстрировать иконки сайтов только в формате ico. Поэтому, если ваша ЦА имеет такой браузер, то сделайте для них специфическую favicon.

Сервис favicon.cc позволяет создавать иконки в режиме онлайн. Здесь можно нарисовать её вручную, экспортировать в нужный формат и установить на сайт.

Как установить favicon в Word Press

Word Press предлагает web-дизайнерам три способа установки и замены favicon:

Через настройки панели;

С помощью плагинов;

С помощью редактирования кодов.

Если тема Word Press позволяет редактировать иконку, то сделать это можно через настройки темы в разделе Fav icon option. Там можно загрузить свою иконку, увидеть её на предпросмотре и сохранить для сайта.

Если тема таких опций не поддерживает, то придётся установить дополнительные плагины. Для добавления и изменения favicon подойдут Insert Headers and Footers и All In One Favicon. После их установки появляется возможность редактировать картинку иконки сайта.

Для продвинутых пользователей можно предложить третий вариант. Файл иконки следует загрузить на FTP в корневой каталог: http://сайт/favicon.png Затем редактируем тему в файле header.php. Здесь после тега <head>, нужно вставить следующее:

<link rel=”icon” href=”сайт/favicon.png ” type=”image/x-icon” />

<link rel=”shortcut icon” href=”сайт/favicon.png ” type=”image/x-icon” />

И сохранить.

После этого у сайта появится новая загруженная иконка.

Вы можете пройти бесплатный обучающий курс.

9 комментариев

Оставить комментарий
  1. Действительно мало создать сайт его ещё надо наполнить всякими фишками для удобства, красоты, интедификации.

  2. все хорошо описано будем делать!

  3. Инна Дунаева

    Спасибо, очень полезная информация.

  4. Адель Гадельшин

    Наш сайт не закроется и всегда будет наполнятся новыми и интересными материалами.

  5. Борис Живило

    Благодаря этой статье установить favicon оказалось очень легко!

  6. Невероятное количество полезных уроков) Благодарю за возможность создания сайта за короткий срок!

  7. Благодарю, Адель, за информативные курсы ( не люблю слово тренинг), за профессионализм, за полезность. Удачи Вам.

  8. Мне кажется, что фавикон интересная деталь в костюме сайта.

  9. Очень хорошо и понятно изложено.

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

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