Yandex не отображается. Favicon: все что вы о нем не знали. Что делать, если фавикон не появляется в поисковиках

Всем привет! Добро пожаловать на наш блог , а на связи, как всегда, мы – Андрей и Даша. Как ваши дела, уважаемые читатели? Как и обещали, в этой статье мы займёмся серьёзными делами, а именно продолжим усовершенствование блога и тема сегодняшней статьи – Почему не отображается favicon (фавикон) и как это проверить.

С открытием дачно/деревенского сезона времени на блог становится всё меньше: стабильно, каждую пятницу по воскресенье мы уезжаем из города и погружаемся в мир грядок и сельской жизни…но, будем стараться это исправлять!

Изначально, иконку для блога мы . Сами создали в редакторе картиночку-логотип и загрузили её на блог при помощи раздела «Свойства сайта». Стали ждать первой индексации, чтобы можно было увидеть наши старания. Первым наш блог проиндексировал google, но у этого поисковика не отображается favicon при выдаче запросов. Ладно, стали выжидать, когда к нам заглянет yandex и произошло это примерно через месяц после нашего старта. В результате, после того, как мы ввели в поиск Яндекса один из запросов блога thebizfromscratch, нас ждала грусть/тоска/разочарование, т.к. наша иконка не отображалась перед описанием сайта.

Что же делать? Прокопались пару-тройку часов в интернете, чтобы изучить данную проблему поподробнее. Поняли, что мы такие не одни и приступили к устранению неудачи. Дело в том, что все, кто настраивает свой логотип при помощи темы, имеет шанс столкнуться с такой же ситуацией – не отображается favicon перед описанием блога в яндексе. Единственным верным решением является небольшое изменение кода, установленной темы. Не стоит пугаться, никаких глобальных навыков программирования вообще не требуется, честно говоря даже любых навыков не требуется. Нет, конечно, если ты матёрый программист – это только плюс, но если ты – «чайник» как и мы, то смотри!

Что надо сделать!

  1. Создаём иконку размером 16×16 или 32×32 пикселя с разрешением ico. Для этого удобнее воспользоваться специальным сервисом: favicon.ru, где можно с нуля нарисовать логотип или загрузить туда уже свой готовый, для того, чтобы изменить его размер и разрешение. В результате у тебя должна быть картиночка вот с таким названием — favicon.ico.
  2. Размещаем, полученную картиночку в корневую папку сайта.
  3. Заходим в админку WordPress, находим раздел «Внешний вид», далее «Редактор». С правой стороны выбираем вкладку «Заголовок» (или header.php).
  4. После открывающего тега (а где он смотри на рисунке ниже) прописываем или вставляем вот эту строчку и обновляем файл:

Где http://ваш сайт /favicon.ico – это путь до вашего фавикона. Только не забудьте вместо «ваш сайт» на самом деле указать ваш сайт.

  1. Ждём до следующего посещения роботами сайта и смотрим на результат. У нас это произошло спустя 2-3 дня. Проблема была решена. Ура.

Как проверить отображается ли favicon?

  • Для яндекса вводим в адресную строку это:

http://favicon.yandex.net/favicon/свой домен

  • Для гугла:

http://www.google.com/s2/favicons?domain=свой домен

И на этом мы заканчиваем. Надеемся, что данная статья будет для Вас полезной и теперь вы будете знать Почему не отображается favicon (фавикон) и как это проверить. Если появятся вопросы – обязательно задавай их в комментариях, постараемся помочь. Удачи! И до новых постов.

С уважением, Андрей и Даша.

всего

Яндекс.Вебмастер не видит favicon и sitemap

Переход на HTTPS протокол, «вызывает» у обновленного инструмента Яндекс.Вебмастер, крайний «интерес». Яндекс заваливает меня письмами, что он чего то не видит, чего то не нашел. Первыми письмами были сообщения, что Яндекс вебмастер не видит favicon и sitemap сайта https.

