今天心血來潮，想給自己的小破站整點(diǎn)兒新花樣，琢磨著換個(gè)favicon圖標(biāo)，就是瀏覽器標(biāo)簽頁上顯示的那個(gè)小圖標(biāo)，讓它看起來更個(gè)性化一點(diǎn)。這玩意兒雖然小，但也能體現(xiàn)出一個(gè)網(wǎng)站的“門面”嘛

于是我就開始折騰之旅。我還想著自己能不能畫一個(gè)，畢竟咱也算是個(gè)“靈魂畫手”（自認(rèn)為）。

摸索階段

我先是搜下“favicon圖標(biāo)生成”，出來一堆在線工具，看得我眼花繚亂。我隨便點(diǎn)進(jìn)去一個(gè)叫“*”的網(wǎng)站，還真能在線畫！界面看起來還挺時(shí)髦的，有點(diǎn)那個(gè)什么Web2.0的感覺（雖然我也不太懂）。

我興致勃勃地在上面涂涂畫畫，畫半天，感覺自己畫出來的東西……emmm……怎么說，有點(diǎn)慘不忍睹?？磥恚g(shù)業(yè)有專攻，這畫圖標(biāo)也不是誰都能干的。

然后我又試它那個(gè)導(dǎo)入圖片生成的功能，把自己頭像傳上去，結(jié)果生成的圖標(biāo)要么變形，要么模糊，效果都不太理想?？磥恚苯佑矛F(xiàn)成的圖片也不太行。

繼續(xù)嘗試

我又換幾個(gè)別的在線工具，有的能用字母生成圖標(biāo)，有的能用各種現(xiàn)成的圖案，還有的甚至能用字體圖標(biāo)！我看到一個(gè)網(wǎng)站，好像是叫啥“Font Awesome”的，說能用字體做圖標(biāo)，還挺酷炫。

不過我試一圈，這些工具生成的圖標(biāo)，要么就是太簡(jiǎn)單，要么就是跟我的網(wǎng)站風(fēng)格不太搭?？磥?，想找到一個(gè)完全滿意的圖標(biāo)，還真不是一件容易的事。

最終方案

折騰一下午，我都有點(diǎn)想放棄。不過作為一個(gè)有強(qiáng)迫癥的博主，怎么能容忍自己的網(wǎng)站沒有一個(gè)好看的favicon？

我想到一個(gè)辦法：既然自己畫不行，找現(xiàn)成的也不行，那就找個(gè)差不多的，然后自己稍微改改！

我找到一個(gè)在線工具，它提供很多基礎(chǔ)的圖形，可以自定義顏色。我選一個(gè)比較簡(jiǎn)潔的圖形，然后把顏色調(diào)成和我網(wǎng)站主題色差不多的，看起來還不錯(cuò)！

然后，我用截圖工具把這個(gè)圖標(biāo)截下來，保存成PNG格式。再用另一個(gè)在線工具（名字我忘，反正就是能把PNG轉(zhuǎn)成ICO的）把PNG圖片轉(zhuǎn)成ICO格式，因?yàn)閒avicon好像必須是ICO格式的才行。

終于，我得到一個(gè)還算滿意的favicon圖標(biāo)！

上傳并應(yīng)用

一步，就是把這個(gè)圖標(biāo)上傳到我的網(wǎng)站服務(wù)器，然后在網(wǎng)頁代碼里加上一段代碼，告訴瀏覽器這個(gè)圖標(biāo)在哪兒。具體代碼我就不寫，反正網(wǎng)上一搜一大堆。

刷新一下網(wǎng)頁，看到瀏覽器標(biāo)簽頁上終于顯示出我新做的圖標(biāo)，心里還是有點(diǎn)小激動(dòng)的！

雖然過程有點(diǎn)曲折，但最終還是實(shí)現(xiàn)！以后再有人訪問我的小破站，也能看到這個(gè)獨(dú)一無二的favicon圖標(biāo)！

今天的分享就到這里，希望對(duì)大家有所幫助！