相信很多細心的朋友，在瀏覽很多網站的時候，都會發現在瀏覽器的地址欄前面會有一個小圖標，在瀏覽器的標籤位置也有一個小圖標，例如 百度 、騰訊等這樣的國內大型網站都有這樣的圖標。這樣的小圖標是怎麼做上去的呢？想不想在自己的網站也增加一個這樣的小圖標呢？有了這個小圖標，你的網站就會比別人的網站更加醒目，更能引起其他人的注意。下面跟我一起來做吧！
工具/原料
ico製作工具
計事本
方法/步驟
第1步、認識網址前的小圖標 1、能在瀏覽器標籤、地址欄左邊和收藏夾欄顯示小圖標的網站，其網站都是使用了其名稱為“favicon.ico”圖標文件，格式為ico格式，圖標大小一般為16*16,32*32像素。這種圖標是不僅可以是網站的縮略標誌，也可以是展示網站個性的縮略logo標誌，甚至也可以說是網站頭像。如果要讓網站看起來更專業、更美、更有個性，製作和使用“favicon.ico”文件是必不可少的。 2、 Favicon原本是windows中存儲單個圖案的一種圖標文件格式，現可以用作軟件、文件夾以及網站等的縮略標誌，顯示在用戶的資源管理器，瀏覽器的地址欄、標題欄和多頁面瀏覽器的標籤欄上。圖標文件一般尺寸較小，常見的為16*16,32*32，48*48。圖標是部分透明的，可以直接打開瀏覽使用。
第2步、製作ico格式的小圖標
1、製作ico格式小圖標的方法有很多，可以使用photoshop、fireworks等這樣的軟件來製作。不過，這樣的軟件專業性很強，一般人不建議使用，我們使用了在線製作的方法。在百度搜索“ico圖標製作”，找到ico在線製作網站，如“www.ico.la”網站，如下圖
2、打開這個網站，根據提示上傳圖像，上傳圖像後，得到很多ico圖標的尺寸，下載我們需要的16*16,32*32兩種尺寸的圖標到電腦，如下圖
第3步、使用ico小圖標
1、如果我們是想在網頁首頁的地址欄、標籤位置顯示我們剛才製作的小圖標，那麼我們就打開首頁的源代碼，找到head部分，並在head部分插入下面這句代碼。我選擇的是用“計事本”打開的首頁源代碼。
，如下圖所示
2、“href”後面的參數是ico圖標的地址，href="favicon.ico"的意思是說，我把這個圖標文件存放在了和首頁相同的的位置，也就是網站的主目錄，具體根據你網站上存放的位置來寫，如下圖
第4步、上機測試
因為本網站程序是用ASP來開發的，所以在測試前，我們電腦上得安裝好了IIS，並給網站新建了一個虛擬目錄，如下圖所示
在“index.asp”文件點右鍵，選擇並點擊“瀏覽”，如下圖
我們看到在打開的網頁上已經在地址欄、標籤欄已出現了我們製作的小圖標；發送這個網站的快捷方式到桌面，我們也看到了我們製作的這種小圖標，如下圖
至此，網址前的小圖標已成功實現，是不是很開心、有成就感呢？
注意事項
1、小圖標的格式一定要是ico格式的，並且一定要命名為favicon.ico，寬度和高度都是32個像素值 ；
2、如果按照上面的步驟做完後無法看到小圖標，請把IE瀏覽器的緩存清理掉，清理完緩存之後即可看到小圖標，實在不行，換個瀏覽器試下；
3、小圖標的存放位置一定要和代碼裡的存放位置一致，否則無法顯示。