Переход на безопасный протокол, сродни переезду на новый домен. Без редиректа сайта http на сайт https, у вас, по факту, два одинаковых сайта в двух разных каталогах: и (названия могут быть другие). Есть два мнения по оптимизации сайта на https:

1. Первое, нужно сразу сделать переадресацию сайта http на сайт https и выполнив работу в инструментах веб-мастеров, ждать индексации. Этот способ убьет тИЦ сайта до следующего апдейта и значительно снизит трафик. 2. Второе мнение, что не нужно сразу делать переадресацию сайта http на сайт https, а подождать полной индексации нового сайта https и после перенаправить http на https.

Справедливости ради нужно отметить, что инструментами веб мастеров и Яндекс, и Google рекомендован первый вариант перехода.

Напомню, что вы должны были сделать в Яндекс.Вебмастер, после перевода (SSL).

  • Добавить сайт https:// в Яндекс.Вебмастер, как новый сайт.
  • Если вы сразу сделали редирект сайта http на сайт https, то после добавления сертифицированного сайта для подтверждения прав на сайт достаточно выбрать свой способ проверки сайта и нажать проверку.
  • Если вы пошли другим путем, и в целях сохранить трафик сайта, не стали сразу делать редирект и оставили в сети два сайта https и http, вам нужно подтвердить права на «новый» сайт https по всем правилам системы. Напомню, что безопасный сайт https лежит в каталоге .
  • После добавления нового сайта https в Яндекс.Вебмастер вам нужно сделать все настройки Яндекс.Вебмастер, который вы делали для сайта http: добавить карту сайта, проверить robots.txt, и т.д. и т.п.

Если вы предварительно всё это сделали, то велика вероятность, что письма, что Яндекс веб мастер не видит favicon и sitemap сайта https, придут с опозданием. Поэтому без ожидания писем, делаем проверки:

Проверка Sitemap

Если вы не делали переадресацию http на https, карту сайта нужно предварительно сделать и залить в корень сайта https.

Откройте в браузере, Sitemap «нового» сайта: https://вашдомен.ru/sitemap.xml.

Проверка Favicon сайта

Напомню, favicon (фавикон) сайта это картинка, которую браузер показывает в адресной строке рядом с вашим сайтом.

Чтобы проверить Favicon сайта для Яндекс, сделайте запрос: //favicon.yandex.net/favicon/exemple.edu , где exemple.edu замените на свой домен.

Если по этому запросу вы видите свой фавикон, Яндекс спешит с отсылкой писем и просто нужно подождать, пока Яндекс фавикон проиндексирует. Можно ускорить индексацию фавикона и на вкладке Индексирование>>>Переобход страниц добавить url своей иконки.

Если вы не видите свой фавикон по запросу, и более того не видите фавикон в панели вебмастера рядом с новым сайтом https, проверьте следующее:

  • Если ли вообще файл favicon в корне сайта;
  • Нет ли ошибок в названии: и расширении;
  • Возможно, нужно заменить иконку в рабочем шаблоне сайта или просто его добавить;
  • Очистите кеш своего браузера.

Favicon - это маленькая иконочка, графическое изображение, призванное охарактеризовать ваш сайт, своеобразный маленький логотип, лейбл интернет-ресурса. Какую роль играет Favicon в жизни сайта, как и где он рисуется, кому и где показывается... На эти и другие вопросы попытаюсь дать расширенный ответ.

Favicon: история развития

Favicon придумали в Microsoft: в 1999 году в Internet Explorer 5 разработчики включили поддержку значка для сайта (это был файл с именем favicon.ico), он показывался в списке избранного и рядом с URL в адресной строке, только если страница находилась в закладках. Придумано это было не для красоты, администраторы сайтов могли узнать, сколько пользователей внесли их сайт в закладки (можно было оценить по количеству обращений к файлу Favicon). В настоящее время Favicon, естественно, работает для других целей.

Favicon: сегодня

