最近開始研究客製化自己用hexo架設在github上的blog,要打造具備個人魅力的網站,第一步我想從favicon開始著手!不過我的美術天份實在不算好,目前也沒有熟識的設計師之類的可以幫我的忙,所以最重要的"圖檔"的話...就只好先自行創作一番囉...但是其他細節也得要好好研究才可以,以下就是我紀錄一下目前查到的關於favicon的資料。
favicon簡介
有時被稱為網頁小圖標或網站縮圖,是識別網站的一個重要元素,好的favicon不僅可以提昇網站質感,也可以藉此增加網站使用者的好感。
favicon.ico
雖然瀏覽器開始支援使用.png的favicon,但一般用法還是會使用.ico的專屬格式,.ico格式有以下特點:
- 一張圖片包含多個版本和格式。
- 基本建議包含16x16、32x32、48x48等版本。
favicon.png的崛起
隨著html5的盛行,再加上螢幕的解析度越來越高,同時間還有行動裝置的瞬間籠罩,在現代網路環境的改變之下,.ico的使用逐漸受到限制,多種格式的.png圖標逐漸作為favicon的更好選擇。
輔助工具
網頁favicon、APP、windows metro...等,現在零零總總不同裝置設備各自需要不同尺寸的圖檔才能有最佳的效果呈現,我們如果要一個個去客製化的話,肯定會耗費大量的間...
所以這個時候就需要使用工具來幫助我們產生各種不同size的圖檔,或許不夠精緻,但我想對比於自己一個一個親手做,使用工具的效益會大一點吧。
工具推薦:RealFaviconGenerator