自製動態 favicon

自製動態 favicon

想要讓網友在瀏覽 Blog 時能留下深刻印象,網站加入書籤後可以顯示獨特的 icon 嗎?動手做一個 favicon 吧!

要製作靜態的 favicon 請先到 Online Icon Maker 上傳一張圖片、或是手動繪製喜歡的 icon 樣式,點選 Download Icon 即可將圖片轉成 ico 下載。

動態的 favicon 製作困難度較高,可以使用 Ulead GIF Animator 5 或是使用 UnFREEz 加入一張張靜態圖片轉換成動態的 gif(教學在此),大小需為 16×16 pixel。

動態的 gif 檔比較好處理,大多數的網路相簿應該都支援上傳 gif 檔,但 ico 格式就很難了,必須另想辦法放到網路上。

如果是 Hinet 用戶可以使用撥接的帳號密碼到 Hinet 我的網頁申請一個 60MB 的網頁空間,透過 ftp 上傳檔案後使用 http://我的帳號.myweb.hinet.net/favicon.ico 的網址連結得到。

或是到 Google Page Creator 申請一個網頁空間,在首頁右方可上傳檔案,上傳 ico 檔後可找到連結網址。

接著在 Blog 的 Template 的 <head></head> 中加入下列語法。

<link href="http://ICO網址/favicon.ico" rel="shortcut icon">
<link href="http://GIF網址/favicon.gif" type="image/gif" rel="icon">
 

搞定,收工!