網頁圖示的製作方式

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

網站圖示的製作方式 示意圖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...

28,371 Responses

  1. WilliamNop表示:

    cialis without a doctor prescription: TadalafilEasyBuy.com – cialis without a doctor prescription

  2. GregoryJough表示:

    kamagra 100mg kopen: Kamagra Kopen – KamagraKopen.pro

  3. Dwayneseisa表示:

    Generic 100mg Easy Generic 100mg Easy Viagra Tablet price

  4. It’s amazing to go to see this web page and reading the views of
    all mates regarding this piece of writing, while I am also
    keen of getting know-how.

  5. Dwayneseisa表示:

    Generic 100mg Easy buy generic 100mg viagra online Generic 100mg Easy

  6. Hi there! I could have sworn I’ve been to this blog before but after browsing through some of the post I realized
    it’s new to me. Anyways, I’m definitely glad I found it and I’ll be
    bookmarking and checking back often!

  7. 123B表示:

    I’m not positive the place you are getting your information, but great topic.
    I needs to spend some time learning much more or figuring out more.
    Thanks for excellent information I used to be on the lookout for this information for my mission.

  8. TerryDus表示:

    https://kamagrakopen.pro/# kamagra jelly kopen

  9. Kennethslity表示:

    https://kamagrakopen.pro/# KamagraKopen.pro

  10. Hi, Neat post. There’s an issue along with your website in web explorer,
    could test this? IE nonetheless is the market chief
    and a good component to other folks will miss your fantastic
    writing because of this problem.

  11. TerryDus表示:

    https://kamagrakopen.pro/# KamagraKopen.pro

  12. Kennethslity表示:

    https://tadalafileasybuy.com/# cialis without a doctor prescription

  13. Kennethslity表示:

    http://generic100mgeasy.com/# buy generic 100mg viagra online

  14. WilliamNop表示:

    kamagra pillen kopen: kamagra gel kopen – Kamagra Kopen Online

  15. TerryDus表示:

    https://generic100mgeasy.shop/# Generic 100mg Easy

  16. GregoryJough表示:

    cialis without a doctor prescription: cialis without a doctor prescription – TadalafilEasyBuy.com

  17. Outstanding post but 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
    further. Kudos!

  18. Hi, the whole thing is going sound here and ofcourse every one is sharing data, that’s
    really excellent, keep up writing.

  19. I every time used to study post in news papers
    but now as I am a user of net thus from now I am
    using net for articles, thanks to web.

  20. Unquestionably consider that which you stated. Your favorite justification appeared to be
    on the internet the simplest thing to consider of.
    I say to you, I definitely get irked even as folks think about issues that they plainly don’t realize about.

    You managed to hit the nail upon the top and outlined
    out the whole thing with no need side effect , other folks can take a signal.

    Will probably be back to get more. Thanks

  21. GregoryJough表示:

    TadalafilEasyBuy.com: Tadalafil Easy Buy – TadalafilEasyBuy.com

  22. GregoryJough表示:

    kamagra kopen nederland: kamagra pillen kopen – kamagra 100mg kopen

  23. Jetton Casino is the place where luck meets excitement.
    We offer the best slot machines, table games, and exclusive bonuses for all users.
    Register and claim your bonuses for a successful start.

    Why choose high payout slots? Our players not only
    get access to top-tier games but also enjoy favorable
    winning conditions. Here, you’ll find regular tournaments, cashback,
    free spins, and personalized bonus offers.

    A collection of the best gambling entertainment from world-renowned providers.

    Regular promotions and personalized offers.

    Guaranteed data protection and instant transfers.

    Competitions for the most passionate players with valuable prizes.

    Jetton Casino is your key to the world of gambling and big winnings. https://jetton-casinoempire.lol/

  24. WilliamNop表示:

    TadalafilEasyBuy.com: Generic Cialis without a doctor prescription – cialis without a doctor prescription

  25. Dwayneseisa表示:

    cialis without a doctor prescription Tadalafil Easy Buy TadalafilEasyBuy.com

  26. WilliamNop表示:

    kamagra jelly kopen: Officiele Kamagra van Nederland – Kamagra

  27. Kennethslity表示:

    https://tadalafileasybuy.com/# Generic Cialis without a doctor prescription

  28. Richardnak表示:

    быстрая продажа аккаунтов https://akkaunt-market.ru

  29. TerryDus表示:

    https://generic100mgeasy.shop/# Generic100mgEasy

  30. Kennethslity表示:

    https://generic100mgeasy.com/# Generic100mgEasy

發佈留言

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