快速製作網站 favicon.ico 圖示

一般情況下大部分網站都會有個「favicon.ico」圖示,這個圖示會顯示在瀏覽器網址列的最左邊,或者當我們將某個網站加入到我的最愛書籤,或放到書籤工具列上面時,網站名稱左邊的那個方方的小圖就是「favicon.ico」所展示的圖示。

01

一般來說,我們只要將「favicon.ico」圖示放到網站根目錄,然後在網頁原始碼的<head>之間加入如下敘述:

<link rel=”shortcut icon” type=”image/x-icon” href=”/favicon.ico”>

就可以讓一般網頁瀏覽器正常顯示網站的網頁圖示,,

另外還有很多不同方式可以展示不同格式的網頁圖示,如果你還是習慣使用傳統的「favicon.ico」圖示的話,可以試試看本文所介紹的超簡單轉檔工具,只要把你的圖檔上傳到網站去,馬上幫你轉成網站用的favicon.ico圖示。

儘管這種方法沒法對圖示做任何修改或調整,不過對於不想花太多腦筋的人來說,的確是個很方便的小工具。

  • 網站名稱:FavIcon Generator
  • 網站網址:http://tools.dynamicdrive.com/favicon/
  • 延伸閱讀: Favicon.ico Generator 網站小圖示製造機(支援動態圖示)
  • 延伸閱讀: SimplyIcon 快速把照片、圖檔轉成ICON圖示(支援多檔批次處理)
  •  

    使用方法:

    第1步  開啟FavIcon Generator網站,按「瀏覽...」按鈕選取你要轉成「favicon.ico」圖示的圖檔,再按一下「Create Icon」按鈕,即可開始轉檔。

    02  

     

    第2步  轉檔完成後,可以在網頁下方看到「favicon.ico」圖示的預覽畫面,確定這是你要的圖後,再按一下「Download FavIcon」按鈕將檔案下載回來就可以囉。

    03

    延伸閱讀:

    1. Iconfinder 搜尋、下載10萬個超精美ICON、圖示
    2. Icones.Pro 搜尋下載數萬個ICON、電腦圖示
    3. 如何將一般圖片、照片變成ICON圖檔?
    4. Junior Icon Editor 繪製自己的ICON圖示
    5. IconViewer 輕鬆挖出隱藏在檔案中的ICON圖示

    最後更新:07-28, 2013 下午 3:38

    kjbrian

    Author: 不來恩

    briiancom@gmail.com

    相關資訊

    訪客留言:

    16 Replies to “快速製作網站 favicon.ico 圖示”

    1. 請問轉址後, 原本在blogger設定的favicon不見了?~~~
      請問要再怎麼設定回來呢?
      我是用namesecure的服務

    2. 請問不來恩大大

      我將

      貼在之後

      可是只能載firefox顯示出來

      而IE的圖示沒改變

      請問要如何在IE也能顯示出來呢?

    3. Google Chrome是我比較之後選擇使用的瀏覽器
      喜歡它版面少了工具列,顯示網頁內容大大的,很乾淨舒服也很快速!
      不過FireFox確實也有無人可以替代的方便啦 XD
      (光是解右鍵就讓我開心了好久!!!! :”)

    4. To:玉米

      其實Firefox也是很好用的
      速度上確實Google Chrome幾乎可以說是最快
      但是其實火狐還是有它難以替代的優點在喔

      1. 因為 Chrome 6 用「地球」代替 icon,想秀也秀不出來。
        Firefox 有其優點,我都用它找網路圖片來替換桌面,不像 Chrome 還要下載另存。

    發佈留言

    發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *