Как создать и установить фавикон на сайт?

Содержание статьи

Фавикон — маленькая картинка квадратной формы. Фавикон даёт множество мелких бонусов в плане привлечения пользователя к вашему сайту:

  1. Увеличивается кликабельность по вашему сайту в поисковых системах. Как вы думаете, на какой сайт пользователь обратит больше внимания: с привлекательным фавиконом, либо без?
Фавикон в поисковой выдаче
Фавикон в поисковой выдаче
  1. Когда у пользователя открыто множество вкладок среди которых затерялся ваш сайт, пользователь быстрее его найдёт, когда у сайта есть заметный фавикон.
  2. Ну и в третьих, сайт у которого есть уникальный фавикон на много лучше запоминается пользователями.

Стандартный размер фавикона — 16×16 пикселей. Изначально фавикон можно создавать большего размера. Например, 32×32 пикселя. Поисковая система или ваш браузер сами автоматически уменьшат его до нужных размеров. Расширение у картинки-фавикона должно быть .ico (не .jpeg или .png).

Как сделать фавикон для сайта?

Существует несколько способов создания фавикона

  1. Воспользоваться различными генераторами фавиконов или онлайн сервисами. Один из наиболее популярных — www.favicon.cc. Фишка этого сервиса в том, что сразу под визуальным редактором можно увидеть как будет выглядеть фивикон в вашем браузере.
Генератор фавиконов
Генератор фавиконов
  1. Найти красивые картинки (желательно изначально квадратной формы) в интернете. Можно так и набирать в поисковой системе «Фавиконы для сайта». Далее картинку нужно обрезать или уменьшить до размеров фавикона!
  2. Мой любимый способ — нарисовать в фотошопе. Этот способ мне нравится больше всего, так как в фотошоп предоставляет безграничные возможности для редактирования нужной мне картинки: можно сделать тень, отражение и прочие мелкие фишки. Если пользоваться фотошопом вы не умеете, то вполне подойдут первые 2 способа.

Если пользоваться фотошопом умеете, то просто создаёте новый проект размером 16×16 пикселей, либо 32×32 пикселя. Далее можно либо с нуля нарисовать рисунок или написать надпись, либо поместить картинку и отредактировать её. И не забываем сохранять полученное изображение в формате .ico

Как установить фавикон?

Итак, фавикон у нас уже есть. Далее нам нужно установить его на сайт. Для этого после тега <head> вставляем следующий код:

<link rel=»icon» href=»http://ваш-сайт.ru/путь_к_иконке/favicon.ico» type=»image/x-icon»>

<link rel=»shortcut icon» href=»http://ваш-сайт.ru/путь_к_иконке/favicon.ico» type=»image/x-icon»>

В WordPress я перешёл из левого меню по вкладке «Внешний вид->Редактор» и нашёл файл header.php. В него я вставил код, заменив путь к картинке (фавиконке), которую я загрузил на свой хостинг.

Не забудьте так же загрузить ваш фавикон на хостинг.

Спустя время поисковой бот перепроверит наличие фавикона на вашем сайте. Когда это произойдёт, в поисковой системе начнёт отображаться картинка на против вашего сайта. По причине того, что данный поисковой бот заходит очень редко на сайт, эта процедура может занять около месяца, если фавикон был установлен после индексации вашего сайта.

А вот что получилось у меня:

Мой фавикон
Мой фавикон

Если после установки фавикона он у вас не отображается во вкладке браузера, попробуйте очистить кэш или несколько раз подряд нажмите клавишу F5, чтобы страница не успевала обновляться. Обычно этот способ помогает.

Не получили ответа на свой вопрос? Спросите у специалиста Руководитель ответит на все ваши вопросы и даст рекомендации
Спросить Опыт 10 лет Бесплатно
Оцените статью
0 0
Роман
Want create site? Find Free WordPress Themes and plugins.

Благодаря вам поставил на свой сайт фавикон.

Did you find apk for android? You can find new Free Android Games and apps.
14.07.2013 в 19:23 Ответить