February 6, 2007

網址列的小圖標 favicon

在瀏覽器的網址前面加上一個小圖標,凸顯網站的風格。

Step1.
先在 Mikons beta 自己製作圖標,注意,你必須要有 Shockwave 的 plugin,沒有的話網站上有下載連結。將圖標儲存在電腦裡。

Photobucket - Video and Image Hosting


Step2.
建議將圖標透過 resize 或裁切(crop)的方式,做成 16x16 或 32x32 的大小。

Step3.
FavIcon from Pics 載入圖標,馬上就好了。將 FavIcon download 下來, zip 檔裡會有 .ico, .png 和 .gif 三種檔案,其中 .gif 就是會動的圖標。

Photobucket - Video and Image Hosting


Step4.
將 .ico 和 .gif 兩個檔案上傳至網路空間,如果先前沒有註冊網路空間的話,不妨利用 Google Page Creator

Step5.
接下來就是把 FavIcon 放在自己的網站上了。這部分的教學請看「做個會跳會動的FavIcon玩玩吧!」。

Note
1. 如果只要靜態的 icon,那麼只需要 .ico 這個檔案即可。
2. Mikons 做出來的圖標會有白底,算是一個缺點。
3. 這是我嘗試的作品:
Photobucket - Video and Image Hosting



延伸閱讀
做個會跳會動的FavIcon玩玩吧! @ Ben's 部落不及格

6 comments:

  1. 喔喔~~很讚耶!!感激教學~寫得真容易懂ㄚ~~~

    ReplyDelete
  2. 因為我也不是專家,希望對大家有幫助囉 ^^

    ReplyDelete
  3. Thanks for the mention of Mikons. More coming soon!

    ReplyDelete
  4. To Mark:
    Mikons is a good interesting website, and I really expect new things that you are preparing now.

    ReplyDelete
  5. 請問我自己創造出來的是存在上面ㄇ?可以自己下載下來做商業用途ㄇ?另外,感謝你的推薦,這真的是一個很友善的網站

    ReplyDelete
  6. 我記得,做出來的檔案是可以下載的。另外,可否作為商業用途這部分,我建議還是找找網站上的使用條款,或直接寫信去問,會得到比較完整的回答。

    ReplyDelete