Favicon сегодня утратил первоначальное значение - сокр. от англ. FAVorites ICON - «значок для избранного», сегодня это логотип веб-сайта, отображающийся браузером в адресной строке перед URL страницы, выводящийся в некоторых поисковых системах в результатах поиска, использующийся в элементах интерфейса программ, работающих с сайтом и т.д.

Favicon.ico сайта сайт в результатах поиска Яндекса

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

Требования к Favicon

Изначально Favicon носил размер 16×16 пикселей и имел графический формат ICO (это формат хранения значков файлов в Microsoft Windows, аналогичен формату CUR, предназначенному для хранения курсоров там же). Впоследствии, на практике начали использовать и внедрять в браузеры такие форматы как PNG, GIF, JPEG, APNG, SVG и даже анимированные GIF. Тем не менее, кроссбраузерным остался все тот же ICO. Посмотрите на таблицу поддержки форматов Favicon браузерами, чтобы решить для себя какой формат лучше использовать на своем сайте:


Где взять Favicon?

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

Способ первый: рисуем Favicon сами или заказываем у художников

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

http://www.xiconeditor.com/
http://www.favicon.cc/
http://antifavicon.com/
http://favicon.ru/
http://faviconist.com/
http://favicon.by/
http://www.genfavicon.com/

Способ второй: находим тематический Favicon из числа созданных

Целесообразно иметь уникальный (ручной работы) Favicon, но и ничего плохого не будет в том, если вы позаимствуете уже кем-то нарисованный. Дело в том, что в интернете существуют миллиарды Favicon и вероятность того, что ваш и чей-то Favicon могут перепутать - практически равна нулю. Разумеется, я не призываю использовать чьи-либо логотипы, которые защищены авторскими правами - их не нужно использовать ни в коем случае!!!

Где искать Favicon? Заходим в вбиваем в строку поиска ".ico ", выбираем "Картинки" - "Инструменты поиска" - "Размер" - "Точный размер" - "16х16"

Регистрируем Favicon

После того, как мы обзавелись картинкой Favicon, мы должны ее зарегистрировать, как для своих браузеров, так и для поисковых систем. Честно говоря, поисковые системы по умолчанию ищут Ваш Favicon в корне сайта, поэтому регистрация для них необязательна. Тем не менее, существует возможность явно указать положение Favicon в HTML-коде и это полезно, например, если вы хотите указать Favicon разных типов (для разных браузеров), для разных страниц свой Favicon и т.д. Для этого добавляем строчку в свой HTML-код (внутри элемента ):

При этом:

  • rel может содержать «shortcut icon» (при этом IE будет реагировать на строку «shortcut icon», а браузеры, соответствующие стандартам, - на слово «icon»)
  • href может к файлу
  • форматом файла может быть png или gif, размером 16x16 или 32x32 и с 8-битной или 24-битной глубиной цвета

После того, как вы прописали вызов Favicon внутри , поместили сам Favicon в корень своего сайта, наберите в браузере:

http://ваш_сайт/favicon.ico

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

Как проверить Favicon в Яндексе и Google

Какой Favicon закрепила за Вашим сайтом поисковая система? Проверить это очень просто:

Какой Favicon зарегистрировал Яндекс?

http://favicon.yandex.net/favicon/ваш_сайт.ru

Какой Favicon зарегистрировал Google?

http://www.google.com/s2/favicons?domain=ваш_сайт.ру

Подставляем вместо ваш_сайт.ру свой домен и видим закэшированный Favicon для своего сайта.

Надеюсь, из моей беглой статьи, узнали для себя что-то полезное!

Вконтакте

Оцените материал:

The favicon is a small image (site icon) that is displayed next to the site in the Yandex search results, next to the site URL in the browser address, and next to the site name in “Favorites” or in “Bookmarks” instead of the standard default picture.

Example of a favicon:

In the search results, the favicon looks like this:

How do I add a favicon?

To have the favicon displayed in the search results, you need to place an image (favicon.ico file) of 16×16 pixels in the root directory of the site. The preferred icon format is ICO, but other formats are also possible: GIF, JPEG, PNG and BMP.

You should make sure the HTTP headers sent by the server contain the correct type of the transmitted data (Content-Type .

    image/x-icon or image/vnd.microsoft.icon for the ICO format.

    image/gif for the GIF format.

    image/jpeg for the JPEG format.

    image/png for the PNG format.

    image/bmp for the BMP format.

To describe the favicon in the HTML code of the pages, add the following code to the element:

If your favicon is not at the root, specify the file path in the href field.

If the favicon is placed correctly, and if there is at least one page of your site displayed in the Yandex search results, the favicon will be displayed in the search after the site is crawled by the robot. For information about the robot that indexes the icons, go to the corresponding help section.

How do I change the favicon?

To have another favicon displayed next to your site in the Yandex search results, change the favicon.ico file in the root directory of the site and wait for the robot to index the changes.

If in the page code contains several favicons, the robot will index the one indicated first.

How do I delete a favicon?

It takes about three weeks after you remove the favicon from the site until it is removed from the Yandex search results.

Честно, я очень люблю фавикон. Я питаю к нему сколь глубокую, столь же и целомудренную платоническую любовь. Это не значит, что я рассказываю знакомым вебмастерам байки о том, как я сменил фавикон и трафик вырос на 10% (хотя постойте… может такое и было), но значит, что когда фавикон моего нового сайта появляется в индексе Яндекса, то сам сайт начинает казаться мне чуть более СДЛьным.

Что такое фавикон?

Фавикон (Favicon – сокращение от «favorite icon») — это изображение, которое отображается в адресной строке браузера перед адресом, во вкладке, соответствующей окну с открытой страницей сайта, а также при добавлении ресурса во вкладки с избранным. Эти изображения могут помочь пользователю лучше запомнить бренд или компанию, повысят узнаваемость сайта. Часто в качестве фавикона используют уменьшенное или немного переделанное в соответствии с форматом изображение логотипа компании или бренда.

Преимущества использования фавикона

Использование favicon приносит пользу со временем. Вот например зацените такие варианты:

  • Когда пользователь открывает много вкладок в браузере, он может сразу определить, на какой из них находится сайт, даже если текст с названием уже не отображается;
  • В выдаче Яндекса фавикон отображается слева от сайта или его страницы, что привлекает внимание посетителей и отличает его от других;
  • Картинка хорошо запоминается и остается в памяти – в результате сайт становится более узнаваемым и привлекательным для пользователей.

Таким образом, фавикон – часть образа сайта, которая выполняет не только эстетическую функцию, но и делает более удобным для пользователя поиск портала в закладках, вкладках, выдаче.

Особенности работы Яндекса с фавиконками

Поисковая система Яндекс – одна из немногих, которые выделяют фавиконы сайтов и отображают их при построении списка результатов поиска. Для этого специальный бот периодически индексирует сайты и обновляет информацию о наличии у них фавиконок.

Раньше апдейты фавиконок происходили раз в пару месяцев. Сейчас, в 2018, Яндекс индексирует их гораздо бодрее и на некоторых моих новых сайтах favicon появляется уже через несколько дней.

Чтобы проверить, отображает ли Яндекс favicon, можно найти свой портал в списке выдачи и посмотреть, видна ли иконка слева от него. Также можно вписать в адресную строку следующую конструкцию: для Яндекса - http://favicon.yandex.net/favicon/www.site.ru (где вместо www.site.ru нужно напечатать домен своего сайта). Правильно созданный Фавикон отобразится на черном фоне, и это значит, что Яндекс его видит.

Если фавикон не виден, это может быть связано со следующими причинами:

  • Размер изображения не соответствует требуемому: 16х16 пикселей;
  • Формат изображения не тот – должен быть ico, jpeg или png (первый вариант – более предпочтительный для Яндекса);
  • Картинка размытая или не уникальная – иногда по этим причинам поисковик блокирует иконки;
  • У Яндекса происходит обновление системы – тогда спустя какое-то время все должно исправиться само;
  • Сайт находится далее сотой позиции в выдаче – в этом случае фавикон тоже может не отображаться.

Проверив картинку по этим критериям, нужно исправить недостатки. Если и после этого не отображается иконка, можно обратиться в поддержку Яндекса.

Чтобы фавикон отображался в Яндекс.Директе, он должен быть правильно оформлен и находиться в нужном месте на сайте. Тогда поисковой робот Яндекса проиндексирует его и начнет показывать в выдаче. Происходит это обычно через 2-4 недели после публикации сайта с изменениями. Уведомлять или просить Яндекс о публикации фавиконки не нужно, это произойдет автоматически по прошествии определенного времени после ее появления на портале.

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

Если вы хотите создать из большого изображения в формате, например, png, ico-файл, то вам не помешало бы поставить Adobe Photoshop для начала. Затем устанавливается плагин ICO для Фотошопа (поищите в поисковике плагин для вашей версии ФШ). Когда он установлен, мы копируем нужный файл ICOFormat.8bi (для 32-бит) или ICOFormat64.8bi (для 64-бит) по одному из следующих путей:

C:\Program Files\Adobe\Adobe Photoshop CS6 (64 Bit)\Plug-ins\File Formats
C:\Program Files (x86)\Adobe\Adobe Photoshop CS6\Plug-ins\File Formats

Если папки «Plug-ins» или «File Formats» нет, то ее необходимо создать. Теперь при диалоге сохранения можно выбрать ico формат. Размеры создаваемых значков могут быть кратны 8 (16×16, 24×24, 32×32 и так далее, но надежнее всего выбрать именно 16×16).

Затем изображение, которое должно стать фавиконом, открывается в Фотошопе. Жмется “Image – Image Size” и размер изображения меняется на 16х16 пикселей. Затем жмется “File – Save as” и выбирается формат ICO (название файла нужно сделать favicon.ico).

Сам я в последнее время перевожу изображения в ico формат без фотошопа. С помощью сервиса https://realfavicongenerator.net/ .

< link rel = ”shortcut icon ”href = ”/ favicon . ico ”type = ”image / x - icon ”/ >

< link rel = ”icon ”href = ”/ favicon . ico ”type = ”image / x - icon ”/ >

Через некоторое время фавикон появится на сайте.

Некоторые умники делают фавикон в виде стрелки, треугольника, добавляют красные элементы, чтобы «юзер кликал». Так, конечно, можно делать, но за такое сайт могут искусственно занизить.

Яндекс пугает фавиконных очкошников

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

Сервисы

Для создания иконок также существуют специальные программы и ресурсы, среди которых популярностью пользуются:

  • favicon.cc – простейший редактор позволит создать несложное изображение, принцип работы немного напоминает Paint. Также выбираются цвета, и выполняется рисунок нажатием на пиксельные квадраты, которые нужно закрасить. Есть инструмент для исправления. Созданную картинку здесь же можно сохранить на компьютер в качестве готового изображения favicon. В процессе работы внизу экрана можно наблюдать предварительный результат в том виде, в каком он будет отображаться в браузере. Ресурс также предлагает большой выбор готовых иконок;
  • favicon.ru – здесь лучше создавать фавиконы из уже готовых изображений. Картинка загружается с компьютера, обрабатывается системой и преобразуется в файл favicon.ico, который затем можно скачать;
  • iconj и audit4web – базы, в которых можно найти готовые фавиконы.

Есть и такой сервис:

Можно обратиться за разработкой изображения и к дизайнеру, но это обойдется существенно дороже.

Еще такой момент — изображение для иконки не может быть анимированным, оно всегда неподвижно, даже если в основе была использована картинка с любыми не статичными эффектами.