Иконка фавикон: Как добавить фавикон (favicon, иконку в браузере)?

Содержание

Что такое favicon для сайта, как сделать фавикон и зачем нужна иконка сайта?

09.08.2021


Инструментов, чтобы выделить свой сайт среди миллионов других в поисковой выдаче, не так-то много. Favicon ― это один из таких инструментов. 

Favicon сайта ― что это

Что такое favicon? Favicon (favorites icon ― иконка для избранного) ― это иконка сайта, которая отображается:

  • на вкладках перед названием сайта

  • в закладках пользователя

  • слева от названия сайта в поисковой выдаче:

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

Изображение может быть любое. Это может быть просто картинка, которая будет отражать тему сайта, или логотип компании. 

Яндекс уже около 10 лет отображает фавиконы в поисковой выдаче.

А вот Google долгое время не торопился внедрять эту фичу в свой поисковик, поэтому пользователям пришлось ждать аж до 2019 года. Пока Google экспериментирует с фавиконами в поисковой выдаче: ищет им подходящее место, проверяет их нужность. Последний крупный эксперимент в отношении фавиконов был в январе 2020 года. О технических работах разработчики писали в официальном Twitter компании.

Если у вашего сайта иконка не установлена, на вкладках и в поисковой выдаче будет отображаться стандартная иконка. У каждого браузера она своя, например, в Google Chrome отображается чёрно-белая планета:

Для чего нужен favicon

Как использовать favicon? На что он может повлиять?

  1. Облегчает поиск сайта в поисковой выдаче. Благодаря узнаваемой картинке, постоянному посетителю вашего сайта будет легче найти веб-ресурс в списке. Это может сильно повлиять на количество переходов из поисковых систем.

  2. Повышение узнаваемости. При разработке бренда очень важно, чтобы логотип компании примелькался аудитории. Если вы публикуете много контента на сайте, пользователь будет часто встречать ваш лого в ПС. Это будет способствовать запоминанию бренда. 

  3. Удобный поиск сайта в закладках. Как мы говорили ранее, изначально фавикон создавался именно для того, чтобы нужный сайт было легче найти в избранном. До сих пор эта функция осталась, и иконки значительно облегчают поиск ресурсов. То же самое работает и с иконками во вкладках. Современные ПК очень производительные, поэтому они могут постоянно держать открытыми несколько десятков вкладок. В таких случаях иконка для сайта ― единственный способ найти то, что нужно.

  4. ​​Заставить пользователей больше доверять вам. Многие сайты уже давно пользуются иконками. Если вы не создадите себе отличительный знак, вы можете выделяться среди остальных ресурсов с плохой точки зрения. Пользователи могут задуматься о вашей профессиональности, а может даже принять за мошенников. Особенно это может сказаться на интернет-магазинах, так как люди будут бояться оплачивать товары через такой сайт. Всё это может значительно усложнить продвижение бренда.

Технические требования к изображению

Раньше для favicon использовали формат ICO. Сейчас браузеры поддерживают такие форматы, как SVG (чаще всего рекомендуют именно его), ICO, GIF, JPEG, PNG, BMP. 

Рекомендованный размер картинки в каждой поисковой системе разный. Яндекс говорит, что фавикон должен быть 120 × 120, 32 × 32 и 16 x 16 пикселей. В официальном справочном материале Яндекс рекомендует использовать изображения размером 120 × 120 пикселей (для растровых форматов) или изображение в формате SVG. Именно эти параметры позволят отобразить логотип сайта чётко и заметно на сервисах Яндекса.

В Google рекомендуемый размер значка должен быть кратным 48 пикселям, например, 48 x 48, 96 x 96, 144 x 144. Специалисты Google просят не использовать иконки 16 x 16, так как они слишком маленькие.

Как создать favicon

В целом favicon можно сделать в любом графическом редакторе, в котором вы привыкли работать. Для этой задачи подойдёт даже Paint. Важно только соблюсти необходимые размеры и конвертировать в один из форматов, о которых мы говорили ранее.

Такие профессиональные редакторы, как Adobe Photoshop, Adobe Illustrator или Figma, за счёт большей функциональности позволят создать уникальную иконку. Если вы не работаете с профессиональными редакторами или просто не гонитесь за уникальностью изображения, можете воспользоваться одним из способов, которые мы перечислим.

Как сделать favicon для сайта:

  1. Конвертировать уже готовое изображение. Если у вас уже есть готовая иконка или картинка, можно просто конвертировать её в нужный формат. Для этого подойдёт сервис pr-cy.ru, be1.ru.

  2. Нарисовать иконку самостоятельно. Есть сервисы, у которых очень ограниченный функционал, но с их помощью можно сделать простое начертание. Такие возможности дают сайты katvin.com, favicon.by, favicon.cc, xiconeditor.com
    Для примера сделаем иконку в виде радостного смайлика в сервисе favicon.by.

     

  3. Использовать готовые иконки. Необязательно рисовать иконку с нуля. Можно взять уже готовые иконки, которые выложены в библиотеки сайтов в свободном доступе. Взять готовые фавиконы можно на faviconka.ru и findicons.com.

Советы по созданию favicon

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

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

  3. Фавикон должен выделяться среди остальных. Перед тем как сделать иконку, проанализируйте, какие изображения у конкурентов, которые выпадают в поисковой выдаче вместе с вашим сайтом. Представим, ваш сайт посвящён ландшафтному дизайну. Все похожие сайты выбирают зелёный цвет для своих иконок, значит, чтобы выделиться нужно использовать другой цвет, например голубой. Если среди ваших конкурентов замечается буйство красок, можно выбрать чёрно-белый формат.

Favicon: как добавить на сайт

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

Самый универсальный способ ― добавить значок сайта через код. С него и начнём.

Как добавить favicon на сайт через код

  1. Загрузите файл с иконкой в корневой каталог сайта.

  2. Добавьте в HTML-код главной страницы сайта в элемент head ссылку на размещённый файл.

<head>

     <link rel="icon" href="https://example. com/favicon.ico" type="image/x-icon">

     <link rel="shortcut icon" href="https://example.com/favicon.ico" type="image/x-icon">

</head>

Атрибуты:

rel: 

  • icon — учитывается большинством браузеров,

  • shortcut icon — учитывается браузером Internet Explorer.

type: 

  • image/svg+xml — для формата SVG,

  • image/x-icon или image/vnd.microsoft.icon — для формата ICO,

  • image/gif — для формата GIF,

  • image/jpeg — для формата JPEG,

  • image/png — для формата PNG,

  • image/bmp — для формата BMP.

Совет. Если сайт должен быть доступен по нескольким доменам, лучше указывать в коде не полный путь, а относительный. Например, не https://example.com/favicon.ico, а просто /favicon.ico.

Обратите внимание! Если у вас кириллический домен в атрибуте href используйте Punycode.

Например, для адреса https://новыйсайт.рф/favicon.ico нужно указать https://xn--80advbqgxk0f.xn--p1ai/favicon.ico или просто использовать относительный путь /favicon.ico.

Как добавить favicon на сайт в WordPress

В WordPress есть больше вариантов добавить иконку на сайт. Можно использовать плагин или просто воспользоваться встроенными настройками WordPress. 

Чтобы добавить иконку можно, например, использовать плагин RealFaviconGenerator

  1. Перейдите в админку WordPress.

  2. Перейдите в Плагин ― Добавить новый.

  3. Найдите в поиске плагин RealFaviconGenerator установите и активируйте его.

  4. Перейдите во Внешний вид ― Фавикон

  5. Загрузите иконку. Нажмите Генерировать favicon. Плагин перенесёт вас на сайт

    RealFaviconGenerator.

  6. На веб-сайте найдите и нажмите кнопку Создайте свои значки Favicons и HTML-код.

  7. Плагин вернёт вас на ваш сайт. Вы получите уведомление о том, что ваш favicon настроен.

Не сложнее добавить favicon и через обычные настройки WordPress.

  1. В админке WordPress перейдите во Внешний вид ― Настроить.

  2. Выберите Общие настройки ― Свойства сайта.

  3. В разделе Иконка сайта нажмите Выберите иконку сайта 

  4. Загрузите фавикон.

  5. Чтобы сохранить изменения, нажмите кнопку Опубликовать:

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

В лучшем случае, поисковые системы начинают индексировать фавиконку через 1-2 недели после её настройки. А может и через несколько месяцев. К сожалению, здесь все зависит от решения системы. 

Сделать стандартный значок favicon.ico для сайта онлайн

Обработка JPEG фотографий онлайн.

Главное нужно указать файл картинки на вашем компьютере или телефоне, нажать кнопку ОК. Остальные настройки выставлены по умолчанию.

Примеры со значком этого сайта с изменённым тоном цвета в настройках «цветовой коррекции»:

Если в Фотошопе была сделана картинка с прозрачным фоном и нужно, чтобы после её преобразования иконка для сайта тоже была с прозрачностью, то для этого следует сохранить её в формате PNG24 с поддержкой прозрачности (на англ. прозрачность — transparency) используя, например, функцию в Фотошопе «Сохранить для веб…» (Save for web), после этого нужно указать эту картинку в формате .png на этом сайте для её преобразования в значок favicon.ico.

Для отображения значка favicon на своём сайте его необходимо загрузить в корневой каталог сайта и указать в html коде между тегами <head>. ..</head> так: <link rel=»shortcut icon» href=»/favicon.ico» type=»image/x-icon»> где favicon.ico — это название созданного значка.

Иногда при замене или изменении иконки favicon на своём сайте нужно очистить кэш браузера, чтобы она обновилась.

Исходное изображение никак не изменяется. Вам будет предоставлен стандартный значок в формате .ICO для сайта.

Буду рад принять любой &dollar; донат на мой PayPal аккаунт: [email protected]
Средства будут использованы для аренды новых серверов с более мощными процессорами AMD у Hetzner или Webnx.

1) Укажите изображение в формате JPEG, BMP, PNG: 2) Настройки генерируемого значка favicon.ico

Размер favicon.ico для сайта: 16×16 (стандарт)32x3248x4864x64

(Стандартный размер favicon для сайта 16×16, а вот, например, favicon.ico на сайте wikipedia имеет размер 48×48 пикселей.)

3) Цветовая коррекция favicon.ico (по умолчанию всё отключено)

Повысить резкость: (0-10)
Насыщенность: (от -100 до 100)
Тон цвета: (0-180, 100=не изменять)
Яркость: (от -100 до 100)
Контрастность: (от -100 до 100)

Какая ваша любимая иконка — фавикон?

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

Некоторые другие названия для ‘includeсимвол избранного«»значок ярлыка«Или же Значок веб-сайта أو «значок вкладки» أو URL-код أو «Значок закладки». Однако первоначальным термином был «фавикон», который до сих пор используется большинством людей. Давайте подробнее рассмотрим эти маленькие значки.

избранное + значок

Термин «фавикон» представляет собой сочетание двух слов — «фаворит» и «символ». Название происходит от того, как эти символы изначально использовались. Значки избранного впервые появились в Internet Explorer 5 в 1999 году и отображаются в «Избранном» — также известном как «Закладки» — и в адресной строке.

В отличие от многих жаргонных слов, которые смешивают два слова вместе, термин «favicon» не является органически созданным аббревиатурой. Это было фактическое имя файла, найденного в корневом каталоге веб-сайта. Любой файл, сохраненный как favicon.ico, будет отображаться как любимый значок веб-сайта.

Иконки и современный Интернет

по-прежнему Любимые иконы живы и здоровы хорошо в современных веб-браузерах. Они появляются на вкладках, в избранном и на панелях закладок, а также их можно найти в мобильных браузерах. Вскоре после введения значков в 1999 году они были стандартизированы Консорциумом World Wide Web.

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

Современные иконки более мощные. Это не ограничивается только файлами ICO. Веб-сайты могут использовать PNG, GIF (некоторые даже анимированные), JPEG, SVG и APNG. Иконки часто совпадают с изображениями профилей в социальных сетях и значками мобильных приложений. Это важный компонент визуальной идентичности бренда.

Почему не отображается иконка сайта favicon?


У Вас не отображается иконка сайта favicon.ico в браузере или в поиске? Давайте рассмотрим возможные причины.

Для начала хочу напомнить про статью Как создать favicon иконку сайта? Там Вы гарантированно сможете создать валидную иконку для сайта.

Вспомним как установить на сайт иконку сайта favicon


Иконка сайта подключается в head перед закрывающим тегом.
<html>
<head>
<title>Где подключить иконку сайта favicon?</title>

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

</head>
<body></body>
</html>


Рассмотрим три вида подключения к сайту иконки favicon
<!-- Если favicon лежит в корне сайта. РЕКОМЕНДУЕМЫЙ вариант.  -->
<link rel="icon" href="/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">

<!-- Если favicon лежит в корне сайта. Полный адрес к иконке. -->
<link rel="icon" href="http://yoursite.ru/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="http://yoursite.ru/favicon.ico" type="image/x-icon">

<!-- Если favicon лежит в папке Выше. НЕ РЕКОМЕНДУЕМЫЙ вариант. -->
<link rel="icon" href="http://yoursite.ru/путь_к_иконке/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="http://yoursite.ru/путь_к_иконке/favicon.ico" type="image/x-icon">


Почему написал у третьего варианта не рекомендуемый? Потому что, например, Яндекс может НЕ отображать Вашу иконку сайта в выдаче по запросу, если она находится в каком-либо подкаталоге, а не в корне. Личное наблюдение

Как индексируется иконка сайта favicon? Почему не отображается сразу после изменений?


Про индексацию иконки сайта favicon хотел бы предупредить, что сайт сначала должен проиндексировать специальным поисковым роботом, прежде чем иконка будет отображаться рядом с сайтом по запросу в поиске. Поэтому иногда следует просто подождать. По времени это от недели до двух месяцев (для молодых сайтов — младше года). Если всё сделано правильно, то просто запасаемся терпением!
Как поступает Гугл не скажу, но заметил, что он показывает иконки не на всех сайтах.

Вы все сделали правильно, но фавикон не хочет отображаться?


Пожалуйста, проверьте, правильно ли создан сам файл и верно ли прописаны пути к нему в теге head в записи про icon (пример записей Выше). Другими словами, узнаем, как его видят поисковики и различные интернет-сервисы, в том числе и браузеры.

Я обновил запись c favicon (иконкой сайта), но у меня по-прежнему ничего не отображается. Почему?


Бывает так, что в Браузере после изменений не отображается favicon.
Попробуйте почистить кэш в вашем браузере.

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


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

Руководство по созданию Favicon для всех платформ в 2019 году

Добро пожаловать в руководство по проектированию favicon. В этой статье мы подробно расскажем, как создать идеальный favicon, с конкретными советами по созданию иконок для Apple Touch, Windows 8, Android, Chrome, Opera и Safari. Также вы найдете удобное руководство по различным размерам и форматам favicon.

Итак, во-первых, что такое favicon? Сокращенно от англ. FAVorite ICON — «иконка для избранного» – это маленькие символы, которые появляются в строке URL и списке закладок. Сегодня favicon расширяет бренд сайта за пределы окна браузера во многих контекстах, но мы вернемся к этому позже.

На заре Интернета, создание favicon заключалось в прикреплении ссылки на файл иконки размером 16x16px, и на этом все. В настоящее время все немного сложнее – существуют разные размеры и процессы для разных контекстов. Создание правильного favicon – это наука.

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

Мы будем использовать шаблон Apply Pixels, чтобы легко генерировать различные требуемые размеры иконок, а в качестве примера – иконку Apply Pixels.

Логотип Apply Pixels, который используется в качестве примера favicon в этой статье

1. Сделайте его узнаваемым

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

2. Используйте свой логотип

Считайте favicon указателем, который помогает пользователям узнавать ваш сайт при просмотре списков закладок и домашних экранов. Таким образом, логично использовать свой логотип или любой другой символ, который позволяет пользователю узнать ваш сайт. Если у вас нет логотипа, подходящего для квадратного холста, используйте наиболее узнаваемую часть вашего логотипа.

3. Он должен быть понятным

Есть также несколько моментов, которые вы должны избегать. Не используйте favicon в качестве маркетингового инструмента – это означает отсутствие ценников, баннеров «new» или «updated» и т. д. На самом деле, вообще не помещайте текст в favicon. Текст плохо масштабируется, и высока вероятность, что он будет неразборчивым. Наконец, не используйте фотографию – она ​​будет размытой и неузнаваемой в таком мелком размере.

4. Создайте две версии

Когда в Internet Explorer 5 впервые появились favicon, они появились в строке URL-адреса и в списке закладок. Сегодня они также отображаются во многих других контекстах, включая списки закладок, контекстные меню и даже домашние экраны мобильных устройств и телевизоров. Из-за этого довольно трудно прогнозировать, как ваш значок будет отображаться для конечного пользователя.

Чтобы ваш favicon выглядел хорошо в различных контекстах, вы должны предоставить его в двух стилях:

  • Логотип на прозрачном фоне. Эта версия отображается в строке URL-адреса, списках закладок и в других местах, где favicon отображается рядом с URL-адресом или именем вашего веб-сайта.
  • Логотип на фоне со сплошной заливкой: эта версия используется в сетчатых закладках и контекстных меню, где браузер или устройство применяет маску к фону, для достижения единообразного контекста.

5. Создание favicon для десктопного браузера

Давайте начнем с самого простого favicon, который вам нужно создать: классическая иконка для классических десктопных браузеров. Этот тип favicon лучше всего работает на прозрачных фонах, так как зачастую он отображается в строке URL и в списках закладок

