Значок

редактировать
Значок, связанный с определенным веб-сайтом

A значок (; сокращение от значок избранного ), также известный как значок ярлыка, значок веб-сайта, значок вкладки, значок URL-адреса или значок закладки - это файл, содержащий один или несколько небольших значков, связанных с конкретным веб-сайтом или веб-страницей. веб-дизайнер может создать такой значок и загрузить его на веб-сайт (или веб-страницу) несколькими способами, а затем графические веб-браузеры будут использовать его. Браузеры, обеспечивающие поддержку значков, обычно отображают значок страницы в адресной строке браузера (иногда также в истории) и рядом с именем страницы в списке закладок. Браузеры, поддерживающие интерфейс документа с вкладками , обычно показывают значок страницы рядом с заголовком страницы на вкладке, а браузеры для конкретного сайта используют этот значок в качестве значка на рабочем столе.

Значок Википедии, показанный в более старой версии Firefox (с 2008 г.)

Содержание

  • 1 История
    • 1.1 Стандартизация
    • 1.2 Устаревшие
  • 2 Реализация браузера
    • 2.1 Поддержка формата файла
    • 2.2 Использование значка
    • 2.3 Как использовать
    • 2.4 Поддержка устройства
      • 2.4.1 Рекомендации HTML5 для значков разных размеров
    • 2.5 Анимированные значки
  • 3 Ограничения и критика
  • 4 Ссылки
  • 5 Внешние ссылки

История

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

Стандартизация

Значок был стандартизирован Консорциум World Wide Web (W3C) в рекомендации HTML 4.01, выпущенной в декабре 1999 года, и позже в рекомендации XHTML 1.0, выпущенной в январе 2000 года. В стандартной реализации используется элемент ссылки с атрибутом rel в разделе документа, чтобы указать формат файла, имя и расположение файла. В отличие от предыдущей схемы, файл может находиться в любом каталоге веб-сайта и иметь любой формат файла изображения.

В 2003 году .ico был зарегистрирован третьей стороной в Internet Assigned Numbers Authority (IANA) с типом MIME image / vnd.microsoft.icon. Однако при использовании формата .icoдля отображения в виде изображений (например, не в виде значка) Internet Explorer не может отображать файлы, обслуживаемые с этим стандартизированным типом MIME. Обходной путь для Internet Explorer - связать .icoс нестандартным image / x-iconтипом MIME на веб-серверах.

RFC 5988 создал реестр отношений ссылок IANA, а rel = "icon"был зарегистрирован в 2010 году на основе спецификации HTML5. Популярный теоретически идентифицирует два отношения, «ярлык» и «значок», но «ярлык» не регистрируется и является избыточным. В 2011 году стандарт жизни HTML указывал, что по историческим причинам «ярлык» разрешен непосредственно перед «icon»; однако «ярлык» не имеет значения в этом контексте.

Устаревшая

Internet Explorer 5–10 поддерживает только формат файла ICO. Netscape 7 и Internet Explorer версий 5 и 6 отображают значок только тогда, когда страница отмечена закладкой, а не просто при посещении страниц, как в более поздних браузерах.

Реализация браузера

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

Поддержка формата файла

В следующей таблице показана поддержка формата файла изображения для значка.

Браузерформат файла изображения
ICO PNG GIF анимированные GIF-файлы JPEG APNG SVG
Edge ДаДаДаНетНеизвестноНеизвестноНеизвестно
Firefox 1.01.01.0ДаДа3.041.0
Google Chrome ДаДа4.0No4.0Нет80
Internet Explorer 5.011.011.0NoNoNoNo
Opera 7.07.07.07.07.09.544.0
Safari Да4.04.0Нет4.0НетНе- стандартный (12.0)

Кроме того, такие файлы значков могут иметь размер 16 × 16, 32 × 32, 48 × 48 или 64 × 64 пикселей, а также 8-битные, 24-битные или 32 бита при глубине цвета. В статье Формат файла ICO подробно описаны значки с более чем 256 цветами на различных платформах Microsoft Windows.

Использование значка

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

БраузерАдресная строкаРаскрывающийся список адресной строкиПанель ссылокЗакладкиВкладкиПеретащите на рабочий стол
EdgeНетДаДаДаДаДа
Firefox1.0–12.0: Да.>v13: НетДаДаДаДаДа
Google ChromeNoНетДаДа1.0No
Internet Explorer7.0Нет5.05.07.05.0
Opera7.0–12.17: Да.>v14: НетНет7.07.07.07.0
SafariДаДаNoДа1.0–8.0: Да. 9.0–11.0: Нет.>12.0: ДополнительноNo

Программное обеспечение Opera добавило возможность для изменения значка в Быстрый набор в Opera 10.

Как использовать

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

