我不确定正确的尺寸应该是多少。
许多网站似乎重复说苹果触摸图标应该是 57x57 像素,但引用了一个断开的链接作为它们的来源。
Hanselman和playgroundblues的评论建议使用不同的尺寸,包括 163x163 和 60x60。
Apple 自己的apple.com 图标是 129x129!
请参阅我的相关问题: 如何为我的网站提供 iPhone 图标?
我不确定正确的尺寸应该是多少。
许多网站似乎重复说苹果触摸图标应该是 57x57 像素,但引用了一个断开的链接作为它们的来源。
Hanselman和playgroundblues的评论建议使用不同的尺寸,包括 163x163 和 60x60。
Apple 自己的apple.com 图标是 129x129!
请参阅我的相关问题: 如何为我的网站提供 iPhone 图标?
自 2010 年 8 月 3 日起,Apple 指南似乎现在在其“必需”图标大小中包含“高分辨率”图像(适用于 iPhone 4)。
看起来我们现在需要同时提供 57x57 和 114x114 的图像,以及 640x960 的标题图像。
请参阅作为整个文档一部分的自定义图标和图像创建指南(需要 Javascript):
取决于您希望它拥有多少细节,它需要具有 1:1 的纵横比(基本上 - 它需要是方形的)
我会选择苹果自己的 129*129
Apple 规范为 iOS7 指定了新尺寸:
而 iOS6 及之前的旧尺寸是:
顺便说一句,不推荐使用预先组合的图标。
因此,要支持新设备(运行 iOS7)和旧设备(iOS6 和更早版本),必须存在这 8 张图片,通用代码为:
<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png">
此外,您应该创建一个 152x152 的图片,名为apple-touch-icon.png
.
您可能想知道这个网站图标生成器可以一次生成所有这些图片。完全披露:我是本网站的作者。
官方尺寸为 57x57。我建议使用确切的大小,因为它在加载时占用的内存更少(除非 Apple 缓存缩放的表示形式)。话虽如此,雷克斯是对的,任何正方形都可以
我认为没有“正确的尺寸”。由于 iPhone 确实运行的是 OSX,因此图标渲染系统非常强大。只要您为其提供具有正确纵横比和至少与实际输出一样高的分辨率的高质量图像,操作系统就会非常干净地缩小比例。我的网站使用 158x158,图标在 iPhone 屏幕上看起来像素完美。
2014 年 10 月更新列表,iOS8
带和不带视网膜的 iPhone 和 iPad 列表
<link rel="apple-touch-icon" href="touch-icon-iphone.png">
<link rel="apple-touch-icon" sizes="76x76" href="touch-icon-ipad.png">
<link rel="apple-touch-icon" sizes="120x120" href="touch-icon-iphone-retina.png">
<link rel="apple-touch-icon" sizes="152x152" href="touch-icon-ipad-retina.png">
<link rel="apple-touch-icon" sizes="180x180" href="touch-icon-iphone-6-plus.png">
更新 2014 iOS 8:
适用于 iOS 8 和 iPhone 6 plus
<link rel="apple-touch-icon" sizes="180x180" href="touch-icon-iphone-6-plus.png">
iPhone 6 使用与 iPhone 4 和 5 相同的 120 x 120 像素图像,其余与 iOS 7 相同
更新 2013 iOS7:
对于 iOS 7,推荐的分辨率发生了变化:
其他分辨率还是一样