Favicon в классическом стиле отображается на панели закладок и в строке URL в Google Chrome

Вам нужно будет предоставить этот тип иконки в трех размерах, все в формате PNG с прозрачным фоном:

Добавьте этот favicon в HTML

, как показано ниже:

6. Создание иконки Apple Touch

Apple iOS использует иконки Apple Touch для представления веб-сайтов, сохраненных на домашнем экране iOS, в качестве закладок. Это означает, что иконка Apple Touch, как все иконки приложений iOS, будет округлена c помощью маски в форме суперэллипса, называемого сквиркл (squircle).

Он также будет отображаться на любом фоне, который пользователь

выбрал для своего домашнего экрана. Поэтому ваша иконка Apple Touch должна иметь сплошную заливку фона.

Вы можете использовать иконку Apple Touch 180×180, которая автоматически масштабируется для различных размеров iPhone и iPad. Это подойдет для большинства случаев. Если нет, вы можете предоставить дополнительные размеры для различных устройств Apple

Favicon Apple должна быть в формате PNG. Вы можете использовать иконку Apple Touch 180x180, которая автоматически масштабируется для различных размеров iPhone и iPad. Это подойдет для большинства случаев.

Если нет, вы можете предоставить дополнительные размеры для различных устройств Apple:

  • 60×60
  • 76×76
  • 120×120
  • 152×152
  • 180×180 (Обязательно)

Добавьте этот favicon в HTML

, как показано ниже:

7. Плитка Windows 8 и файл browserconfiguration.xml

Хотя Windows 8 больше не поддерживается Microsoft, многие пользователи планшетов продолжают работать на этой ОС. В зависимости от вашей пользовательской базы, вы можете также создать favicon для этой платформы.

Вот как могла бы выглядеть favicon Apply Pixels, в качестве плиток Windows 8:

Плитка Windows 558×270 является единственным не квадратным favicon.

Windows 8 использует плитки для представления веб-сайтов в пользовательском интерфейсе. Всего поддерживается пять размеров, один размер для Windows 8.0 и четыре размера для Windows 8.1.

Плитка Windows 8 состоит из двух компонентов:

  • Передний план: ваш favicon с прозрачным фоном.
  • Фон: фон плитки, сгенерированный Windows.

Все плитки Windows должны быть в формате PNG с прозрачным фоном. Это размеры, которые вам нужно использовать.

Для Windows 8:

И для Windows 8.1:

  • 128×128
  • 270×270
  • 558×270
  • 558×558

Windows 8.0

Цвет фона указывается в HTML-тегах и файле browserconfig. xml, которые необходимо предоставить:

Windows 8.1

Включает browserconfiguration.xml в корневой каталог вашего сайта:

<?xml version=»1.0″ encoding=»utf-8″?>

#2b5797

Примечание: Указанные размеры favicon в файле browserconfiguration.xml не соответствуют размерам, указанным выше. Это связано с тем, что в целях масштабирования Microsoft рекомендует предоставлять изображения, размер которых превышает стандартные размеры плитки.

8. Android, Chrome и Opera

Android, Chrome и Opera используют android-chrome-192×192.png и android-chrome-512×512.png, которые рекомендует Google.

С момента появления в Android адаптивных иконок к иконкам веб-сайтов, добавленных на домашний экран Android, будет применена маска 192×192. Поэтому иконка приобретает форму предпочитаемого пользователем стиля маскирования. Это может быть сквиркл, эллипс, прямоугольник, прямоугольник с закругленными углами или каплевидная фигура.

В этом случае favicon со сплошной заливкой маскирован в форме сквиркл операционной системы Android Pie. Другие фигуры включают в себя эллипсы, прямоугольник, прямоугольник с закругленными углами и каплевидную фигуру

Вам необходимо создать favicon в формате PNG со сплошным фоном следующих размеров:

Установите эти иконки, добавив файл site.webmanifest на свой сайт и разместив ссылку на него в тегах

:

Ниже приведен код для файла site.webmanifest:

{
«name»: «»,
«short_name»: «»,
«icons»: [
{
«src»: «/android-chrome-192×192.png»,
«sizes»: «192×192»,
«type»: «image/png»
},
{
«src»: «/android-chrome-512×512.png»,
«sizes»: «512×512»,
«type»: «image/png»
}
],
«theme_color»: «#ffffff»,
«background_color»: «#ffffff»,
«display»: «standalone»
}

9. Закрепленная вкладка Safari

Это единственный favicon, который необходимо предоставить в векторном формате в виде SVG-файла. Он отображается в виде пиктограммы, когда пользователь прикрепляет вкладку к окну браузера Safari.

В отличие от остальных favicon, этот создается из изображения в формате SVG

Эта иконка должна быть 100% черным SVG-файлом с прозрачным фоном. SVG может быть только одним слоем, и Safari требует, чтобы атрибут viewBox для SVG был установлен в «0 0 16 16».

Добавьте этот favicon в HTML

, как показано ниже:

10. Как насчет Google TV, Chrome Web Store и иконок Apple Touch для версий предшествовавших iOS 7?

А что насчет Google TV, Chrome Web Store и иконок Apple Touch для версий, предшествовавших iOS 7? Существует ряд размеров и форматы favicon, которые не были включены в эту статью, либо потому, что они практически устарели, либо потому, что они редко актуальны для обычного веб-разработчика. В общем, разработчики и дизайнеры должны стремиться поддерживать как можно более широкий спектр устройств и операционных систем, но иногда это просто не имеет смысла.

Например: Google TV был заменен на Android TV в 2014 году, а SDK был вовсе упразднен. Chrome Web Store, вероятно, имеет значение только в том случае, если вы создаете приложение, расширение или тему Chrome, а процент устройств iOS работающих под управлением iOS 7 или более ранней версии сейчас менее, чем ~1 %.

Шпаргалка

Итак, если вы хотите поддерживать полный набор устройств и браузеров, в таблице ниже указаны соответствующие размеры. Ранее favicon должен был быть предоставлен в формате ICO. Сегодня можно использовать файлы в формате PNG (за исключением иконки закрепленной вкладки Safari, которая должна быть представлена в формате SVG).

Если хотите узнать простой способ проектирования и экспорта всех размеров favicon, взгляните на наш шаблон.

Размеры

Фон

Формат

Классические десктопные браузеры

16×16

Прозрачный

PNG

32×32

Прозрачный

PNG

48×48

Прозрачный

PNG

Apple iOS

180×180

Сплошная заливка

PNG

Windows 8. 0

144×144

Прозрачный

PNG

Windows 8.1

128×128

Прозрачный

PNG

270×270

Прозрачный

PNG

558×270

Прозрачный

PNG

558×558

Прозрачный

PNG

Google Android и Chrome

192×192

Сплошная заливка

PNG

512×512

Сплошная заливка

PNG

Opera Coast

228×228

Сплошная заливка

PNG

Safari Pinned Tab

Vector

Прозрачный

SVG


Перевод статьи applypixels.com

Фавикон не отображается в поиске Яндекса: причины и проверка

Директ Лайн

Кто мы

Крупнейшее региональное интернет-агентство России. ТОП-10 в рейтинге Рунета.

1200+ проектов

90 специалистов

15 лет на рынке

Требования к размеру и формату фавикона

Первое, на что следует обратить внимание, если фавикон не отображается в поисковике, — его размер и формат. Значок может иметь размеры 16×16, 32×32, 120×120 пикселей. Подходящие форматы — ICO, JPEG, PNG, GIF, BMP.

Как правильно размещать фавикон

Фавикон следует размещать таким образом:

  1. Для создания изображения используйте любой онлайн-сервис или редактор, например, Photoshop. Учитывайте упомянутые требования к размеру и формату.
  2. Поместите фавикон в папку сайта по FTP (как правило, это корень сайта).
  3. Далее в блок <head> в HTML-коде главной страницы сайта добавьте фрагмент кода, который содержит в себе адрес значка и тип передаваемых данных:
<head>
 ...
 <link rel="icon" href="https://URL сайта/favicon.ico" type="image/x-icon">
 ...
</head>

Разберем используемые в коде атрибуты.

Rel — тип ресурса:

Нет времени разбираться?

SEO-продвижение под ключ

Проанализируем конкурентов, подберем запросы с низкой конкуренцией, проведем поисковую оптимизацию сайта, организуем внешнюю ссылочную массу, проработаем карточки компании на онлайн картах, проведем базовую UX-аналитику сайта. Над каждым проектом работает от 6 до 10 специалистов. Собственные разработчики для доработки сайта при необходимости. От вас — сайт, от нас — позиции в Яндекс/Google и трафик.

Ваш сайт

Подробнее об услуге
  • icon подходит под практически любой современный браузер,
  • shortcut icon используется браузером Internet Explorer.