EdgeFirefoxGoogle ChromeInternet ExplorerOperaSafari
ДаДаДаДаДаДа
ДаДаДаДа (из IE 9)ДаДа
ДаДаДаДа ( из IE 9)ДаДа
ДаДаДаДа (из IE 11)ДаДа
ДаДаДаДа (из IE 11)ДаДа
ДаДаДаДа (из IE 11)ДаДа
ДаДаДаДаДаНет
НетНетНетНетНетДа
favicon.ico, расположенный в корне веб-сайтаДаНеобязательноДаДаНеобязательноДа
приоритет: предпочтительнее корневая или (X) HTML-связанная версиясвязаносвязаносвязаноссылка ed??

Если присутствуют ссылки и для PNG, и для иконок ICO, браузеры, совместимые с PNG-иконками, выбирают, какой формат и размер использовать следующим образом. Firefox и Safari будут использовать последний значок. Chrome для Mac будет использовать любой значок, отформатированный в формате ICO, в противном случае - значок 32 × 32. Chrome для Windows будет использовать значок, который идет первым, если он имеет размер 16 × 16, в противном случае - ICO. Если ни один из вышеупомянутых параметров недоступен, оба Chromes будут использовать тот значок, который появится первым, в точности противоположное Firefox и Safari. Действительно, Chrome для Mac проигнорирует значок 16 × 16 и будет использовать версию 32 × 32, только чтобы уменьшить его до 16 × 16 на устройствах без Retina. Opera полностью случайным образом выберет любой из доступных значков.

Только SeaMonkey по умолчанию не загружает файлы favicon.icoв корень веб-сайта.

Поддержка устройств

Для устройств Apple с iOS операционной системой версии 1.1.3 или новее, а также для некоторых устройств Android, можно предоставить настраиваемый значок, который пользователи могут отображать на своих домашних экранах, используя кнопку «Добавить на главный экран» на странице общего доступа в Safari. Эта функция включается путем предоставления в разделе документов, обслуживаемых веб-сайтом. Если пользовательский значок не предоставлен, вместо него на главном экране будет отображаться эскиз веб-страницы.

Рекомендуемый базовый размер для этого значка составляет 152 × 152 пикселей.

Для iPad базовый размер - 180x180 пикселей. Планшеты Android [через Chrome] предпочитают значок в формате PNG 192x192.

Файл значка, на который ссылается apple-touch-icon, изменен для добавления закругленных углов. В версиях iOS до iOS 7 будут добавлены падающая тень и отражающий блеск, а также может быть предоставлен значок apple-touch-icon-precomposed, чтобы устройства не применяли отражающее сияние к изображению.

С закругленными углами, добавленными iOS

Браузерам и мобильным устройствам не требуется HTML для получения этих значков. В корне веб-сайта по умолчанию находится файл apple-touch-icon.png(в порядке приоритета).

Рекомендации HTML5 для значков разных размеров

Текущая спецификация HTML5 рекомендует указывать несколько размеров для значков, используя атрибуты rel = "icon" sizes = "разделенный пробелами список размеров значков"в теге . Несколько форматов значков, включая форматы контейнеров, такие как файлы Microsoft .ico и Macintosh .icns, а также Масштабируемая векторная графика, могут быть предоставлены путем включения тип содержимого в формате type = "file content-type"в теге .

Начиная с iOS 5, мобильные устройства Apple игнорируют рекомендацию HTML5 и вместо этого используют проприетарный метод apple-touch-icon, описанный выше. Однако веб-браузер Google Chrome выберет наиболее подходящий размер из тех, что указаны в заголовках HTML, чтобы создать значки приложений 128 × 128 пикселей, когда пользователь выберет «Создать ярлыки приложений»... из меню "Инструменты".

Анимированные значки

Различные браузеры, такие как Chrome, Firefox и Opera, поддерживают анимацию значков. Отчет об ошибке был открыт для Firefox с 2001 года с запросом способа отключить эту функцию.

Ограничения и критика

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

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

Фавиконами часто манипулируют как часть фишинговых или перехватывающих атак на веб-страницы HTTPS. Многие веб-браузеры отображают значки рядом с областями пользовательского интерфейса веб-браузера, такими как адресная строка, которые используются, чтобы сообщить, использует ли соединение с веб-сайтом безопасный протокол, например TLS. Изменив значок на знакомое изображение висячего замка, злоумышленник может попытаться обмануть пользователя, заставив его думать, что он надежно подключен к нужному веб-сайту. Автоматизированные инструменты атаки типа «злоумышленник посередине», такие как SSLStrip, используют этот прием. Чтобы избежать этого, некоторые веб-браузеры отображают значок на вкладке, одновременно отображая статус безопасности протокола, используемого для доступа к веб-сайту, рядом с URL-адресом.

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

Ссылки

Внешние ссылки

Искать favicon в Викисловаре, бесплатном словаре.
Викискладе есть медиафайлы, связанные с Favicons.
Последняя правка сделана 2021-05-20 11:56:44
Содержание доступно по лицензии CC BY-SA 3.0 (если не указано иное).
Обратная связь: support@alphapedia.ru
Соглашение
О проекте