Фавикон – как создать и установить на сайте

Фавикон – это маленький значок, который высвечивается во вкладке браузера. Впервые он появился в 1999 году у браузера Internet Explorer. Для того, что бы такой фавикон появился рядом с названием сайта необходимо было загрузить его в виде файла с именем favicon.ico в корневую папку.

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

Сейчас много поменялось и упростилось. Особенно для WordPress. Новая версия WP и последние шаблоны уже готовы к тому, что бы можно было загрузить фавикон через библиотеку медиафайлов.

фавикон 1Причем, предлагается загрузить изображение размером 512х512 px. Сделать это можно в опции Внешний вид – Настроить – Свойства сайта.

иконка сайта

Просто заходите в Яндекс или Google картинки, задаете параметры фильтра и получаете готовый фавикон.

фавикон размер

Желательно сделать его ярким и отличающимся от остальных сайтов, что бы иконка сразу бросалась в глаза пользователю. Зачем?

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

иконка фавикон

Требования Поисковика Яндекс

В Вебмастере Яндекса, в перечислении критериев проверки Яндекса, обязательно присутствует фавикон. Найти его можно в разделе Диагностика – Рекомендуемые.

Если фавикон будет не найден, вас обязательно об этом известят в кабинете вебмастера.

проверка

Что бы понять свои ошибки. пройдите по ссылке – Как исправить и внимательно прочитайте требования к фавикону.

проверка яндекса

Обратите внимание на расширение изображения. Расширение ico теперь не принимается. И обязательно поправьте размеры иконки. Тото, который нам предложил загрузить WordPress не проходит. Необходим 16х16, 32х32, 120х120. Связано это с тем, что теперь ваш сайт ищут на мобильных устройствах. А они отображают только выше перечисленные размеры.

Кстати, не обращайте внимание на ограничения размера WP. Он воспринимает нормально и 120х120 и 32х32

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

Ресурс, который я вам предложу довольно известен.

Давайте приступим к его созданию. Способов очень много. Я покажу Вам самый простой, благодаря которому  Вы создадите его сами.
Выходим на  http://www.favicon.cc/. Это очень простой и удобный ресурс создания фавиконов.

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

Ресурс создания фавиконаЧем удобен ресурс. Вы сразу же видите его генерацию  на ярлыке вкладки браузера.

Окно браузера ресурса

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

Скачать фавикон

Теперь переходим на страницу загрузки архива плагина All in one Favicon. Это универсальный плагин, благодаря которому,  вы можете загрузить на свой блог, созданные вами в различных форматах  (например – GIF или PNG), рисунки в размере 16Х16.

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

Настройка плагина
Выбираем окно загрузки. которое будет соответствовать расширению созданного фавикона и загружаем с Вашего компьютера. Сохраняем изменения. И любуемся своим произведением в ярлыке вкладки браузера рядом с названием  вашего блога.

Вот и все! Ваш ресурс теперь имеет уникальный логотип!

Ну вот и все, пожалуй. Как видите нет ничего сложного!

Как всегда, предлагаю Вам свою рассылку – “Инструменты в помощь начинающему блогеру”. Подписавшись на которую, будете получать всю последнюю информацию о настройках блога

Ну что же, удачной Вам работы! Будут вопросы или пожелания, пишите в комментариях. Если информация была для Вас полезной – делитесь ей со своими друзьями в социальных сетях

