將Apple圖標添加到網站

Question

我已經使用Woorank測試了我的網站並顯示了有關丟失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」

Answer 1

最小的圖標應該是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/