2012-10-24 85 views
4

我已经使用Woorank测试了我的网站并显示了有关丢失Apple图标的警告。将Apple图标添加到网站

我已经搜查,但我不知道如何将这个图标,我发现这个代码

<link rel="apple-touch-icon-precomposed" href="apple-touch-iphone.png" /> 
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="apple-touch-ipad.png" /> 
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-touch-iphone4.png" /> 
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="apple-touch-ipad-retina.png" /> 

我必须包括头这些行标准图标的一样吗? (我的网站是在HTML5)

什么是第一个图像的在这些线路的决议“苹果触摸iphone.png”

回答

5

最小的图标应该是57×57像素。

请注意,“-precomposed”状态表示链接的图标文件已经闪亮并且处于3D状态。如果您不使用“-precomposed”,则iOS会为图像添加3D亮度效果。

是的,当然你需要插入link标签到head

一个完整的图标集

示例:苹果iOS图标

<link rel="shortcut icon" type="image/vnd.microsoft.icon" href="favicon.ico"> 
<link rel="apple-touch-icon" type="image/png" href="icon.57.png"><!-- iPhone --> 
<link rel="apple-touch-icon" type="image/png" sizes="72x72" href="icon.72.png"><!-- iPad --> 
<link rel="apple-touch-icon" type="image/png" sizes="114x114" href="icon.114.png"><!-- iPhone4 --> 
<link rel="icon" type="image/png" href="icon.114.png"><!-- Opera Speed Dial, at least 144×114 px --> 

文档:在Opera速度http://developer.apple.com/library/safari/#documentation/appleapplications/reference/safariwebcontent/ConfiguringWebApplications/ConfiguringWebApplications.html

文档拨号图标:http://dev.opera.com/articles/view/opera-speed-dial-enhancements/

+0

感谢。我没有阅读其余的内容,因为我在另一个问题中找到了这段代码,没有链接到完整的Apple文档。 – Asgard