Нужны ли несколько размеров favicon? - PullRequest
Новая
       10

Нужны ли несколько размеров favicon?

0 голосов
/ 12 марта 2019

Я работаю над редизайном сайта, который включает в себя новый значок. На текущем сайте указаны все следующие размеры: 

  <link rel="apple-touch-icon" sizes="57x57" href="/img/apple-icon-57x57.png">
  <link rel="apple-touch-icon" sizes="60x60" href="/img/apple-icon-60x60.png">
  <link rel="apple-touch-icon" sizes="72x72" href="/img/apple-icon-72x72.png">
  <link rel="apple-touch-icon" sizes="76x76" href="/img/apple-icon-76x76.png">
  <link rel="apple-touch-icon" sizes="114x114" href="/img/apple-icon-114x114.png">
  <link rel="apple-touch-icon" sizes="120x120" href="/img/apple-icon-120x120.png">
  <link rel="apple-touch-icon" sizes="144x144" href="/img/apple-icon-144x144.png">
  <link rel="apple-touch-icon" sizes="152x152" href="/img/apple-icon-152x152.png">
  <link rel="apple-touch-icon" sizes="180x180" href="/img/apple-icon-180x180.png">
  <link rel="icon" type="image/png" sizes="192x192"  href="/img/android-icon-192x192.png">
  <link rel="icon" type="image/png" sizes="32x32" href="/img/favicon-32x32.png">
  <link rel="icon" type="image/png" sizes="96x96" href="/img/favicon-96x96.png">
  <link rel="icon" type="image/png" sizes="16x16" href="/img/favicon-16x16.png">

Лично я никогда этого не делал. Я всегда просто создавал один большой (192x192) png и позволял браузеру / устройству изменять его размер по мере необходимости. Да, технически это может привести к некоторым артефактам, если соотношение между размерами источника и назначения не делится поровну. Но если исходный материал достаточно велик (как в настоящее время 192x192), это незначительная проблема. Кроме того, подход с одним PNG, похоже, совместим со всеми основными современными браузерами, и в моих собственных тестах выглядит неплохо. Да, размер файла немного больше, но мы говорим только о разнице в несколько килобайт.

Конечно, если вы хотите настроить дизайн каждого размера, то понадобятся разные файлы. Но если предположить, что ваш 192x192 - это то же изображение, что и ваш 16x16, в 2019 году, есть ли причина указывать так много версий favicon?

1 Ответ

4 голосов
/ 16 марта 2019

Выступает автор RealFaviconGenerator.

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

Но вы угадаете правильно: вам нужен только сенсорный значок 180x180.Устройства iOS могут уменьшить его.Единственный конкретный случай, когда вы хотели бы объявить их все, - это когда алгоритм масштабирования iOS (вариант Cubic) не является оптимальным, например, с пиксельной графикой.См. https://realfavicongenerator.net/blog/how-ios-scales-the-apple-touch-icon/ (я написал эту статью).Теперь по умолчанию RealFaviconGenerator создает только значок 180x180.

Для значков рабочего стола (16x16, 32x32 и 96x96 в вашем примере) это для меня незавершенная работа.Мне нужно протестировать все эти размеры вместе с несколькими размерами favicon.ico в последних и старых браузерах.Пока я не потратил время, чтобы пройти все эти эксперименты, и RealFaviconGenerator может быть слишком многословен в этом отношении.

...