♫ みんのブログ ♫

剛剛好在留言板中有同學問到了「如何製作網站圖示」這樣的問題

今天就來教大家一下如何設計一個去背的網站圖示囉～首先來講一下什麼是網站圖示

當我們進入某些網站，會在IE的網址、網站名稱、我的最愛看到如下圖所示的圖示

至於這個圖形是如何設計的呢？其實我們可以先利用美工軟體做出自己想要的樣式

然後依照該美工軟體儲存去背檔案的方式，儲存該圖示為PNG圖檔
（每個美工軟體的方法都有所差異唷～圖檔格式說明可參考這篇文章）

圖檔大小建議作成正方形的圖檔（例如：100x100或50x50即可..）

接下來我們到ConvertIco.com這個網站將我們的圖檔轉換成去背的ICO圖檔

在Upload a PNG or ICO file的地方按瀏覽上傳自己製作的圖檔，按下轉換鈕

轉換完成後你會看到如下圖的畫面，在Click here to Download處按下右鍵／選擇另存目標

接下來在你想要出現圖示的網頁中插入以下語法：

<link rel="shortcut icon" type="image/x-icon" href="fav_icon.ico" />

註：fav_icon.ico為剛轉好的圖檔名稱

接下來把圖示檔與網頁檔儲存在相同的路徑中，上傳到你的網頁空間即可

註：本機預覽是看不到的唷～

以下就是上傳測試後的結果，我們成功囉！