Photoshop製作Favicon.ico表徵圖

  @lunlun童鞋今天下午在Twitter上和我說二肯工作室怎麼沒有網站的Logo？囧rz...其實不是我不想有，只是小為我能力有限做不出好看的LOGO啊。所以勉強只用Photoshop做了個Favicon表徵圖放到網站上了。

 

        小為的PS技術就不行了。做的醜了點，具體的效果你可以看下現在瀏覽器上面的效果。

Favicon.ico是網站的表徵圖，具體的效果可以查看二肯工作室地址欄旁邊的表徵圖。一下方法能幫你學習會如何製作ICO表徵圖，不僅僅只是製作Favicon.ico表徵圖，你也可以做各種規格大小的ICO表徵圖。

        這個Favicon.ico的製作方法有兩種：1、直接使用Photoshop製作；2、製作成PNG再轉換成ICO。

直接使用Photoshop製作ICO表徵圖：

        Photoshop是不能直接製作ICO表徵圖的，但是通過增加一個外掛程式就可以讓Photoshop能匯出一個以.ico為尾碼的檔案，即可以製作ICO表徵圖。

        外掛程式：Icon plugin for photoshop ( plugin @via )
        這個外掛程式是來自國外一位朋友製作，可以讓Photoshop能匯出ICO格式的檔案，而且能讓Photoshop編輯ICO表徵圖。

外掛程式：ICON PLUGIN FOR PHOTOSHOP

外掛程式使用方法：
解壓下載後的Zip檔案，裡面有Png.8bi和ICO.8bi這兩個檔案，複製到Photoshop的安裝目錄下面的Plug-ins/File Formats檔案夾下。File Formats可以是“檔案格式”。中間遇到提示替換檔案，請替換掉。

然後，你就可以用Photoshop製作你的ICO表徵圖咯。

製作成PNG再轉換成ICO：

        經常看到別的地方有已經做好了的PNG的表徵圖，重新自己按照上面的方法用Photoshop製作也太麻煩了。那就可以把已經做好的PNG表徵圖直接轉換成ICO表徵圖。這個就更方便咯。

        這個是一個線上的工具，http://tools.dynamicdrive.com/favicon/可以線上將PNG圖片轉換成Favicon.ICO表徵圖，專門製作網站的ICO表徵圖的，當然他也能製作案頭的ICO表徵圖等等。產生的表徵圖是透明的ICO表徵圖，詳細的可以看轉換的參數：

 

        其實製作ICO表徵圖的方法很多，這兩個小為覺得比較方便，推薦出來了。做站長或者博主的童鞋們，這篇文章估計對你們有用吧？
        Tips:製作好的ICO表徵圖，命名為favicon.ico然後傳到網站根目錄下就可以直接使用這個ICO表徵圖了，不需要修改任何設定。（有些瀏覽器顯示表徵圖需要一段時間才行）