為你的網站製作iPhone桌面圖示
使用iPhone時,若在Safari將網頁加入主畫面,就會在iPhone的桌面上顯示一個捷徑圖示(icon),但如果這個網站沒有為iPhone製作專用的圖示,那麼在桌面上所顯示的圖示只是網頁縮圖而已,並不美觀。
在這裡,跟大家分享一個免費製作iPhone專用圖示的線上工具:
iPhone Icon Generator
只要將自己製作的圖片上傳後,便能自動產生iPhone專用的圖示檔(png格式),非常方便。
獲得圖示檔案後,將圖檔上傳至自己的網站根目錄,然後在頁面HTML裡的<head>與</head>之間加上這一行:
<link href="xxxxxxxx.png" rel="apple-touch-icon" />
就可以了。(請記得要將 xxxxxxxx.png 改成你所製作的圖示檔名)
同場加映:
我為「哲生博客」所製作的iPhone icon:
(哲生原力LOGO設計理念說明)
我的icon出現在iPhone桌面上的模樣:
在這裡,跟大家分享一個免費製作iPhone專用圖示的線上工具:
iPhone Icon Generator
只要將自己製作的圖片上傳後,便能自動產生iPhone專用的圖示檔(png格式),非常方便。
獲得圖示檔案後,將圖檔上傳至自己的網站根目錄,然後在頁面HTML裡的<head>與</head>之間加上這一行:
<link href="xxxxxxxx.png" rel="apple-touch-icon" />
就可以了。(請記得要將 xxxxxxxx.png 改成你所製作的圖示檔名)
同場加映:
我為「哲生博客」所製作的iPhone icon:
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhttLA4WWqm_MP-uK1w_TnM5SzV_j_UPnmDVvM0MCdP9w8ZF3AEQYMUg8D3s-BMXJwlJ_-UGWH4VumItuIVr3Sb6U0sYMM_PMEAc9KoCcjoLt2ejJR8nMJCUXR55dDBj1jz2eIvLA/s200/apple-touch-icon-256.png)
我的icon出現在iPhone桌面上的模樣:
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjywOGwQPI4BShS2RHFpmyVFS1QLTCvj6CJq_hgvqst1kU2kSO-MYnSt5KYiagoCZJDvUY232nhCm1K9Ms42XQD32AeW_U1KqbY1Hr_Lja-e4S5o6j2ALOyUwGJwCJd3Hxj-p8FIA/s640/IMG_5162.png)
留言