網頁圖示的製作方式

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

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

17,540 Responses

  1. Профессиональный сервисный центр по ремонту моноблоков в Москве.
    Мы предлагаем: ремонт моноблока
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  2. Timothystoft表示:

    buying prescription drugs in mexico: mexican drugstore online – mexican online pharmacies prescription drugs

  3. Профессиональный сервисный центр по ремонту гироскутеров в Москве.
    Мы предлагаем: гироскутер сервисный центр москва
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  4. Профессиональный сервисный центр по ремонту планшетов в том числе Apple iPad.
    Мы предлагаем: сервис ремонт айпад
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  5. Профессиональный сервисный центр по ремонту планшетов в том числе Apple iPad.
    Мы предлагаем: сервисный центр айпад в москве
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  6. sky88表示:

    {Tôi hạnh phúc hơn cả vui khám phá trang web này. Tôi muốn cảm ơn bạn {vì đã|dành thời gian cho|chỉ vì điều này|vì điều này|cho bài đọc tuyệt vời này!! Tôi chắc chắn thưởng thức từng một chút nó và tôi cũng đã lưu làm mục ưa thích để xem điều mới trên trang web của bạn.|Tôi có thể chỉ nói rằng thật nhẹ nhõm để tìm thấy một người thực sự biết họ là gì đang nói về trên web. Bạn thực sự hiểu cách đưa một rắc rối ra ánh sáng và làm cho nó trở nên quan trọng. Nhiều người hơn nên đọc điều này và hiểu khía cạnh này câu chuyện của bạn. Tôi không thể tin bạn không nổi tiếng hơn vì bạn chắc chắn có món quà.|Rất tốt bài viết trên blog. Tôi hoàn toàn yêu thích trang web này. Tiếp tục với nó!|Thật khó đến những người có học thức về điều này, tuy nhiên, bạn có vẻ bạn biết mình đang nói gì! Cảm ơn|Bạn nên tham gia một cuộc thi dành cho một trang web trực tuyến tuyệt vời nhất. Tôi sẽ khuyến nghị blog này!|Một động lực chắc chắn đáng giá bình luận. Tôi tin rằng bạn cần xuất bản thêm về chủ đề này, nó có thể không là một điều cấm kỵ vấn đề nhưng thường xuyên mọi người không nói về chủ đề như vậy. Đến phần tiếp theo! Cảm ơn rất nhiều.|Chào buổi sáng! Tôi chỉ muốn cho bạn một rất to cho thông tin tuyệt vời bạn có ngay tại đây trên bài đăng này. Tôi đang trở lại trang web của bạn để biết thêm thông tin sớm nhất.|Sau khi tôi ban đầu để lại bình luận tôi có vẻ như đã nhấp vào hộp kiểm -Thông báo cho tôi khi có bình luận mới- và bây giờ mỗi lần được thêm vào tôi nhận được bốn email có cùng nội dung. Phải có một cách bạn có thể xóa tôi khỏi dịch vụ đó không? Cảm ơn rất nhiều.|Lần sau Tôi đọc một blog, Hy vọng rằng nó không làm tôi thất vọng nhiều như bài này. Rốt cuộc, Tôi biết điều đó là sự lựa chọn của tôi để đọc, tuy nhiên tôi thực sự tin bạn sẽ có điều gì đó thú vị để nói. Tất cả những gì tôi nghe được là một loạt rên rỉ về điều gì đó mà bạn có thể sửa nếu bạn không quá bận tìm kiếm sự chú ý.|Đúng với bài viết này, tôi thực sự nghĩ trang web tuyệt vời này cần nhiều hơn nữa sự chú ý.

  7. Профессиональный сервисный центр по ремонту моноблоков в Москве.
    Мы предлагаем: замена экрана моноблока цена
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  8. Профессиональный сервисный центр по ремонту гироскутеров в Москве.
    Мы предлагаем: сколько стоит замена аккумулятора в гироскутере
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  9. Профессиональный сервисный центр по ремонту кондиционеров в Москве.
    Мы предлагаем: ремонт кондиционеров в москве недорого
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  10. Steveninela表示:


    Новые методы лечения болезни Паркинсона в клинике Neuro Implant Clinic.
    Акупунктура уха – новый метод лечения болезни Паркинсона, Альцгеймера, Рассеянного Склероза.
    Выездное лечение в разные Страны.
    Отзывы нашего метода на официальном сайте Neuro Implant Clinic.

  11. RobertWAisa表示:

    best india pharmacy indian pharmacy top 10 online pharmacy in india

  12. Jamesruigo表示:

    https://mexicanpharma.icu/# medicine in mexico pharmacies

  13. Профессиональный сервисный центр по ремонту кондиционеров в Москве.
    Мы предлагаем: ремонт кондиционеров в квартире в москве
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  14. Hi, I do think this is an excellent blog. I stumbledupon it
    😉 I will return yet again since I book marked it.
    Money and freedom is the best way to change, may you
    be rich and continue to help others.

    my website :: Posizionamento siti web per aziende

  15. dafabet表示:

    {Tôi hạnh phúc hơn cả vui khám phá trang web tuyệt vời này. Tôi cần cảm ơn bạn {vì đã|dành thời gian cho|chỉ vì điều này|vì điều này|cho bài đọc tuyệt vời này!! Tôi chắc chắn yêu thích từng của nó và tôi cũng đã lưu làm mục ưa thích để xem điều mới trong trang web của bạn.|Tôi có thể chỉ nói rằng thật nhẹ nhõm để khám phá một người thực sự hiểu họ là gì đang nói về trên web. Bạn chắc chắn biết cách đưa một rắc rối ra ánh sáng và làm cho nó trở nên quan trọng. Nhiều người hơn nữa phải đọc điều này và hiểu khía cạnh này câu chuyện của bạn. Tôi không thể tin bạn không nổi tiếng hơn vì bạn chắc chắn sở hữu món quà.|Rất hay bài viết trên blog. Tôi chắc chắn yêu thích trang web này. Tiếp tục làm tốt!|Thật khó tìm những người có học thức về điều này, tuy nhiên, bạn có vẻ bạn biết mình đang nói gì! Cảm ơn|Bạn nên là một phần của một cuộc thi dành cho một blog trên mạng hữu ích nhất. Tôi chắc chắn sẽ Rất khuyến nghị blog này!|Một động lực chắc chắn đáng giá bình luận. Tôi tin rằng bạn nên xuất bản thêm về chủ đề này, nó có thể không là một điều cấm kỵ chủ đề nhưng thường xuyên mọi người không nói về chủ đề như vậy. Đến phần tiếp theo! Chúc mọi điều tốt đẹp nhất.|Chào buổi sáng! Tôi chỉ muốn đề nghị rất cho thông tin tuyệt vời bạn có ngay tại đây trên bài đăng này. Tôi đang trở lại trang web của bạn để biết thêm thông tin sớm nhất.|Sau khi tôi ban đầu bình luận tôi có vẻ như đã nhấp vào hộp kiểm -Thông báo cho tôi khi có bình luận mới- và bây giờ bất cứ khi nào có bình luận được thêm vào tôi nhận được bốn email cùng chính xác một bình luận. Có lẽ có một phương tiện bạn có thể xóa tôi khỏi dịch vụ đó không? Cảm kích.|Lần sau Tôi đọc một blog, Hy vọng rằng nó không thất bại nhiều như bài này. Rốt cuộc, Tôi biết điều đó là sự lựa chọn của tôi để đọc, tuy nhiên tôi thực sự tin bạn sẽ có điều gì đó thú vị để nói về. Tất cả những gì tôi nghe được là một loạt phàn nàn về điều gì đó mà bạn có thể sửa nếu bạn không quá bận tìm kiếm sự chú ý.|Đúng với bài viết này, tôi nghiêm túc tin trang web tuyệt vời này cần nhiều hơn nữa sự chú ý.

  16. RobertWAisa表示:

    buying from online mexican pharmacy medication from mexico buying prescription drugs in mexico

  17. StephanTet表示:

    где можно купить ткань https://kupit-tkan-optom.ru/

  18. RogerTut表示:

    reputable indian pharmacies: п»їlegitimate online pharmacies india – best india pharmacy

  19. Профессиональный сервисный центр по ремонту планшетов в том числе Apple iPad.
    Мы предлагаем: срочный ремонт айпада
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  20. Профессиональный сервисный центр по ремонту планшетов в том числе Apple iPad.
    Мы предлагаем: сервис ремонт айпад
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  21. plumber cost表示:

    Interesting point of view. I’m curious to think what type of impact this would have globally? Sometimes people get a little upset with global expansion. I’ll be around soon to check out your response.

  22. Your blog is amazing dude. i love to visit it everyday. very nice layout and content .”   

  23. Идеальные образы в тактичной одежде, осенние.
    Топ-10 брендов тактичной одежды, чтобы быть в тренде.
    Тактичные наряды для повседневной носки, для города и природы.
    Когда лучше всего носить тактичную одежду, для создания армейского образа.
    С чем сочетать тактичную одежду, чтобы быть в центре внимания.
    тактичний літній одяг тактичний літній одяг .

  24. RogerTut表示:

    mexico drug stores pharmacies: medication from mexico – buying prescription drugs in mexico online

  25. {Tôi háo hức khám phá trang web tuyệt vời này. Tôi muốn cảm ơn bạn {vì đã|dành thời gian cho|chỉ vì điều này|vì điều này|cho bài đọc tuyệt vời này!! Tôi chắc chắn đánh giá cao từng của nó và tôi đã lưu làm mục ưa thích để xem điều mới trên trang web của bạn.|Tôi có thể chỉ nói rằng thật thoải mái để khám phá một người thực sự hiểu họ là gì đang nói về trực tuyến. Bạn thực sự hiểu cách đưa một vấn đề ra ánh sáng và làm cho nó trở nên quan trọng. Nhiều người hơn nên đọc điều này và hiểu khía cạnh này câu chuyện của bạn. Tôi không thể tin bạn không nổi tiếng hơn vì bạn chắc chắn có món quà.|Rất tốt bài đăng. Tôi chắc chắn yêu thích trang web này. Tiếp tục với nó!|Thật gần như không thể tìm thấy những người có học thức về điều này, nhưng bạn nghe có vẻ bạn biết mình đang nói gì! Cảm ơn|Bạn cần tham gia một cuộc thi dành cho một blog trên mạng hữu ích nhất. Tôi sẽ khuyến nghị trang web này!|Một hấp dẫn đáng giá bình luận. Tôi nghĩ rằng bạn cần viết thêm về chủ đề này, nó có thể không là một điều cấm kỵ vấn đề nhưng nói chung mọi người không nói về chủ đề như vậy. Đến phần tiếp theo! Chúc mọi điều tốt đẹp nhất.|Xin chào! Tôi chỉ muốn đề nghị rất to cho thông tin xuất sắc bạn có ở đây trên bài đăng này. Tôi sẽ là trở lại trang web của bạn để biết thêm thông tin sớm nhất.|Khi tôi ban đầu bình luận tôi có vẻ như đã nhấp hộp kiểm -Thông báo cho tôi khi có bình luận mới- và bây giờ bất cứ khi nào có bình luận được thêm vào tôi nhận được bốn email cùng chính xác một bình luận. Có một cách bạn có thể xóa tôi khỏi dịch vụ đó không? Cảm ơn bạn.|Lần sau Tôi đọc một blog, Hy vọng rằng nó không thất bại nhiều như bài này. Ý tôi là, Tôi biết điều đó là sự lựa chọn của tôi để đọc hết, tuy nhiên tôi thực sự tin bạn sẽ có điều gì đó thú vị để nói về. Tất cả những gì tôi nghe được là một loạt tiếng rên rỉ về điều gì đó mà bạn có thể sửa nếu bạn không quá bận tìm kiếm sự chú ý.|Đúng với bài viết này, tôi thực sự cảm thấy trang web này cần nhiều hơn nữa sự chú ý.

  26. Профессиональный сервисный центр по ремонту моноблоков в Москве.
    Мы предлагаем: профессиональный ремонт моноблоков
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  27. Timothystoft表示:

    buying prescription drugs in mexico online: medication from mexico – mexican online pharmacies prescription drugs

  28. Профессиональный сервисный центр по ремонту гироскутеров в Москве.
    Мы предлагаем: посмотреть состояние аккумулятора
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  29. Профессиональный сервисный центр по ремонту моноблоков в Москве.
    Мы предлагаем: мастер по ремонту моноблоков
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  30. Armandoknot表示:

    Смешные анекдоты. История анекдотов.

發佈留言

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