Type, или тип передаваемых данных:

  • в нашем случае это image/x-icon, так как формат и расширение фавикона — .ICO;
  • image/gif — для GIF-файлов;
  • image/jpeg — для JPEG;
  • image/png — для PNG;
  • image/bmp — для BMP.

Согласно справке Яндекса, в коде может присутствовать несколько ссылок на фавикон. В процессе индексации робот выберет наиболее подходящую.

Почему фавикон не отображается в Яндексе

Есть несколько причин, по которым значок может не отображаться. Начнем с технических:

  1. Ошибка в коде, который выводит фавикон на сайте. Важно, чтобы HTML-код значка был размещен строго в блоке <head> и имел вид, как в примере выше.
  2. Неправильный формат или размер иконки. Если с размерами все понятно, то с форматом иногда возникают сложности. Убедитесь, что сохранили фавикон в допустимом формате, а также применили правильный атрибут в коде значка.
  3. Проблема с кэшем браузера. Чтобы очистить его, находясь на странице сайта, нажмите комбинацию клавиш CTRL + F5.

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

  1. Запрет на индексацию значка в файле robots.txt.
  2. В коде страниц у значка прописан путь http://, и не настроен редирект, поэтому возникает ошибка 404. Так происходит потому, что при установке SSL-сертификата обычно указывается главное зеркало сайта в файле . htaccess, то есть абсолютные пути до фавикона при https:// и http:// — разные.
  3. С размещения фавикона прошло мало времени. Обычно на индексацию поисковику требуется от двух недель до двух месяцев.
  4. Неуникальное изображение или его низкое качество. В справке Яндекса отмечается, что поисковик может не брать во внимание некоторые фавиконы, к примеру, скопированные или имеющие низкое разрешение.
  5. Неуместное изображение (порнография, свастика и прочие запрещенные символы).
  6. Сайт попал под один или несколько фильтров Яндекса. Определить, так ли это, можно по следующим признакам:
  • из поисковой выдачи резко выпали все или значительная часть страниц сайта;
  • просадка в посещаемости, не связанная с сезонностью или другими резонными причинами;
  • снизился ИКС сайта;
  • в Яндекс.Вебмастере появились сообщения о проблемах на сайте.

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

Проверка корректности отображения фавикона

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

1. Загрузите значок в бразуере по абсолютному пути расположения. Если проблема заключается в пути, то возникнет ошибка 404.


Первый способ проверки

2. Воспользуйтесь инструментом «Проверка ответа сервера» в Яндекс.Вебмастере. Здесь в специальное окно нужно вставить URL, по которому находится иконка. В ответе должен быть код 200.


Второй способ

3. Введите в строку браузера следующее: favicon.yandex.net/favicon/URL-вашего-сайта. Так вы сможете проверить, есть ли ваш значок в базе фавиконов проиндексированных сайтов Яндекса.


Третий способ

4. Чтобы проверить по такой же базе Google, воспользуйтесь адресом www.google.com/s2/favicons?domain=URL-вашего-сайта.


Четвертый способ

5. Проверьте фавикон на отображение и валидность в специальных сервисах, например, Favicon Checker. Он покажет, как выглядит иконка в разных браузерах, и укажет на возникшие проблемы.


Пятый способ

Итак, повторим, основные рекомендации:

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

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

Какие нужны фавиконки — Блог HTML Academy

Фавиконка — это favorite icon, то есть иконка для избранного. Её придумали для IE5 в 99 году, чтобы у сайтов была узнаваемая картинка. Достаточно было бросить в корень сайта файл favicon.ico и браузер сразу её подхватывал и делал красиво. До сих пор все браузеры делают запрос в корень сайта и пытаются найти там файл в формате ICO. Бросил и забыл, расходимся? Рано!

Долгое время всё прекрасно работало. В контейнер ICO можно было зашить много разных иконок: от крошечной монохромной до огромной полупрозрачной. Браузер после скачивания иконки сам выбирал нужный формат. Проблема была в том, формат ICO страшно неэффективный. Если зашить в ICO две PNG-иконки 16 и 32, то иконка будет весить в два-три раза больше, чем исходные файлы. Браузерам приходилось тянуть не только ненужные форматы, но ещё и в неэффективном виде.

Но ICO признали все браузеры и научились подключать его не только из корня сайта, но и из произвольного места. Если указать в голове документа <link rel="icon">, то браузер пойдёт не в корень, а туда, куда вы ему показали. Линковать особый адрес приходилось на каждой странице, но это же не проблема — иконка ведь всего одна! Ну правда, что могло пойти не так? Так и жили.

<link rel="icon" src="images/my.ico">

При отсутствии внятных стандартов, за дело взялась Apple. К первому Айфону прилагался прорывной мобильный браузер Safari, который тоже начал искать в корне сайта иконки, но на этот раз в формате PNG и с названием apple-touch-icon. Эту иконку видно в избранном и при добавлении сайта на домашний экран. Бросил в корень второй файл и забыл, расходимся? Нет.

Чтобы иконка была без блика сверху, нужен файл apple-touch-icon-precomposed, ещё один для ретины, потом ещё несколько для всех моделей Айпадов, тройной ретины… и в итоге вам нужно намусорить в корне или в шапке сайта целым ворохом иконок со специальными размерами: 72, 76, 114, 120, 144, 152, 180 и кажется что-то ещё. Чтобы разобраться во всех нюансах тач-иконок, читайте отличное руководство Матиаса Байненса.

<link rel="apple-touch-icon" href="apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" href="apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" href="apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" href="apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" href="apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" href="apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" href="apple-touch-icon-180x180.png">

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

В HTML5 появилось расширенное описание<link rel="icon">: добавился атрибут sizes, чтобы указывать размеры, и атрибут type, чтобы указывать формат иконки. Например, если у вас ICO с несколькими иконками внутри, то укажите все размеры через пробел в sizes. Если иконка векторная — да, так тоже можно — укажите размер any. Главное, не забудьте указать правильные типы. Теперь-то расходимся, проблема решена? Почти.

<link rel="icon" href="favicon.png" type="image/png">
<link rel="icon" href="favicon.ico" type="image/vnd.microsoft.icon">
<link rel="icon" href="favicon.svg" type="image/svg+xml">

Для каждой иконки писать свой линк? Сложно! А если хочется фирменный цвет указать, заставку или какие-то особенности работы всего сайта? Не иконками едиными. Вот бы нам конфиг в отдельном файле! Было и такое: browserconfig.xml для плиточных иконок IE11, JSON-манифест для иконок-виджетов табло Яндекс Браузера. Экспериментов было много, но теперь есть и стандартное решение — веб-манифест.

Спецификация Web App Manifest описывает простой JSON-файл, в котором можно указать не только все иконки, их размеры и форматы, но и полностью описать ваш сайт или приложение. Фирменный цвет, цвет фона, язык и направление письма, полное и краткое название, ориентация, режим запуска и другое. Вы подключаете его с помощью <link rel="manifest"> на каждую страницу и браузер сразу всё знает. Хороший инспектор манифеста есть во вкладке Application отладчика Chrome.

{
  "name": "My App",
  "icons": [{
    "src": "64.png",
    "sizes": "64x64"
  }, {
    "src": "128.png",
    "sizes": "128x128"
  }],
  "display": "fullscreen",
  "orientation": "landscape",
  "theme_color": "tomato",
  "background_color": "cornflowerblue"
}

А что Apple? Что-что… До сих пор поддерживает свой формат тач-иконок и придумала даже ещё один: новый, нестандартный, как мы любим! С помощью <link rel="mask-icon"> для закреплённых вкладок Safari и кнопок на тач-баре Макбуков можно указать монохромную векторную маску и цвет для наведения. Спасибо, конечно, за вектор, но неспасибо за очередной велосипед.

<link rel="mask-icon" href="mask.svg" color="red">

Веб-манифест уже так или иначе поддерживают Chrome, Opera, Samsung Internet и Firefox, но пока только на Андроиде. В Edge он тоже скоро появится — разработка в процессе. Пока это будущий способ подключения иконок, а что делать сегодня, вот прямо сейчас? Сочетать всё, что мы знаем.

Для начала, забудьте про ICO, если только вам не нужен IE10. Подключите линком PNG-иконки: простую на 16 и 32 для ретины, чтобы было красиво в браузерной строке и закладках. Дальше подключите линком из корня сайта apple-touch-icon.png размером 180 × 180. Потом подключите веб-манифест, в котором указана иконка на 192 для Андроида. Ну и можно там же упомянуть 16, 32, вектор, цвета и название — пригодится.

Этого вам должно хватить, чтобы было красиво в основных современных браузерах. Но если нужно упороться по мелочам и сделать вот прямо идеально на каждой платформе — мои соболезнования и читайте документацию в описании к видео. Есть ещё сносный онлайновый генератор иконок, но я бы не доверил ему генерировать графику — будет мыльно. А вот код позаимствовать можно.

