當我們在逛一些網站的時候可能會發現,顯示在瀏覽器網址列前的小圖示會變成不同的圖案,或者當你將這個網站加入我的最愛以後,當你打開我的最愛列表時,也會發現這個網址的最前方也是這個小圖示,例如小樽的網站就有(如下圖)
這是怎麼做到的呢?其實非常的簡單唷
1.首先你必須要先製作一張16X16像素的icon(.ico檔),至於怎麼製做呢?你可以使用軟體例如IconCool Editor,或者你也可以到FavIcon from Pics 這個網站來線上製造一張屬於自己的icon檔,完成之後,為他命名(例如小樽的叫skylogo.ico)
2.然後將他上傳到你的網頁空間下,你可以放在根目錄也可以放在任意資料夾只要你記的住
3.將你希望產生效果的網頁檔案打開,使用原始碼編輯模式,在<head></head>之間任意位置,插入以下兩條指令
<link rel=”shortcut icon” href=”圖示路徑/檔名.ico”/>
<link rel=”Bookmark” href=”圖示路徑/檔名.ico”/>
上述icon圖檔的路徑可以是絕對位置也可以是相對位置,如果你不確定網頁跟icon圖檔的相對關係,避免路徑出錯找不到圖檔的話可以使用絕對位置,上面兩斷指令第一段是將icon指定讓瀏覽器知道要到哪裡去找到這個網站的icon檔,第二段是處理書籤(bookmark)裡面的圖示,但是即使沒有寫第二行,只要你關閉重新開啟瀏覽器,瀏覽器也會自動幫你替換圖示,有寫的話馬上就會幫你更換圖示