Как сделать несколько пикселей в фейсбук

Как сделать несколько пикселей в фейсбук

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

Для начала дам ссылки на все мои статьи о фавиконах, возможно это кому-то пригодится:

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

Проверка Favicon в поисковых системах Яндекс и Google

Чтобы узнать видят ли иконку любого сайта поисковики, даже не обязательно открывать сам сайт. Достаточно ввести в адресную строку браузера такой адрес:
Для Яндекса — http://favicon.yandex.net/favicon/www.yandex.ru (меняем www.yandex.ru на свой домен).
Для Гугла — http://www.google.com/s2/favicons?domain=www.google.com (вместо www.google.com подставляем имя проверяемого сайта).

Заметил, что Гугл показывает иконки не на всех сайтах. Например, вместо моей, так же, как и на некоторых других блогах, показывает значок земного шара, хотя мой фавикон давно отображается и в поиске Яндекса, и во всех браузерах. Поэтому я просто не обращаю на это внимание. Возможно, это связано с тем, что на этом блоге файл favicon.ico установлен с помощью настроек моей темы WordPress.

Как добавить фавикон в Яндекс? Специально это делать никак не надо. Если вы добавили иконку размером 16х16 пикселей в корневую папку и корректно прописали к ней путь, то Yandex проиндексирует сайт специальным роботом и загрузит вашу картинку на свой сервер. Ждать, пока она появится в поиске раньше можно было долго, так как база фавиконок обновлялась редко. Сейчас, если дольше двух недель ваш фавикон не отображается в поиске Яндекса, надо проверить, корректно ли он оформлен.

Для начала советую сделать проверку с помощью сервисов-валидаторов, а затем воспользоваться рекомендациями Яндекса.

Проверяем наличие иконки сайта в сервисах Favicon Validator

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

ifavicon.com

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

Favicon Validator

Переходим по адресу http://ifavicon.com/tools/favicon-validator и проверяем свой фавикон.

Проверяем фавикон на сервисе ifavicon.com

Favicon генератор

Создание фавикона с помощью ifavicon-generator

Favicon Grabber

Вытаскиваем значок с сайта с помощью Favicon Grabber

Понятное дело, если удалось вытащить значок с сайта, значит, он там правильно был установлен.

favicon.htmlkit.com — создание и проверка валидности Favicon

Этот сервис более популярен и имеет просто огромный функционал по созданию и проверке Favicon. Одной из его особенностей является большое количество редактируемых параметров изображения и возможность создавать иконки для iPhone, iPod Touch и iPad браузеров. Давайте в картинках и по порядку.

Создание Favicon

Можно сделать иконку из значка в Твиттере

Делаем иконку сайта из значка в Твиттере

или из любой картинки.

Создание Favicon из любого изображения

Загрузив изображение и нажав кнопку “Generate FavIcon.ico“, можно скачать статичный и анимированный фавикон или продолжить редактирование, тиснув на кнопку “Edit“.

Редактирование Favicon

Перед нами открываются все настройки редактирования. Чтобы перейти к нужной настройке, надо щелкнуть на соответствующий пункт. Покажу, как это выглядит с переводом в Хроме:

Настройки редактирования Favicon

Если в нескольких словах, то можно:

добавить еще несколько изображений, которые остаются в памяти и можно в любой момент продолжить их редактирование; написать текст для анимации (только на английском) или отключить ее; сделать favicon для iPhone, iPad и iPod Touch; задать цвет и прозрачночть фона и рамки; преобразовать цветную картинку в черно-белую; создать фавиконки разных форматов с разным количеством цветовых оттенков (например, 16-64K – иконка 1616 с 64K цветов); удалить ненужные форматы и скачать весь пакет, только файл favicon.ico или animated_favicon1.gif.

Все изменения отображаются в правой части экрана.

Можно создать favicon для iPhone, iPad и iPod Touch

Чтобы очистить список созданных фавиконов и начать редактирование нового, надо нажать кнопку “New Icon” в правом верхнем углу.

Кнопка для создания нового Favicon

Есть подсказка, как установить анимированный фавикон вместе с обычным. При нажатии на кнопку “Загрузите“, скачается пакет со всеми фавиконами, где в файле ReadMe.txt будет подробная инструкция по их установке и необходимые коды.

Установка Favicon на сайт

В общем, советую всем попробовать этот сервис. Кроме всего, существует приложение для браузера Google Chrome, которое называется FavIcon from Pics. Ссылку не даю, так как целесообразность его установки вызывает сомнение. Все, что оно дает, это прямой переход на страницу с генератором фавиконов.

Приложение FavIcon from Pics для браузера Google Chrome

Как проверить Favicon

Теперь, собственно, перейдем к тому, из-за чего я начал писать эту статью — как сделать проверку, если не отображается Favicon. Переходим по ссылке http://www.htmlkit.com/go/favicon/validator/, вводим адрес проверяемого сайта и жмем “Check“. Ниже вы можете увидеть, какую информацию можно будет узнать.

Проверка Favicon на сервисе www.htmlkit.com

Получаем результат:

Результат проверки фавикона

Если фавикон не будет найден, то сервис укажет причину, почему это произошло.

Если же ошибок не найдено, но все равно Яндекс не видит фавикон сайта, читайте статью Платона Щукина “Вся правда о фавиконках“. В ней он перечислил 5 причин, почему не отображается фавикон в поиске Яндекса. Если и эти рекомендации не помогут, то надо написать о своей проблеме Платону в службу поддержки.

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


Понравилась статья? Нажимай на кнопки: