如果您拥有自己的网站或正在为他人开发网站，您应该自定义显示在用户iOS 主屏幕上的已保存书签图标。在上面的屏幕截图中，您会看到自定义 OSXDaily 图标位于 iPhone 的屏幕上。

设置Apple Touch Icon 是个好主意，因为默认情况下iOS 只会保存站点的小缩略图。小的缩略图往往很难辨认，而且通常看起来不太好，所以让我们设置自己的图标图像。

如何为网站自定义和设置Apple Touch图标

• 创建图标，确保它是一个正方形，OSXDaily.com上的是512×512像素，但如果你真的想要，你可以选择其他正方形大小——注意大一点的适合视网膜显示
• 将主屏幕图标保存为PNG文件并标注：apple-touch-icon.png
• 将apple-touch-icon.png放到根webserver目录下，这样就可以在domain.com/apple-touch-icon.png
• 通过在iOS 中从Safari 访问网站，然后点击“添加到主屏幕”来测试您的网站主屏幕书签图标
• 查看iOS设备主屏幕，您会看到保存在那里的书签和您的新自定义图标，如上图

只要文件正确命名并位于网络服务器的根目录中，Mobile Safari 就会知道如何处理它，因此无需进一步调整即可显示 iOS 特定的图标。

供参考，这是我们为OSXDaily.com 使用的自定义“apple-touch-icon.png”图像，此示例书签图标的创建和大小适合视网膜显示（）：

您会注意到实际的图标文件没有保存到图标上的光折射，iOS 会自行处理。你可以使用任何你想要的图像，但我建议创建一个捕捉熟悉的现有 iOS 图标 UI 的图像。

这显然与拥有专用的iOS 应用程序不同，但是从网络获得良好的移动用户体验是一个好主意，它避免了开发iOS 应用程序的高昂代价。

嘿，如果你担心这样的事情，你可能至少使用Photoshop来设计图标吧？所以边看边看。