Необходимо добавить ссылку тега для favicon.ico?



есть ли современные браузеры, которые не будут обнаруживать фавикон.Ико автоматически? Есть хоть одна причина, чтобы добавить тег link для favicon.ico?



<link rel="shortcut icon" href="/favicon.ico">


Я предполагаю, что это только необходимо включить его в HTML-документ, если вы решили пойти с GIF или PNG...

599   5  

5 ответов:

выбрать другое местоположение или тип файла (например, PNG или SVG) для favicon:
Одной из причин может быть то, что вы хотите иметь значок в определенном месте, возможно в папке "Изображения" или что-то подобное. Например:

<link rel="icon" href="_/img/favicon.png">

это другое место может даже быть CDN, так же, как это, кажется, сделать с <link rel="shortcut icon" href="http://cdn.sstatic.net/stackoverflow/img/favicon.ico">.

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

на кэш перебора цели:
Добавьте строку запроса в путь для кэш-перебора целей:

<link rel="icon" href="/favicon.ico?v=1.1"> 

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


сноску о местоположении по умолчанию:
Что касается Первого БИТа вопроса: все современные браузеры обнаружат фавикон в месте по умолчанию, так что это не причина использовать link для него.


сноску о rel="icon":
Как указано @Semanino это, используя rel="shortcut icon" Это старый метод, который требовался более старыми версиями Internet Explorer, но в большинстве случаев может быть заменен более правильным rel="icon" инструкция. статья @Semanino основана на правильно ссылки на соответствующей спецификации который показывает rel значение shortcut не является допустимым вариантом.

обратите внимание что и спецификация HTML5 W3C и WhatWG стандартизация

<link rel="icon" href="/favicon.ico">

обратите внимание на значение атрибута "rel"!

значение shortcut icon на rel атрибут очень старый Internet Explorer конкретное расширение и устаревший.

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

вы также можете взглянуть на этот замечательный пост:rel= "ярлык" считается вредным

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

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

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

<link rel="apple-touch-icon" sizes="57x57" href="fav_icons/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="fav_icons/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="fav_icons/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="fav_icons/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="fav_icons/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="fav_icons/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="fav_icons/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="fav_icons/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="fav_icons/apple-icon-180x180.png">

<link rel="icon" type="image/png" sizes="192x192"  href="fav_icons/android-icon-192x192.pn">
<link rel="icon" type="image/png" sizes="32x32" href="fav_icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="fav_icons/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="fav_icons/favicon-16x16.png">

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

Comments

    Ничего не найдено.