Комментарии 32

  • Здравствуйте, Ирина! Закачала плагин, но установить опять не могу! Не пойму, почему всё время с установлением плагина проблемы…Не принимает пароль http://FTP... Спасибо за урок!!!

  • Ирина, опять спасибо за урок. Теперь мои ученики по Ruelsoftu устанавливают фавикон по этому уроку!!!

  • Ирина.А скажите,пожалуйста,как сделать так,чтобы фавикон был на каждой странице или записи? Чтобы было как у Вас.Спасибо!

  • Добрый вечер, Ирина!
    Сделала фавиконы для двух своих сайтов. Спасибо за информацию! Как всегда, всё четко и ясно.
    Успехов!

  • Ура!!!!!!!!!! Фавикон получился! Огромное спасибо!

  • Спасибо, все просто и доступно каждому!!!!!

  • Ирина, спасибо за плагин фавикон. У меня все получилось, сразу не могла понять где можно увидеть, потом разобралась. Как приятно!!!

  • Добрый день, Ирина. Я часто захожу на Ваш блог. Всё написано грамотно и понятно. С Вашей помощью я создала свой фавикон. Большое спасибо.

  • я не хочу свое творчество. нашла картинку в гугли, а вставить не могу.

  • Отличный сервис. Только что им пользовался, впечатления очень положительные. Спасибо.

  • Спасибо, Ирина. Все здорово получилось!

  • Добрый вечер,Ирина! Не могу справиться с фавиконом. В Internet Explorere и на Вашем блоге все картинки,фотографии, иконки замещает фавикон. Где его удалить я не могу найти. Его нет ни в загрузках, ни в документах,ни в архиве, ни на дисках, ни в программах удаления,

  • Огромное спасибо, Ирина!!! Теперь и у меня есть свой фавикон!!! Удачи Вам!

  • Ира здравствуйте! Хотя чуть позже установила фавикон. Очень интересно получилось. Только смотрю у других -фото. Хочется, конечно фото, но уж очень интересно похудожничать на своем блоге. Спасибо.

  • Сделала фавикон по Вашей статье. Очень легко все получилось. Нравится. Не навязчиво, но блог становится уютным, нет пустот. Обустраиваюсь. Спасибо за Ваш сайт, в котором говорится не только ЧТО нужно делать, и КАК это делать.

  • Спасибо, Ирина, за очень полезную информацию. Все понятно. Попробую сделать. Есть только у меня вопросик – а сколько вообще плагинов может выдержать блог? За что не возьмись – плагин. У меня их уже 33. Еще и этот поставлю. Плохо блогу не будет? Плагины-то все ставлю нужные. Спасибо еще раз и удачи Вам.

    • Да, это нагрузка на блог. Поэтому опытные блогеры стараются вставлять коды, а не устанавливать плагины. Но 30 – это нормально. Проведите инспекцию. Может что-то не так уж и нужно блогу

  • Доброй ночи, Ирина! Скачала плагин и загрузила на блог. Он успешно установился. Только стала нажимать на кнопку “загрузить” в настройках, а она почему-то не нажимается. Не получилось у меня.

  • Ирина, добрый день! Прекрасный Ваш блог, благодаря которому, шаг за шагом совершенствуется мой блог. Плагин фавикон создала, только не поняла откуда взялась ссылка, при помощи которой загружается созданный фавикон. Заранее благодарна

    • Когда Вы создадите фавикон – нажимаете на кнопку – Download favicon (3 скриншот). У Вас появляется окно загрузки. Сохраняете свой фавикон на компьютере. А потом заходите в плагин, и около первого окошка нажимаете клавишу – Загрузить. Ищите свой фавикон и загружаете. Сохраняете обновление. Вот и все. Не получиться – выходите на связь. Все сделаем.

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

        • Удалите все, что связано с фавиконом: плагин, сам фавикон. и начните с начала. У вашего фавикона должно быть расширение ico. Вот это обязательно проверьте

          • Почему-то в самом плагине не получается указать путь к скачиванию файла на компьютере, при нажатии на кнопку upload ничего не происходит.
            Все удалила и скачала с официального сайта заново.

  • Ирина! Я поставила в фавикон свое фото, делала это по рекомендации Марины Гай- тоже Вашей ученицы.

  • Ой, как здорово!!! У меня тоже все получилось. Спасибо Вам Ирина за такие полезные статьи. На всех своих сайтах сделала фавикон. Мелочь, а приятно. Еще разспасибо.

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

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