Сделать информационный, обучающий сайт про создание сайта и не написать статью о таком маленьком, но важном элементе фавиконке веб-ресурса просто не простительно. Тем более, что при отсутствии подобного элемента, после добавления новый ресурс на Яндекс Вебмастер, он начинает моментально реагировать на отсутствие данного значка, ругается, и убедительно рекомендует создать фавикон для сайта и загрузить его на новый виртуальный ресурс по всем правилам.
Действительно данный значок, вроде маленький и не значительный, но из-за него такого сыр-бор просто удивительно. Но всем известно, что пререкания с Яндексом ничему хорошему не приведет то важно следовать рекомендацию поисковика и создавать значок просто необходимо.
Что такое Фавикон и как его создать?
Сам по себе это маленький значок, который отображается рядом с https адресной строке браузера и выглядит довольно беспомощным. Он же такой маленький. Но поисковики его любят, не зря же он переводится с английского языка «FAVoritesICON» — «значок для избранного»
Фирменные сайты как правило заказывают фавикон, который содержит или символ фирмы или первую букву компании, для которой создается сайт. А рядовые вебмастера могут сделать фавикон онлайн по своему усмотрению, и могут творчески подойти к созданию значка, но фантазировать что-то оригинальное.
Обычно картинка данного значка выбирается в размере:
- 16х16;
- 32х32;
- 120х120;
Это все прямо из рекомендации Яндекс Вебмастера, формат картинки могут быть:
- GIF;
- JPEG;
- PNG;
- и BMP.
Однако для правильного отображения на сниптете сайта и без проблемной загрузки, опят же Яндексом рекомендуется, чтобы фавиконка была в формате ICO. Но честно говоря, в подобном формате значка я не смог загрузить на свой последний сайт. Ранее это мне удалось, и на моем другом сайте стоит фавиконка в формате ICO.
Проблемы с загрузкой в формате ICO
Таким образом, последний раз мне не удалось загрузить его в данном формате. Правда, потом узнал, что это WordPress сам не дает загрузить картинку в таком формате, т. е. формат фавикона не допускается из-за соображения безопасности. Оказыается у CMS есть определенный список файлов, которых можно занрузить на сайт, а формат ICO, как раз отсутствует в этом списке.
Поэтому я взял картинку в формате JPEG, и ничего все обошлось. И ничего страшного работает он у меня и на последнем сайте с таким форматом. Просто после загрузки фавиконки также важно добавить код в файл header.php в раздел head:
<link rel=»icon» href=»https://example.com/favicon.ico» type=»image/x-icon»>
Надеюсь ясно, что здесь https://example.com/favicon.ico — favicon.ico — это и есть ссылка на файл фавикон, т. е. ссылка на значок которую создали, image/x-icon и тип файла указывает в каком формате значок. Следовательно если у меня фавикон создан в формате JPEG то должен быть image/jpeg. Тгда код будет выглядеть таим образом:
<link rel=»icon» href=»https://example.com/favicon.ico» type=»image/jpeg»>
А здесь на рисунке видно, где я его добавил в header.php, и как раз в раздел head. Здесь просто нужно быть внимательным и обратить внимание, что он у меня фавикон в формате JPEG, я его отметил на картинке:
Вроде и все, подходит к концу наш привлекательный и интересный рассказ о том, как создать и установить фавиконку на свой сайт, только важно кое-что добавить:
«После завершения процедуры загрузки значка на сайт желательно проверить, работоспособность данного элемента. Файл должен открываться по переходу ссылке (ответ сервера 200 ОК) и важно проверить не запрещен ли индексации значка в файле robots.txt, если даже сам файл не запрещен, возможно запрещен каталог, где находится файл значка.»
Все, на этом финал поста, думается всем ясно, как сделать фавикон и установить его на сайт, и проблемы не возникнет ни у кого. А если даже возникнет, то рекомендуем еще раз перечитать статью.