Closed 。这个问题需要多问focused 。目前不接受答案。
更新的问题：
2022 年创建网站图标时的最佳实践是什么？
这是 2013 年提出的原始问题：
我正在尝试了解网站图标、触摸图标以及现在的平铺图标所需的所有这些不同尺寸和格式。
我读过这篇文章：http://www.jonathantneal.com/blog/understand-the-favicon 但我仍然有点不清楚到底要使用什么才能在所有设备和浏览器 >= IE8 上看起来相当不错。
我想我应该创建以下内容：
ICO
PNG
平铺图标
苹果触摸图标https://github.com/h5bp/html5-boilerplate/issues/1367
...然后使用此代码来为他们提供服务？
<link rel="apple-touch-icon" href="path/to/touchicon.png">
<link rel="icon" href="path/to/favicon.png">
<!--[if IE]><link rel="shortcut icon" href="path/to/favicon.ico"><![endif]-->
<!-- or, set /favicon.ico for IE10 win -->
<meta name="msapplication-TileColor" content="#D83434">
<meta name="msapplication-TileImage" content="path/to/tileicon.png">
我错过了什么吗？
我不清楚这是否会覆盖 IE 10？
Favicon 比听起来复杂得多。 10年前，favicon.ico是唯一需要的物品。然后是触摸图标，然后是由于不同的 iOS 设备屏幕分辨率而出现的多个触摸图标，然后是 Windows 的平铺图标......
这里的一些答案非常全面——而且势不可挡（所有这些，只是为了一个网站图标？）。然而，他们未能表明Windows 的 310x310 磁贴图标建议为 558x558 。由于它们是几个月前写的，因此没有提及最近发生的事情Android Chrome M39 的清单 or the OS X El Capitan 上 Safari 的固定选项卡 SVG 图标 .
每个平台的设计是另一个棘手但被忽视的话题。例如，网站图标通常是透明的。但 iOS 不支持透明度（举个例子，比较一下所以触摸图标 以及当您将 SO 添加到 iPhone 的主屏幕时您会得到什么）。
由于这些原因，我认为网站图标的最佳实践是not 手动创建它。相反，使用工具来自动化整个过程并强制执行平台准则。
我建议你使用真实网站图标生成器 。它会生成完成工作所需的所有图片和 HTML 代码：
favicon.ico和桌面浏览器的 PNG 图标
适用于 iOS 和 Android 设备的 Apple 触摸图标
Windows 8 磁贴
OS X El Capitan 上 Safari 的固定选项卡图标
例如，它不仅生成msapplication-TileImage图片和标记，但也是最新的browserconfig.xmlIE11 支持的文件。几个月前它还进行了更新，以支持 Android Chrome 清单和 Safari OS X El Capitan。
完全披露：我是该网站的作者。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