Ну что, чуда не произошло и всё по-старому: мусор в шапке, мусор в корне? Знаете, нет, я верю, что со временем веб-манифест наведёт порядок, поэтому подключайте его уже сегодня. Вот выбросим мусор и заживём!

HTML Фавикон


Фавикон — это небольшое изображение, отображаемое рядом с заголовком страницы на вкладке браузера.


Как добавить Favicon в HTML

Вы можете использовать любое понравившееся изображение в качестве фавиконки. Вы также можете создать свой собственный favicon на таких сайтах, как https://favicon.cc.

Совет: Фавикон — это маленькое изображение, поэтому оно должно быть простым и контрастным.

Изображение фавикона отображается слева от заголовка страницы на вкладке браузера, например:

Чтобы добавить фавиконку на свой сайт, либо сохраните изображение фавиконки в корень каталог вашего веб-сервера или создайте папку в корневом каталоге под названием images, и сохраните изображение фавиконки в этой папке. Распространенное название изображения фавикона — «favicon.ico».

Затем добавьте элемент в файл index.html, после элемента </code>, например: </p> <h4><span class="ez-toc-section" id="i-12"> Пример </span></h4> <br/> <br/> <br/>   Моя страница Заголовок <br/>   <br/> <p> <h2><span class="ez-toc-section" id="i-13">Это заголовок</span></h2> <br/> <p>Это абзац.</p> </p> <p> </body> <br/> </html> </p> <p> Теперь сохраните файл index.html и перезагрузите его в браузере.Теперь вкладка вашего браузера должна отображать изображение фавикона слева от заголовка страницы. </p> <hr/> <hr/> <h3><span class="ez-toc-section" id="_Favicon"> Поддержка формата файлов Favicon </span></h3> <p> В следующей таблице показаны поддерживаемые форматы файлов для изображения фавикона: </p> <table> <tr> <th> Браузер </th> <th> ИКО </th> <th> PNG </th> <th> GIF </th> <th> JPEG </th> <th> СВГ </th> </tr> <tr> <td> Край </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> </tr> <tr> <td> Хром </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> </tr> <tr> <td> Firefox </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> </tr> <tr> <td> Опера </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> </tr> <tr> <td> Сафари </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> <td> Да </td> </tr> </table> <hr/> <h3><span class="ez-toc-section" id="i-14"> Краткое содержание главы </span></h3> <ul> <li> Используйте элемент HTML <code> <link> </code> для вставить фавикон </li> </ul> <hr/> <h3><span class="ez-toc-section" id="HTML-2"> HTML-тег ссылки </span></h3> <table> <tr> <th> Бирка </th> <th> Описание </th> </tr> <tr> <td> <ссылка> </td> <td> Определяет связь между документом и внешним ресурсом </td> </tr> </table> <br/> <br/> <h2><span class="ez-toc-section" id="_-_HTML"> Как добавить значок сайта на веб-сайт с помощью HTML </span></h2> <p> В этом руководстве мы рассмотрим шаги, связанные с добавлением значка сайта на веб-страницу с помощью HTML.<img src='/800/600/https/w7.pngwing.com/pngs/991/1017/png-transparent-research-business-organization-computer-software-management-poker-blue-globe-service.png' /> Вы можете использовать любое понравившееся вам изображение для своего фавикона, но имейте в виду, что простые высококонтрастные изображения часто работают лучше всего, учитывая небольшой размер фавикона. Вы также можете создать собственный значок значка на таких сайтах, как favicon.cc. </p> <p> Фавикон — это небольшое изображение, которое находится на вкладке браузера слева от заголовка веб-страницы. На изображении ниже показано расположение фавикона. </p> <p> </p> <p> Чтобы добавить значок значка на свой сайт, создайте папку в каталоге проекта с именем <code> images </code> (если у вас ее еще нет) и сохраните желаемое изображение значка в этой папке.Если у вас нет изображения, загрузите это изображение акулы Сэмми, которое мы разместили на нашем демонстрационном веб-сайте. (Чтобы освежить в памяти информацию о том, как добавлять изображения на веб-страницы с помощью HTML, посетите наш учебник HTML-изображения из предыдущих частей этой серии руководств. </p> <p> Затем добавьте элемент <code> <link> </code> (выделен ниже) в файл <code> index.<img src='/800/600/https/pbs.twimg.com/media/BncbOlhCYAEPGxn.png' /> html </code> прямо под элементом <code> <title> </code>. Теперь ваш код должен быть таким: </p>. <pre> <code> ... <title> Первый сайт Сэмми ...

Обязательно замените Favicon_Image_Location относительным путем к файлу вашего изображения фавикона. Сохраните файл index.html и перезагрузите его в веб-браузере. Вкладка вашего браузера теперь должна содержать изображение фавикона.

Теперь вы должны знать, как добавлять изображения favicon на веб-сайты с помощью HTML.

Хотите узнать больше? Присоединяйтесь к сообществу DigitalOcean!

Присоединяйтесь к нашему сообществу DigitalOcean, насчитывающему более миллиона разработчиков, бесплатно! Получите помощь и поделитесь знаниями в нашем разделе «Вопросы и ответы», найдите учебные пособия и инструменты, которые помогут вам расти как разработчику и масштабировать свой проект или бизнес, а также подписывайтесь на интересующие вас темы.

Зарегистрироваться

Как добавить Favicon на свой сайт

Статус этого документа

Проект в разработке; может кардинально измениться в любой момент.

Фавикон — это изображение изображение (значок), связанное с определенной веб-страницей и/или веб-сайтом. сайт. Многие последние пользовательские агенты (например, графические браузеры и программы чтения новостей) отображают их как визуальное напоминание о веб-сайте. в адресной строке или на вкладках. В википедии есть статья о favicons [FAVICON-WIKIPEDIA].

Чтобы добавить фавиконку на свой веб-сайт, вам потребуется как изображение, так и метод указания того, что изображение должно использоваться в качестве фавиконки. Этот документ объясняет метод, предпочитаемый W3C для указания фавикон. Существует еще один распространенный метод, который показан ниже. с объяснением того, почему этот метод несовместим с некоторыми принципы веб-архитектуры. Оба метода применимы только к HTML и XHTML, одно из обсуждаемых ограничений ниже.

В этом документе подробно не обсуждается, как создать значок сайта. изображение.Однако формат выбранного вами изображения должен быть 16×16. пикселей или 32×32 пикселей с использованием 8-битных или 24-битных цветов. То формат изображения должен быть одним из PNG (файл стандарт W3C), GIF или ICO.

Метод 1 (предпочтительный): использование значения атрибута

rel определяется в профиле

Первый подход к указанию фавикона — использование rel значение атрибута «значок» и определить, что означает значение через профиль; профили обсуждаются более подробно ниже.В этом примере HTML 4.01 фавикон, идентифицированный через URI http://example.com/myicon.png как фавикон:

  

 profile="http://www.w3.org/2005/10/profile"  >
  <ссылка отн = "значок"
      тип = "изображение/png"
      href="http://example. com/myicon.png"> 
[…]

[…]
  

XHTML 1.0 версия очень похожа:

  

 profile="http://www.w3.org/2005/10/profile"  >
  <ссылка отн = "значок"
      тип = "изображение/png"
      href="/где-то/myicon.png" /> 
[…]

[…]
  

Способ 2 (не рекомендуется): размещение значка избранного на предварительно определенном URI

Второй метод указания фавикона основан на использовании предопределенный URI для идентификации изображения: «/favicon», который относится к корень сервера.Этот метод работает, потому что некоторые браузеры запрограммирован на поиск фавиконов с использованием этого URI. Этот подход несовместимы с некоторыми принципами веб-архитектуры и в настоящее время обсуждается группой технической архитектуры W3C (TAG) в качестве их выдачи siteData-36. Подводя итог этой проблеме: веб-архитектура разрешает менеджерам сайтов управлять своим пространством URI (для данного доменного имени), как они видят соответствовать. Соглашения, которые не представляют согласия сообщества и которые уменьшить параметры, доступные менеджеру сайта, не масштабируются и могут привести к конфликту (поскольку общеизвестного списка этих предопределенные URI).Одно практическое соображение иллюстрирует проблему: многие пользователи имеют веб-сайты, даже если у них нет собственных доменное имя. Эти пользователи не могут указывать фавиконы, используя второй метод, если они не могут писать в корень сервера. Однако они могут использовать первый способ указать фавикон, так как он более гибкий и не запретить менеджеру сайта использовать один значок значка в одном месте на сайте.

Есть несколько других известных посягательств на пространство URI, в том числе «роботы.txt» и расположение P3P-конфиденциальности. политика. Группа технической архитектуры изучает альтернативы которые не затрагивают пространство URI без лицензии.

Использование профилей для определения таких терминов, как «значок»

Грубо говоря, профиль — это определение множества термины. В идеале профиль включает как машиночитаемую информацию, и удобочитаемая информация. В HTML 4.01 и XHTML 1.0 несколько атрибуты, такие как атрибут rel , не имеют предопределенного набора значения.Вместо этого автор может предоставить значения в соответствии с потребностями и затем используйте профиль, чтобы объяснить, что означают значения. В нашем случае мы рекомендовали авторам использовать значение «значок» и профиль, который объясняет, что «когда мы говорим значок, мы имеем в виду «это значок сайта».

В методе 1 выше мы используем атрибут rel с СВЯЗЬ элемент и выбираем профиль с атрибутом профиль в элементе HEAD.

Мы определили профиль, который вы можете свободно использовать для своих собственных сайтов.

Ограничения

Описанные выше подходы имеют несколько ограничений. включая предпочтительный метод (именно поэтому TAG продолжает работать по вопросу):

  • Подходы работают только в HTML или XHTML
  • Предпочтительный подход связывает значок с HTML-документом, не собрание документов (т.е. сайт)
  • Предлагаемый профиль для определения значения «значок» не является общепризнанный стандарт, что означает, что могут быть проблемы с функциональной совместимостью на практике.
  • Стандарт отсутствует (по крайней мере, определенный в HTML 4.01) для машиночитаемых профилей, которые позволить браузеру узнать, что «это означает, что изображение является фавиконом». Таким образом, браузер должен быть запрограммирован заранее, чтобы распознать это конкретное значение отн. . Для получения дополнительной информации об использовании профилей в HTML и XHTML см. GRDDL [ГРДДЛ].

Каталожные номера

ФАВИКОН-ВИКИПЕДИЯ
Фавикон , Википедия, Доступно по адресу http://en. wikipedia.org/wiki/Фавикон.
ГРДДЛ
Сбор Описания ресурсов из диалектов языков , D. Азаэль-Массье, Д. Коннолли, редакторы, представление команды W3C, 16 мая. 2005 г., http://www.w3.org/TeamSubmission/2005/SUBM-grddl-20050516/. Последняя версия доступно на http://www.w3.org/TeamSubmission/grddl/.
HTML401
HTML 4.01 Спецификация , Д. Раггетт, А. Ле Хорс, И. Джейкобс, Редакторы, Рекомендация W3C, 24 декабря 1999 г., http://www.w3.org/TR/1999/REC-html401-19991224. Последняя версия доступно на http://www.w3.org/TR/html401.
ДАННЫЕ САЙТА-36
Улучшение метаданных веб-сайта в файлах robots.txt, w3c/p3p и favicon и т. д. , TAG, Доступно на http://www.w3.org/2001/tag/issues.html#siteData-36.
XHTML1
XHTML™ 1.0 Расширяемый язык гипертекстовой разметки (второе издание) , S. Пембертон, редактор Рекомендации W3C, 1 августа 2002 г., http://www.w3.org/TR/2002/REC-xhtml1-20020801. Самый последний версия доступна на http://www.w3.org/TR/xhtml1.

Благодарности

Следующие участники QA Interest Group и сотрудники W3C внесли значительный вклад в содержание этого документа: Доминик Азаэль-Массье (W3C), Крис Лилли (W3C) и Оливье Теро (W3C).

Определить Favicon веб-сайта для результатов поиска

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

Примечание : фактическое отображение в результатах поиска может отличаться.

Реализация

Вот как сделать так, чтобы ваш сайт подходил для фавикона в результатах поиска:

  1. Создайте фавиконку в соответствии с рекомендациями.
  2. Добавьте тег в заголовок вашей домашней страницы со следующим синтаксис:
     <ссылка rel="значок ярлыка" href="/path/to/favicon. ico"> 
    Атрибуты
    отн.

    Задайте для атрибута rel одну из следующих строк:

    • значок быстрого доступа
    • значок
    • сенсорный значок Apple
    • apple-touch-icon-предварительно составленный
    ссылка

    URL фавикона.URL-адрес может быть относительным путем (/smile.ico ) или абсолютный путь ( https://example. com/smile.ico ). URL-адрес должен быть в том же домен в качестве домашней страницы.

  3. Google ищет и обновляет ваш значок всякий раз, когда сканирует вашу домашнюю страницу. Если вы сделаете изменения в вашем фавиконе и вы хотите сообщить Google об изменениях, вы можете запросить индексацию вашего домашняя страница сайта.Обновления появляются в результатах поиска через несколько дней или дольше.

Рекомендации

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

Фавикон не гарантируется в результатах поиска, даже если соблюдены все правила.
  • У вас может быть только один значок для вашего сайта, где сайт определяется именем хоста. Для например, https://www. example.com/ и https://code.пример.com/ это два разных сайта, поэтому у них может быть два разных фавикона. Однако, https://www.example.com/sub-site — это подкаталог сайта, и вы можете только установить один фавикон для https://www.example.com/, который относится к сайту и его подкаталоги.
  • И файл favicon, и домашняя страница должны быть доступны для сканирования Google (то есть они не могут быть заблокирован гуглить).
  • Чтобы помочь людям быстро идентифицировать ваш сайт при просмотре результатов поиска, убедитесь, что ваш фавикон визуально представляет бренд вашего веб-сайта.
  • Ваш фавикон должен быть кратен квадрату 48 пикселей, например: 48x48px, 96x96px, 144x144px. и так далее. Файлы SVG не имеют определенного размера. Любой действительный поддерживается формат фавикона. Google изменит масштаб вашего изображения до 16×16 пикселей для использования в результаты поиска, поэтому убедитесь, что они хорошо выглядят в этом разрешении. Предупреждение . Не предоставляйте значок 16x16px.
  • URL-адрес фавикона должен быть стабильным (не меняйте URL-адрес часто).
  • Google не будет показывать фавиконки, которые считает неприемлемыми, включая порнографию или ненависть. символы (например, свастики). Если этот тип изображений обнаружен в фавиконе, Google заменяет его значком по умолчанию.

Google Favicon пользовательский агент

Google Favicon — это пользовательский агент для загрузки фавиконов, определенных веб-сайтами. Это малообъемный поисковый робот: он может время от времени посещать главную страницу вашего сайта в зависимости от сигналы, собранные во время индексации или инициированные запросом пользователя. Чтобы запросить Google Favicon пользовательский агент сканирует вашу страницу, вы можете запросить индексация главной страницы вашего сайта. Обновления появляются в поиске через несколько дней или дольше. Результаты.

Сканер Google Favicon игнорирует правила robots.txt при запросе сканирования пользователем.

Информация о favicon.ico

Обновлено: 08.05.2020, автор: Computer Hope

Что такое favicon.ico?

Фавикон.ico — это небольшой значок, который можно найти в строке URL-адреса и в закладках, созданных веб-браузерами.

Например, на изображении выше есть небольшой значок () перед URL-адресом Computer Hope.

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

Фавикон можно создать с помощью любого бесплатного генератора значков или в бесплатном онлайн-генераторе значков, таком как favicon.cc. Файл favicon.ico должен быть размером 16×16, содержать 16 цветов и сохраняться как файл . ico.

Наконец, файл favicon.ico должен быть загружен в корневую директорию на сервере, на котором размещена ваша веб-страница.

Можно ли анимировать значок?

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

Может ли файл называться как-то иначе, чем favicon.ico?

Да, в свой HTML-код добавьте приведенный ниже тег в раздел вашего кода.

  

В этом примере браузер будет искать файл favicon2.ico и использовать его вместо favicon.ico. Если используется старый браузер или браузер, не поддерживающий эту функцию, тег игнорируется.

Фавикон также можно взять с другого веб-сайта. Например, чтобы использовать значок Computer Hope на своем сайте, вы можете добавить приведенный ниже тег в раздел .

  
Наконечник

Современный браузер не требует размещения этого тега на каждой создаваемой вами странице, если в корневом (домашнем) каталоге хранится файл favicon.ico. Мы предлагаем использовать этот тег для использования определенного фавикона или когда ваш веб-хостинг не поддерживает размещение файлов .ico.

Что такое favicon.gif?

Более современные интернет-браузеры используют favicon.gif в дополнение к favicon.ico. Если вы разработчик веб-сайта или блога, мы предлагаем использовать фавикон.gif в дополнение к favicon.ico. Поместите файлы в корневой каталог вашего сайта и любые подкаталоги, доступные через Интернет, чтобы предотвратить появление ошибки 404 в журнале вашего сервера.

Почему мой браузер не показывает фавикон?

Фавикон может не отображаться по одной из перечисленных ниже причин.

  1. Если вы или кто-то другой, использующий ваш компьютер, недавно очистил кэш Интернета, значки избранного будут потеряны, поскольку они хранятся в этом временном кэше.
  2. Страница не загружалась в последнее время или браузер не ищет фавикона в неправильном месте.Попробуйте обновить страницу браузера (нажатие F5 на клавиатуре — это обычное сочетание клавиш для обновления страницы).
  3. Если вы являетесь веб-мастером веб-страницы и не можете отобразить favicon.ico, убедитесь, что значок находится в корневом каталоге с соответствующими разрешениями. Если это подтверждено и страница находится в другом каталоге, попробуйте поместить файл favicon.ico в этот каталог.
  4. Наконец, в более ранних браузерах возникали различные проблемы, связанные с файлом favicon.ico.Убедитесь, что вы используете последнюю доступную версию интернет-браузера для вашей операционной системы.

Что, почему и как сделать фавикон для вашего веб-сайта

В любое время дня у меня открыто около 20 вкладок в Chrome. Что помогает мне отслеживать, какие вкладки являются маленькими значками, показанными ниже.

Я знаю, что мои документы Google — это вкладки с синим блокнотом. Моя доска Trello — это вкладка с мини-доской Trello. Блоги HubSpot, на которые я ссылаюсь, — это вкладки со звездочками и так далее.

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

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

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

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

У Google один из самых узнаваемых фавиконов. Вы можете увидеть разноцветную букву G в адресной строке моего браузера ниже.

Вы также можете увидеть значки Gmail, Google Sheets, Wiki HubSpot, редактора Hemingway и т. д. в моем списке закладок.

Favicons теперь появляются даже в результатах мобильного поиска Google. Вы можете увидеть результаты моего последнего поиска — «как часто нужно поливать суккуленты» — ниже.

Почему фавиконки важны?

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

Обратите внимание в поисковой выдаче для мобильных устройств, что веб-сайты Joy Us Garden и Легко выращиваемые луковицы имеют значки цветов, а сайт The Succulent Source имеет серый шар. Это не имеет особого смысла для сайта о суккулентах, не так ли? Это потому, что глобус — это значок значка по умолчанию, который Google Chrome устанавливает для веб-сайтов, у которых нет собственного значка.

Если я быстро просмотрю страницу результатов, я, вероятно, решу изучить Joy Us Garden и Легко выращиваемые луковицы вместо The Succulent Source по нескольким причинам. Они не только появляются первыми в поисковой выдаче, но и их фавиконы, URL-адреса, заголовки страниц и метаописания указывают на то, что они являются веб-сайтами, посвященными всем растениям и имеющими ответ на мой вопрос.

Теперь представьте эти три веб-сайта во вкладках браузера на рабочем столе. Гораздо проще запомнить пользовательские значки наборов «Сад радости» и «Легкие в выращивании луковицы» , чем значок по умолчанию «Источник суккулентов» . В море открытых вкладок я с большей вероятностью вернусь на вкладки с пользовательскими значками и проведу больше времени на этих сайтах.

Наконец, допустим, я нажимаю на каждый из этих сайтов. При посещении Joy Us Garden и Easy to Grow Bulbs я сразу заметил, что пользовательские фавиконы основаны на логотипах веб-сайта. Красочный логотип последнего показан ниже. Вы узнаете тюльпан как их значок.

 

Это помогает укрепить их фирменный стиль и сделать их сайт более запоминающимся. С другой стороны, при посещении The Succulent Source я впервые увижу их логотип.Они могли бы улучшить согласованность своего бренда, сопоставив свой логотип и фавикон.

Какого размера фавикон?

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

Ниже приведены некоторые из наиболее распространенных размеров фавиконов и их уникальные назначения.

  • 16×16 : Размер значков браузера.
  • 32×32 : Размер значков быстрого доступа на панели задач.
  • 96×96 : Размер значков ярлыков на рабочем столе.
  • 180×180 : Размер значков Apple Touch.
  • 300×300 : Размер, требуемый Squarespace.
  • 512×512 :Размер, требуемый WordPress.

Теперь, когда мы понимаем, что такое фавикон, его назначение и разные размеры, давайте посмотрим, как его сделать.

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

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

Если у вас нет логотипа, то начните с него. Вы можете нанять дизайнера, чтобы он создал его для вас, или вы можете использовать такие инструменты, как Logo Crisp, для разработки высококачественного логотипа за небольшую часть стоимости.

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

Вот почему вы хотите взять самую узнаваемую часть своего логотипа и сделать ее фавиконкой. Easy to Grow Bulbs сделали именно это, взяв тюльпан со своего логотипа и сделав его своим значком.

Чтобы внести подобные изменения, вам может понадобиться программное обеспечение для редактирования значков, такое как IconEdit2. В большинстве программ для редактирования значков вы можете добавить несколько размеров в один файл значка. Как только вы будете удовлетворены своим изображением и размерами фавикона, вы можете сохранить файл в формате PNG или JPG, а затем загрузить его в генератор значков.

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

Генераторы фавиконок

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

Стандартные форматы фавиконов — ICO и PNG.ICO совместим со всеми браузерами, включая Internet Explorer. PNG — еще один распространенный формат. Единственным недостатком является то, что Internet Explorer не поддерживает файл PNG. В идеале выбранный вами генератор позволит вам загрузить фавикон в обоих форматах.

Фавикон

Создать свой значок в Favikon очень просто. Вы просто загружаете изображение, обрезаете его, а затем загружаете получившийся значок в формате ICO или PNG. Ниже я загрузил иконку ламы из The Noun Project .

Недостаток в том, что Favikon поддерживает только один размер: 16×16 пикселей. Чтобы узнать больше о размерах, воспользуйтесь инструментами ниже.

Favicon.io

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

Вы можете скачать результат в форматах ICO и PNG и в нескольких размерах. Варианты перечислены ниже:

  • android-chrome-192×192.png
  • андроид-хром-512×512.png
  • apple-touch-icon.png
  • favicon-16×16.png
  • favicon-32×32.png
  • Favicon.ico
Favicon.ico и генератор иконок приложений

С помощью этого бесплатного инструмента вы можете загрузить изображение в формате PNG или JPG и преобразовать его в форматы ICO и PNG в еще большем количестве размеров.

Варианты загрузки перечислены ниже:

  • apple-icon-57×57.png
  • apple-icon-60×60.png
  • apple-icon-72×72.pnf
  • яблоко-значок-76×76.png
  • apple-icon-114×114.png
  • apple-icon-120×120.png
  • apple-icon-144×144.png
  • apple-icon-152×152.png
  • apple-icon-180×180.png
  • android-icon-192×192.png
  • favicon-32×32.png
  • favicon-96×96.png
  • favicon-16×16.png

После того, как вы сгенерируете свой значок в нужном формате, вы сохраните его в корневом каталоге вашего сайта. Затем вы можете создать ссылку на файл в формате HTML, чтобы добавить фавиконку на свой сайт.

Прежде чем мы рассмотрим этот процесс ниже, важно отметить, что это относится к владельцам сайтов, которые создали свой сайт с нуля или с помощью среды разработки, такой как Bootstrap CSS. Если вы использовали конструктор веб-сайтов или CMS, например, WordPress или альтернативы WordPress, то процесс будет немного отличаться.

Как добавить Favicon в HTML

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

Допустим, вы сохранили файл PNG как «favicon.ico». Затем вы должны добавить следующий фрагмент кода между тегами :

.
 
 

 

   

Обратите внимание, : ваш значок не обязательно должен быть помещен в корневую директорию вашего сайта — обычно это так. Если вы сохранили его в другом месте, просто убедитесь, что атрибут href указан правильно.Поэтому, если вы сохранили его в подпапке с именем «images», вам нужно ввести .

Предположим, вы создали фавикон разных размеров. Вы можете загрузить их все на свой сайт, добавив строку кода для каждого размера в раздел вашего HTML-файла. Например, если вы создали версию 16 x 16, 32 x 32, 48 x 48 и 180 x 180, вам нужно добавить следующий фрагмент кода:

.
 
 

 

   

Создание фавиконки

Фавиконы — важный элемент веб-дизайна. Они могут улучшить впечатление посетителей, укрепить индивидуальность вашего бренда и сделать ваш сайт более надежным. Не совершайте ошибку, упуская их из виду, особенно когда их легко создать и добавить на свой сайт.Вам просто нужен бесплатный генератор favicon и некоторое знакомство с HTML.

Фавикон от RealFaviconGenerator — плагин WordPress

Создайте и настройте фавикон для настольных браузеров, iPhone/iPad, устройств Android, планшетов Windows 8 и других устройств. За считанные секунды создайте значок, который будет отлично смотреться на всех основных платформах.

Favicon — это не просто один файл favicon.ico , брошенный посреди вашего сайта. В настоящее время с таким количеством различных платформ и устройств вам нужна куча изображений, чтобы выполнить работу.С помощью RealFaviconGenerator создавайте все значки, которые вам нужны для настольных браузеров, iPhone/iPad, устройств Android, устройств Windows 8 и т. д.

Устройства

iOS используют сенсорный значок Apple с высоким разрешением для иллюстрации закладок и ярлыков на главном экране. Для iPhone первого поколения требуется изображение 57×57, тогда как для нового iPad с экраном Retina требуется изображение 152×152. Android Chrome также использует эти изображения, если находит их. Windows 8 идет по другому пути с выделенным набором значков и деклараций HTML.

Фавикон — это не только картинки с разным разрешением. Различные платформы поставляются с разными рекомендациями по пользовательскому интерфейсу. Например, классические фавиконы на рабочем столе часто используют прозрачность. Но iOS требует непрозрачных значков. И у Windows 8 есть свои рекомендации.

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

.
  • Windows (IE, Chrome, Firefox, Opera, Safari)
  • Mac (Safari, Chrome, Firefox, Opera, Camino)
  • iOS (Сафари, Chrome, Побережье)
  • Android (Chrome, Firefox)
  • Поверхность (IE)
  • И более

Мы очень серьезно относимся к совместимости. Полный список см. на http://realfavicongenerator.net/favicon_compatibility.

** Локализация **

Использование панели инструментов WordPress
  1. Перейдите к «Добавить новый» на панели плагинов
  2. Поиск «Favicon от RealFaviconGenerator»
  3. Нажмите «Установить сейчас»
  4. Активируйте плагин на панели плагинов
  5. Перейдите к записи «Favicon» в меню «Внешний вид»
  6. Выберите мастер-изображение из библиотеки мультимедиа (необязательно)
  7. Нажмите кнопку «Создать фавикон» и следуйте инструкциям.
Использование FTP
  1. Скачать favicon-by-realfavicongenerator.zip
  2. Извлеките каталог favicon-by-realfavicongenerator на свой компьютер
  3. Загрузите каталог favicon-by-realfavicongenerator в каталог /wp-content/plugins/
  4. Активируйте плагин на панели плагинов
  5. Перейдите к записи «Favicon» в меню «Внешний вид»
  6. Выберите мастер-изображение из библиотеки мультимедиа (необязательно)
  7. Нажмите кнопку «Создать фавикон» и следуйте инструкциям.

«Favicon by RealFaviconGenerator» — это программное обеспечение с открытым исходным кодом. Следующие люди внесли свой вклад в этот плагин.

участников
1.3.23
  • Устранение отраженной проблемы с межсайтовыми сценариями
  • Плагин протестирован до версии WordPress 5.9.2
1.3.22
  • Исправление несоответствия в предыдущем развертывании
1.3.21
  • Плагин протестирован до версии WordPress 5.8
  • Устранить проблему безопасности XSS, о которой сообщает WPSpan.ком. См. https://wpscan.com/vulnerability/ed9d26be-cc96-4274-a05b-0b7ad9d8cfd9?fbclid=IwAR2aRMXRjbGm9ppoI9tM-OHm26Q0ax4yt0MkcP5sp0-pz9D4eVIEHQwvG1Y
  • .
1.3.20
  • Исправлено: выбор носителя снова работает
  • Плагин протестирован до версии WordPress 5.6
1.3.19
  • Плагин протестирован до версии WordPress 5.5.3
1.3.18
  • Удалить ссылку на устаревшую функцию screen_icon
  • Плагин
  • протестирован до версии WordPress 5. 4
1.3.17
  • Изменения для очистки предупреждений безопасности от CodeRisk
1.3.16
  • Плагин протестирован до версии WordPress 5.3.2
1.3.15
  • Плагин протестирован до версии WordPress 5.1
1.3.14
  • Плагин протестирован до версии WordPress 5.0-beta5
1.3.13
  • Плагин протестирован до версии WordPress 4.9.7
1.3.12

Никогда не публиковался, без изменений

1.3.11
  • Добавлен перевод id/ID, спасибо Jordan Silaen
  • Плагин был протестирован до версии WordPress 4.8.1
1.3.10
  • Всегда получать доступ к RealFaviconGenerator через HTTPS
  • Уточнение разделителей локальных путей для Windows
  • Плагин протестирован до версии WordPress 4.7.1
  • Обратите внимание, чтобы попросить администратора не деактивировать подключаемый модуль
1.
3.9
  • Плагин протестирован до версии WordPress 4.7
1.3,8
  • Плагин протестирован до версии WordPress 4.6
1.3.7
  • Исправлено: Ключевые слова плагина перефразированы (некоторые не учитывались).
1.3.6
  • Исправлено: путь к значкам иногда был неправильным, если каталог загрузки был корневым каталогом
1.3.5
  • Добавлен перевод на пл/пл, спасибо Мацею Гринюку
  • добавлен перевод ru/RU, спасибо Наташе Дятько
1.3.4
  • Плагин протестирован до версии WordPress 4.5
1.3.3
1.3.2
  • Опечатки во французских переводах
  • Исправление предупреждения для PHP7
  • Протестировано до версии WordPress 4.4.1
  • Добавлен перевод cs/CZ, спасибо анонимному переводчику
1.3.1
  • Исправление в предыдущей версии.
1.3.
0
  • Плагин использует преимущества неинтерактивного API RealFaviconGenerator для автоматического обновления фавикона всякий раз, когда доступна новая версия.
1.2.15
  • Добавлена ​​ссылка для пожертвований.
  • Плагин теперь работает при доступе к файловой системе через FTP (не прямой). См. https://wordpress.org/support/topic/no-images-created
  • .
1.2.14
  • Повышение безопасности.
  • Исправлено предупреждение о NONCE_ACTION_NAME.
  • Удалены бесполезные закрывающие теги PHP.
  • Добавлена ​​проверка ошибок при распаковке пакета favicon.
1.2.13
1.2.12
  • Улучшения производительности: проверка обновлений фавикона теперь выполняется в разделе «Администратор» (а не в разделе «Общий»), локали больше не загружаются в разделе «Общий».
  • Воспользуйтесь API перезаписи (если он доступен), чтобы файлы отображались в корневом каталоге. Так что http://example. com/favicon.ico работает (например, по запросу Яндекса).
  • Добавлен перевод
  • nl/NL, спасибо Axel Vanderhaeghen.
1.2.11
  • Когда браузер администратора не может получить изображение, выбранное из медиатеки, пользовательский интерфейс изящно завершает работу.
  • Распаковка пакетов Favicon стала более надежной.
  • Обратите внимание, чтобы попросить пользователей оценить плагин в WordPress.орг.
1.2.10
  • Исправлено предупреждение при использовании с BuddyPress (bp_setup_current_user). См. https://wordpress.org/support/topic/wp_debug-notice-for-bp_setup_current_user.
1.2.9
  • При выборе из Медиатеки главное изображение теперь извлекается браузером администратора WP, чтобы предотвратить некоторые проблемы (локальные блоги, блоги, защищенные тем или иным образом и т. д.).
1.2.8
  • Плагин успешно протестирован на WordPress 4.1.
1.
2.7
  • Исправление для сайтов WordPress, размещенных в Windows.
1.2.6
  • Плагин теперь совместим с мультисайтом.
1.2.5
  • Исправление для страницы входа: код фавикона не вводился на этой конкретной странице.
1.2.4
  • Удалите сообщения отладки, чтобы избежать ложных срабатываний в журнале ошибок.
1.2.3
  • Уведомления об обновлениях можно отключить раз и навсегда.
  • Новая страница настроек для включения/отключения уведомлений об обновлениях.
1.2.2
  • Исправление ошибки 403 в службе хостинга HostGator (https://wordpress.org/support/topic/403-error-when-generating-favicon).
1.2.1
  • Исправлено удаление плагинов и проверка обновлений.
1.2.0
  • Плагин теперь предупреждает пользователя, когда RealFaviconGenerator был обновлен, и фавикон должен быть сгенерирован снова.
1.1.1
  • Использование API перезаписи отключено. Файлы Favicon больше не находятся в корневом каталоге блога.
1.1.0
  • Запустите средство проверки favicon RealFaviconGenerator из интерфейса администратора.
1.0.7
  • Деактивировать значок Genesis по умолчанию, если он настроен в FbRFG.
1.0.6
  • Улучшено управление ошибками при установке фавикона.
1.0.5
  • Не пытайтесь переписать URL-адрес файлов favicon, если .htaccess не доступен для записи.
1.0.4
  • Возможность не переписывать URL-адрес файлов favicon, даже если это возможно.
1.0.3
  • Синтаксис кода плагина изменен, чтобы соответствовать более старым версиям PHP.
1.0.2
  • URL-адрес обратного вызова слишком длинный для некоторых серверов. Его укоротили.
1.0.1
  • Настройки администратора Favicon теперь находятся в меню «Внешний вид».
Опубликовано в категории: Разное

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

Ваш адрес email не будет опубликован.