身為新手站長的你想不想要自己網站分頁的 Logo 小圖示是自己網站的標誌呢？ 如果沒有去調整的話，打開自己網站就會是預設的 Wordpress Logo沒有辨識度。
這篇文章跟 Wei 一起 教你怎麼調整自己網站的獨特小圖示喔！
快速跳到你想看的地方
一、Logo小圖示 ＝ Favicon ?
現代人在使用網路時肯定都是一次開很多個分頁，那我們都是用什麼來分辨這麼多個網站呢？
對啦，就是分頁最前面的小圖示對吧？
所以如果你的網站的小 Logo沒有更換的話，會讓你的辨識度降低喔！尤其你是不是也常常一次開好多個分頁幫助你找到最完整的答案呢？這時候在茫茫分頁中，有個明顯有標誌性的Favicon就可以讓你在眾多分頁中脫穎而出喔！
Favicon 網站小圖示是什麼？
Favicon 其實就是 favorites＋icon 的縮寫，是證明網站跟網頁相關聯的圖示（讓你看到圖示就知道分頁是屬於哪個網站），也可以稱為 website icon 、 page icon 、urlicon 。
Favicon主要出現在兩個地方：
- 分頁最前面
- 搜尋結果頁
- 被儲存在書籤、我的最愛時
Favicon 的尺寸與規定
支援格式：最常使用JPEG、PNG也最多瀏覽器支援
尺寸大小：網站小圖示必須是正方形，且邊長為 48 像素的倍數，例如 48 x 48 像素、96 x 96 像素、144 x 144 像素等等
參考資料：
Favicon 小圖示應該要怎樣設計？
網頁的 Logo 小圖示除了有檔案格式跟大小的限制外，並沒有其他規定所以可以有很多種呈現方式。
如同Google 的小圖示是圓形的，Wei 自己的也是；Notion的小圖示就是透明去背的看起來是立體的；也有很多網站就是一班的正方形。
Wei 這邊提供幾個方向給大家參考，讓妳思考自己網站的 Favicon 可以更有辨識度喔！
從首頁大圖、Logo延伸發想
從網站原本就有的主視覺或是 Logo 去發想、簡化成 Favicon 小圖示，再訪客尋找你的網站時可以對網站整體更加印象深刻、也讓你的網站更有整體性
從網站名稱去發想
像 Wei 自己的 Favicon 小圖示就是從我的網站名稱「PLUSwei-小菜雞的學習筆記」中的英文字P跟W去做設計。當這兩個字一直出現在訪客眼中時，我的網站名稱也是無形之中被記住了呢！
避免顏色、細節過多
剛剛有介紹 Favicon 平常出現在訪客眼中的的尺寸就是這麼小，如果包含了太多細節跟顏色，看起來就都是糊在一起。所以 Favicon 小圖示的原則就是顏色、細節都以簡單為主。
各大網站 Favicon 小圖示分享
這邊 Wei 列舉了很多知名網站的 Favicon 小圖示，可以看到雖然很小但是卻起到非常關鍵的作用。
Favicon讓你就算不知道網頁名稱是什麼，看小圖示也知道是哪一個網站，所以一定要多多加強跟自己網站的連結性。
比較明顯的 Favicon 有幾種：圓形的（Google、Facebook、104人力銀行）、方形的（有像LINE正方形，也有Youtube長方形的）、去背特殊造型（像Netflix就是很經典的N造型、twitter經典的藍色小鳥造型）
二、PLUSwei 自己的 Favicon 如何呢？
更換前
以「PLUSwei」為例，Wei是使用 Wordpress 系統自己架站的，所以如果沒有調整，預設就會是 Wordpress Logo，顯得很沒有鑑別度網站也沒有很用心的經營的感覺。
更換後
Wei 將網站的 Favicon 換掉後變成這樣～
是不是一眼就可以看得出來呢？這樣當同時有好多個分頁而你的網站名稱被省略時，訪客就可以直接由你的 Logo 知道哪一個才是你的網頁喔！
而且網站瞬間就變得高級、專業了起來了有沒有！ 超級簡單的一個動作，讓你網站的質感有大大的提升！
所以推薦大家真的想要用心經營的話一定要有專屬的 Favicon 小圖示啊～
三、教你怎麼三分鐘完成Favicon
這邊Wei 跟大家推薦新手一個超級方便的網站，可以讓你免費、快速的製作自己獨一無二的網站小logo喔！
網站名稱：Favicon Generator
即時反映出設計中 icon
這個網站對於跟Wei一樣新創站的網站主非常非常友善跟便利，第一當然是免費使用、第二是網站操作非常直觀簡單、再來是他有多種顏色、字體跟形狀，對於Favicon這種體積很小的圖案來說，我覺得已經非常足夠了。
步驟一：設計
進到網站後直接就是製作的主要頁面，這邊幫大家把英文介面翻譯成中文參考，但是這個網站本身製作方式就很直觀，大家嘗試操作看看也可以看得出來這些選項代表哪些意思喔。
這個網站有個超級貼心的設計，就是會將我們正在設計中的icon即時顯示在分頁Favicon的的位置是不是很棒！
這樣我們就可以即時看到成果，包含夠不夠顯眼、會不會太複雜、有沒有跟網站風格搭配等等⋯⋯
步驟二：下載
設計完後就按下網頁右上角的 Download 就可以得到一個壓縮檔
解開壓縮就可以得到好幾個尺寸的png檔、ico檔也有，最後就是放到指定位置啦～
步驟三：以Soledad主題為例
在後台進入「外觀＞自訂」
找到「General > General Settings」
就可以看到「Upload Favicon」囉！
上傳完後應該就可以看到網站的小圖示從原本預設的 Wordpress logo 變成自己設計的圖了吧～
自己設計的就算超級簡單但是跟預設的感覺起來就是不一樣嘿嘿
跟我一起嘗試吧！
看完Wei 更新網站小 logo(Favicon)後有沒有很心動啊？