苹果触摸图标的正确像素尺寸是多少？

Question 1

我不确定正确的尺寸是多少。

许多网站似乎都在重复苹果触摸图标应为57x57像素，但引用断开的链接作为其来源。

Hanselman和游乐场的评论建议使用不同的尺寸，包括163x163和60x60。

苹果自己的apple.com图标是129x129！

看到我的相关问题：如何为我的网站提供iPhone图标？

Question 2

截至2010年8月3日，Apple准则现在似乎在“必需”图标尺寸中包括了“高分辨率”图像（适用于iPhone 4）。

看来我们现在需要同时提供57x57和114x114的图片以及640x960的标题图片。

请参阅自定义图标和图像创建指南（需要Javascript），该指南是整个文档的一部分：

iOS人机界面指南（2013; Apple Inc .; PDF; 26.3 MB）

Question 3

从Apple开发人员连接的Google缓存-Web Apps开发中心-设计内容...

创建一个Web剪辑书签图标

iPhone和iPod touch允许用户在其主屏幕上将Web Clip书签保存到您的站点。

要为网站的所有页面指定书签图标，请将名为“ apple-touch-icon.png”的PNG图像放置在Web服务器的根目录下-类似于网站图标的“ favicon.ico”。

要覆盖特定网页上的站点书签图标，请在页面的<head>元素中插入与<link rel =“ apple-touch-icon” href =“ / customIcon.png” />类似的<link>元素。

书签图标的尺寸应为57x57像素。如果图标的大小不同，则会缩放并裁剪以适合。

Safari会自动将图标与标准的“玻璃”覆盖层进行合成，使其看起来像内置的iPhone或iPod应用程序。

Question 4

取决于您要拥有多少细节，它的宽高比必须为1：1（基本上-必须为正方形）

我会选择苹果自己的129 * 129

Question 5

我无法提供这些尺寸的数据源，因为官方参考已由ADC锁定和密钥。

但是，许多非NDA网站都提供了有关如何创建图标的教程。例如这里：

HOWTO：iPhone Webclip图标（2008年1月； Dan Dickinson撰写）

Question 6

作为其Safari Web内容指南的一部分，Apple实际上有一个公开可用的页面，名为“为Web Clip指定网页图标”（需要Javascript），其中涵盖了所有分辨率及其实现。

Safari Web内容指南（2012; Apple Inc; PDF; 6,91 MB）

Question 7

官方尺寸为57x57。我建议使用确切的大小，仅仅是因为它在加载时会占用较少的内存（除非Apple缓存缩放的表示形式）。话虽如此，雷克斯（Rex）正确的是任何正方形都可以使用

Question 8

Apple规格为iOS7指定了新尺寸：

60x60
76x76
120x120
152x152

而iOS6和更低版本的旧尺寸为：

57x57
72x72
114x114
144x144

顺便提一下，不建议使用预先组合的图标。

因此，要支持新设备（运行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。

您可能想知道，这个图标生成器可以一次生成所有这些图片。完全披露：我是该网站的作者。

Question 9

我认为没有“正确的尺寸”。由于iPhone确实在运行OSX，因此图标呈现系统非常强大。只要您给它提供合适的宽高比和至少与实际输出一样高的分辨率的高质量图像，操作系统就会非常干净地缩小尺寸。我的网站使用158x158，并且该图标在iPhone屏幕上看起来是像素完美的。

Question 10

NilObject的链接导致我伟大的博客帖子上的图标追赶在makentosh.com

...当然，所有这些不一致之处最终都必须得到解决，对吗？好吧2.0很好地处理了它！最后，57x57实际上就是57x57。

...每个像素...完美呈现。

Question 11

您不必再为正确的尺寸而烦恼。如果您的图标具有iTunes艺术品文件（即1024 * 1024大小的文件），那么我已经创建了此应用程序，它将根据此处提供的信息为您提供所有图标。从此处获取应用程序，并按照自述文件中的说明创建iOS应用程序所需的所有图标。

Question 12

更新列表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和iPhone 5相同的120 x 120 px图像，其余与iOS 7相同

更新2013 iOS7：

对于iOS 7，建议的分辨率已更改：

适用于iPhone Retina从114 x 114像素到120 x 120像素
适用于iPad Retina从144 x 144像素到152 x 152像素

其他分辨率还是一样

默认为57 x 57像素
对于没有视网膜的iPad为76 x 76像素