Опубликовано 28.03.2018
Сам по себе этот значок с изображением вашего логотипа не является чем-то архиважным, но его наличие положительно воспринимается, как поисковиками, так и простыми пользователями.
Поэтому рекомендуется его установить, а мы расскажем, как это проще всего сделать.
Зачем нужна иконка сайта
Этот маленький логотип размером 16 на 16 пикселей есть миниатюрное отображение вашего сайта, которое можно увидеть во вкладке браузера рядом с заголовком страницы (так называемым, тайтлом).
Поисковик Google отображает его в результатах поиска перед названием, что дает возможность, среди прочего, быстро отыскать свой ресурс, пробежавшись глазами по выдаче.
Отсутствие иконки тоже будет выделять ваше творение среди других, но уже не в лучшую сторону.
Иконки сайтов в поиске Гугл
А когда у вас в браузере открыто множество вкладок, и они становятся совсем маленькими, то по иконкам можно легко ориентироваться, где какая вкладка находится.
Это значительно экономит ваше время. А время, как известно, деньги.
Найти взглядом вкладку с иконкой гораздо проще
Это, так сказать, основные плюсы от установки иконки.
В общем, сайт без этой важной картинки вызывает меньше доверия, отодвигая его в подсознании пользователя на задний план.
Как сделать иконку сайта
Есть множество вариантов от «скачать на специальных сервисах» целую коллекцию и выбрать подходящую, до «сделать своими руками».
Второй вариант предпочтительней, так как, скачивая уже готовую иконку, вы всегда имеете шанс увидеть в сети еще сайт с похожим, как две капли воды, логотипом. А это не есть хорошо.
Мы ведь только думаем, что очень оригинальны, на самом деле таких «оригинальных» вокруг много. И, если рисунок понравился нам, то велик шанс, что кто-то еще положит на него глаз.
Поэтому правильнее всего сделать этот маленький файлик самому.
Чтобы долго творчески не мучиться, выберите одну или пару букв из названия своего сайта на свое интуитивное усмотрение.
А потом в фотошопе или другой программе, с которой вы умеете работать, создайте файл размером 128Х128 пикселей и впишите буквы в это пространство, красиво разместив их относительно друг друга.
Осталось поиграться с цветом, шрифтом и позаботиться, чтобы буквы были хорошо видны, когда будут маленькими-маленькими…
Вообще-то, стандартный размер иконки 16х16 пикселей, но в таком размере вы ничего путного не нарисуете.
А квадрат со стороной 128х128 уже позволяет сделать какую-то творческую штуку.
Например, так:
Не шедевр, конечно, но он и не нужен. Всякие мелкие детали не будут видны все равно, поэтому, чем проще, тем лучше. Да и размер будет поменьше.
Так как для создания иконки со стандартным расширением .ico нужны специальные программы, то проще всего сохранить ваш рисунок в формате .png.
Все браузеры и поисковики прекрасно его понимают и читают, а вам будет проще работать с этим форматом.
Уменьшать его до размера 16Х16 или 32х32 не обязательно.
Также нет необходимости называть его стандартным именем favicon.ico, так как вы все равно указываете путь и название файла в специально созданной для этого строке в файле «шапки».
Как установить иконку на сайт
Осталось самое простое — установить готовую иконку на свой сайт.
Хотя, для кого-то может это и самое сложное)))
В любом случае, вначале узнайте, не поддерживает ли ваша тема загрузку иконки через админку Вордпресс, что для некоторых значительно упростит все манипуляции.
Добраться до меню вставки файла с рисунком можно, проделав путь:
Внешний вид => Настроить => Заголовок сайта
Опустившись вниз, можно увидеть меню вставки иконки:
Здесь, правда, требуется квадратный рисунок со стороной 512 пикселей, что несколько больше того размера, о котором мы с вами говорим
Некоторые темы могут не иметь этого меню, но это совсем не беда.
Мы установим иконку на сайт традиционным путем, как это делали еще наши деды.
Загружаем наш супер-пупер оригинальный рисунок в корень сайта через FTP или админку вашего хостинга. Что вам проще.
Здесь я не буду описывать, как это делать. В сети достаточно информации на эту тему.
Вторым шагом необходимо в папке вашей темы Вордпресс найти файл «шапки» header.php и прописать в него между тегами <head> всего одну строчку:
<link rel="icon" type="image/png" href="/имя файла иконки.png">
Вместо «имя файла иконки.png» вы вставляете название своего файла.
Также строку можно вставить через админку Вордпресс, пройдя по пути:
Внешний вид => Редактор => Заголовок (header.php)
Прописать строку, указанную выше и нажать кнопку Обновить файл
Если вы загружаете скачанную иконку со стандартным именем favicon.ico, то ваша строка будет вида:
<link rel="icon" type="image/ico" href="/favicon.ico">
После того как все прописано, чистим кэш через админку Вордпресс.
Например, при помощи Hyper Cache.
Обновив страницу, вы можете увидеть, сделанную своими руками, иконку там, где ей и положено быть.
Через некоторое время поисковики обновят у себя ваш сайт, и иконка появится в поиске.