html - 2013 年最先进的网站图标是什么？-6ren

html - 2013 年最先进的网站图标是什么？

转载作者：IT老高更新时间：2023-10-28 23:34:18

Favicon 业务在过去几年变得复杂起来。 (重新)发明了新型设备，例如平板电脑和智能手机。他们以新的方式使用网站图标(例如，作为主屏幕上的应用程序图标)，并且需要供应商特定的方式来链接它们。以类似的方式，浏览器现在允许为网络应用程序创建桌面快捷方式(它们也使用图标作为图标)。更糟糕的是，我们现在在可移植设备和笔记本电脑中都有高分辨率(“视网膜”)显示器，这需要更高分辨率的图像来显示图标。更糟糕的是，不同的浏览器(和版本)支持不同的图标图像格式和不同的大小。从仅 16x16 的 .ico-only IE6 开始，到现在支持 .svg 图标的 Opera 结束。

我应该怎么做才能在当今的大多数设备和浏览器上支持清晰的图标？

到目前为止，我能找到的最好的资源是 html5boilerplate , 建议使用以下文件:

apple-touch-icon-114x114-precomposed.png
apple-touch-icon-144x144-precomposed.png
apple-touch-icon-57x57-precomposed.png
apple-touch-icon-72x72-precomposed.png
apple-touch-icon-precomposed.png
apple-touch-icon.png
favicon.ico  # 32x32

虽然没有在 <head> 中放置任何指向它们的链接标记。

编辑:另一个考虑因素是 .ico 文件可以在其中存储多个不同分辨率的图像。这有用还是受支持？

最佳答案

http://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html 上有一些官方建议这似乎证实了你的 list 。

理想情况下，favicon.ico 文件应该在一个文件中包含多个分辨率，因为最新的浏览器现在可以利用这一点，并且 16 x 16 图标在视网膜屏幕上看起来永远不会很好。

微软现在显然建议 favicon.ico 文件至少包含 16×16、24×24、32×32 和 64×64。

我刚刚推出了一个免费的在线工具，可以在以下位置创建这样的网站图标:http://iconifier.net

有关最新网站图标信息的更多链接，请参阅网站上的自述文件页面。

关于html - 2013 年最先进的网站图标是什么？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14343231/