如何为 Safari 阅读列表链接 Retina favicon？答案

【问题标题】：How to link Retina favicon for Safari Reading List?如何为 Safari 阅读列表链接 Retina favicon？
【发布时间】：2013-12-26 19:54:33
【问题描述】：

我创建了各种尺寸的网站图标。它在我的 Retina MacBook Pro 上的地址栏中看起来很棒，但 Safari 阅读列表中的图标是像素化的。我的印象是它使用 32 像素的版本，但在 Retina 显示屏上是 64 像素。我的图标包含该分辨率，但图标仍然模糊。

创建和链接此图标以在 Retina 上看起来很棒的正确方法是什么？

<link rel="apple-touch-icon-precomposed" sizes="152x152" href="images/favicon-152.png">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/favicon-144.png">
<link rel="apple-touch-icon-precomposed" sizes="120x120" href="images/favicon-120.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/favicon-114.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/favicon-72.png">
<link rel="apple-touch-icon-precomposed" href="images/favicon-57.png">
<link rel="shortcut icon" href="/favicon.ico">
<link rel="icon" sizes="16x16 24x24 32x32 48x48 64x64" href="/favicon.ico">

【问题讨论】：

我不知道 Safari 对 favicon.ico 的表现如何。您是否考虑添加 PNG favicon，例如 "" ？
这会导致相同的外观。似乎苹果正在将其缩小到 32x32，然后在 Retina 上将其放大到 64x64。即使我唯一的图标是 128x128，URL 栏中的图形看起来也比阅读列表中的图形好。我会将此信息报告给 Apple。

标签： safari icons favicon graphic retina

【解决方案1】：

我认为这是 Safari 7 中的一个错误，在 Safari 7.1 中尚未解决。

Safari 8 不会（从当前的公共测试版开始）显示添加到阅读列表中的网站的网站图标。相反，如果该网站上有一张图片，它会显示它的样子。

不过，Safari 8 确实会在收藏夹和经常访问中显示图标。但不是 favicon，而是显示 Apple Touch 图标，并为 Retina 显示器选择合适的尺寸。

【讨论】：