網頁圖示的製作方式

之前在馬老師舊的部落格就有教導過網站圖示的製作方式,不過因為部落格搬新家,也再把這個教學重新講解與製作一遍,如下圖所示,許許多多的網頁都有製作網頁圖示。

網站圖示的製作方式 示意圖1

這樣的圖示我們可以利用任何的美工軟體來設計,而我是在Fireworks中製作(個人覺得比較方便),首先開一個正方形的透明圖檔(寬、高相同),大小可以自訂,底色設為透明。

網站圖示的製作方式 示意圖2

底色透明的部分是希望可以製作一個去背的網站圖示,像上面範例奇摩的圖示就有去背,維基百科則沒有,接下來就看你怎麼樣設計這個圖示囉~

網站圖示的製作方式 示意圖3

製作完成後儲存成png的格式,進入這個網站將我們的PNG圖檔轉換成ICO圖檔,進入後按下選擇檔案,找到我們剛剛所儲存的PNG圖檔,接下來就按下轉換的按鈕。

網站圖示的製作方式 示意圖4

待轉換完成後在Click here to Download的文字上面按右鍵選擇另存目標。

網站圖示的製作方式 示意圖5

接下來在想出現此圖示的網頁上,輸入以下的HTML程式碼。

<link href="favicon.ico" rel="shortcut icon" />

網頁圖示的製作方式 示意圖6

其中href代表這個圖檔的名稱和路徑,如果是整個網站的所有頁面都要有本圖示的話,那每一頁都必須要有這段語法喔!接下來預覽網頁就可以看到你所設計的網頁圖示了。

註:在網頁還沒上傳的情形之下I.E.會看不到這個圖示,大家可以用Chrome或Firefox來預覽

You may also like...

30,021 Responses

  1. RobertBioft表示:

    Maispin——2025年最新USDT娛樂城,安全、快速、刺激!
    歡迎來到 Maispin,2025年最具潛力的新秀 USDT娛樂城!在這裡,您只需提供 錢包地址 即可註冊,無需繁瑣的個人資訊,享受 安全、匿名、快速 的遊戲體驗。Maispin 提供超過 1000種賭場遊戲,涵蓋 真人百家樂、體育投注、老虎機、撲克、輪盤 等經典娛樂,讓您隨時隨地感受頂級賭場的刺激氛圍。我們與世界知名遊戲供應商合作,確保遊戲 公平公正,並提供高額彩金、獎勵活動,讓玩家輕鬆贏大獎!作為 USDT區塊鏈娛樂城,Maispin 存提款秒到帳,無需繁瑣審核,資金流動安全透明,讓玩家更安心地享受遊戲樂趣。立即加入 M宇宙,體驗前所未有的加密娛樂新潮流!

  2. Louislen表示:

    https://apotheekmax.com/# Online apotheek Nederland zonder recept

  3. Derekgroum表示:

    Apotek hemleverans recept: Apotek hemleverans recept – Apoteket online

  4. Derekgroum表示:

    Apotheek Max: Beste online drogist – Apotheek online bestellen

  5. Louislen表示:

    http://apotheekmax.com/# Online apotheek Nederland met recept

  6. click here表示:

    It’s a pity you don’t have a donate button! I’d
    without a doubt donate to this brilliant blog!
    I guess for now i’ll settle for book-marking and adding your RSS feed to my Google account.
    I look forward to fresh updates and will talk about
    this website with my Facebook group. Chat soon!

  7. HomerFaw表示:

    http://kamagrapotenzmittel.com/# Kamagra Oral Jelly

  8. If some one desires expert view regarding blogging after that i
    suggest him/her to visit this webpage, Keep up the
    pleasant work.

  9. Michaeltor表示:

    Online apotheek Nederland met recept: Online apotheek Nederland zonder recept – Beste online drogist

  10. Bill表示:

    Hey there, I think your website might be having browser compatibility issues.
    When I look at your blog in Chrome, it looks
    fine but when opening in Internet Explorer, it has some
    overlapping. I just wanted to give you a quick heads up!
    Other then that, terrific blog!

  11. Malcolmseern表示:

    Kamagra Oral Jelly kaufen Kamagra kaufen Kamagra kaufen

  12. Louislen表示:

    http://apotheekmax.com/# Betrouwbare online apotheek zonder recept

  13. HomerFaw表示:

    https://apotheekmax.shop/# online apotheek

  14. Derekgroum表示:

    Kamagra online bestellen: Kamagra Oral Jelly – Kamagra kaufen

  15. sexcamstv表示:

    Nice post. I learn something new and challenging on blogs I stumbleupon on a daily
    basis. It will always be useful to read articles from other writers and use a little something from other websites.

  16. HomerFaw表示:

    http://apotheekmax.com/# Online apotheek Nederland met recept

  17. Louislen表示:

    https://apotheekmax.com/# de online drogist kortingscode

  18. Derekgroum表示:

    de online drogist kortingscode: Apotheek Max – Online apotheek Nederland zonder recept

  19. Derekgroum表示:

    Kamagra kaufen ohne Rezept: Kamagra online bestellen – Kamagra Oral Jelly kaufen

  20. Traci表示:

    With havin so much content and articles do you ever run into any issues of plagorism or copyright infringement?
    My blog has a lot of completely unique content I’ve either written myself or outsourced but it seems
    a lot of it is popping it up all over the web without my permission. Do you
    know any solutions to help stop content from being stolen? I’d definitely appreciate it.

  21. Malcolmseern表示:

    Kamagra Oral Jelly kaufen Kamagra kaufen Kamagra Oral Jelly kaufen

  22. 1win_zjEn表示:

    1вин бет официальный сайт http://www.1win6050.ru .

  23. Atlas123 Slot Gacor Mudah Menang Modal Receh

  24. Great post however I was wanting to know if you could write a litte more
    on this topic? I’d be very thankful if you could elaborate a little bit
    more. Thanks!

  25. SLOT456表示:

    เจอกับ เส้นทางสู่ความรวย ลุ้นทำกำไรทุกเวลาด้วย สล็อตออนไลน์เว็บตรง อันดับ 1 แห่งวงการเกมสล็อตออนไลน์ ระบบล้ำยุค สล็อตตรงไม่ผ่านเอเย่นต์ ความปลอดภัยระดับสูง เว็บสล็อต และ โบนัสแตกง่ายไม่มีวันหยุด เว็บสล็อตตรง ไม่มีเอเย่นต์ เริ่มต้นเพียง 1 บาท ผ่านการรับรองระดับสากล เล่นได้ทุกอุปกรณ์ รองรับมือถือทุกระบบ ทำเงินได้จริงไม่มีสะดุด

發佈回覆給「Derekgroum」的留言 取消回覆

發佈留言必須填寫的電子郵件地址不會公開。