2007年3月31日

自製動態 favicon

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

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

動態的 favicon 製作困難度較高,可以使用 Ulead GIF Animator 5 或是使用 UnFREEz 加入一張張靜態圖片轉換成動態的 gif(教學在此),大小需為 16x16 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">
 

搞定,收工!

Related Posts Plugin for WordPress, Blogger...