網頁圖示的製作方式

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

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

  1. Trefrep表示:

    Приобрести диплом о высшем образовании. Заказ диплома через качественную и надежную фирму дарит ряд достоинств для покупателя. Данное решение дает возможность сберечь время и существенные финансовые средства. accountshunt.com/employer/eonline-diploma

  2. DennisDor表示:

    mexican pharmacy: Us Mex Pharm – UsMex Pharm

  3. DennisDor表示:

    UsMex Pharm: Mexican pharmacy ship to USA – certified Mexican pharmacy

  4. Sazratc表示:

    Приобрести диплом возможно используя сайт компании. uscgq.com/forum/posts.phpforum=general&id=388085

  5. mostbet_ueSn表示:

    скачат мостбет mostbet6034.ru .

  6. SteveViand表示:

    https://usmexpharm.shop/# USMexPharm

  7. RandyKargo表示:

    usa mexico pharmacy mexican pharmacy USMexPharm

  8. Uazrdra表示:

    Приветствую!
    Для некоторых людей, приобрести диплом университета – это острая необходимость, удачный шанс получить хорошую работу. Впрочем для кого-то – это желание не терять время на учебу в ВУЗе. Что бы ни толкнуло вас на такое решение, наша компания готова помочь. Максимально быстро, профессионально и недорого изготовим документ любого ВУЗа и любого года выпуска на подлинных бланках со всеми требуемыми подписями и печатями.
    Основная причина, почему люди прибегают к покупке документов, – получить хорошую работу. К примеру, знания дают возможность человеку устроиться на работу, однако документального подтверждения квалификации не имеется. При условии, что работодателю важно присутствие “корочек”, риск потерять вакантное место очень высокий.
    Заказать документ о получении высшего образования вы сможете у нас в столице. Мы предлагаем документы об окончании любых университетов России. Вы сможете получить диплом по любой специальности, любого года выпуска, в том числе документы образца СССР. Даем 100% гарантию, что при проверке документа работодателем, никаких подозрений не возникнет.
    Ситуаций, которые вынуждают заказать диплом ВУЗа очень много. Кому-то прямо сейчас нужна работа, а значит, нужно произвести впечатление на руководителя в процессе собеседования. Другие мечтают попасть в престижную компанию, чтобы повысить собственный статус в обществе и в последующем начать свое дело. Чтобы не терять попусту годы жизни, а сразу начинать удачную карьеру, применяя врожденные таланты и приобретенные знания, можно приобрести диплом в онлайне. Вы станете полезным для социума, обретете финансовую стабильность в кратчайший срок- диплом купить о среднем образовании

  9. SteveViand表示:

    https://usmexpharm.shop/# UsMex Pharm

  10. Cletusiders表示:

    usa mexico pharmacy: certified Mexican pharmacy – USMexPharm

  11. Untuk melihat file-file ini, Anda perlu menginstal
    plugin khusus dari katalog aplikasi Windows, atau menggunakan konverter JPEG online
    kami.

  12. I am regular visitor, how are you everybody? This post posted
    at this web page is genuinely fastidious.

  13. Cletusiders表示:

    certified Mexican pharmacy: usa mexico pharmacy – UsMex Pharm

  14. SteveViand表示:

    http://usmexpharm.com/# Mexican pharmacy ship to USA

  15. Sudahkah Anda mengaktifkan mode penghemat data Instagram untuk mengurangi penggunaan data seluler?

  16. MicahTails表示:

    USMexPharm: certified Mexican pharmacy – USMexPharm

  17. DennisDor表示:

    usa mexico pharmacy: USMexPharm – certified Mexican pharmacy

  18. MicahTails表示:

    Us Mex Pharm: mexican drugstore online – UsMex Pharm

  19. MicahTails表示:

    Mexican pharmacy ship to USA: Us Mex Pharm – Mexican pharmacy ship to USA

  20. RandyKargo表示:

    reputable mexican pharmacies online mexican drugstore online mexico drug stores pharmacies

  21. как узаконить перепланировку как узаконить перепланировку .

  22. оценка часов в ломбарде москва оценка часов в ломбарде москва .

  23. RandyKargo表示:

    Mexican pharmacy ship to USA mexican pharmacy Mexican pharmacy ship to USA

  24. Wolfyue表示:

    Психологическая и информационная онлайн-помощь. Получить КОНСУЛЬТАЦИЮ и ПОДДЕРЖКУ профессиональных психологов. Телеграм психолог. оценили 2980 раз

  25. Hi, I do believe this is a great site. I stumbledupon it 😉 I will
    return yet again since i have book marked
    it. Money and freedom iis the best way to change, may you be rich and continue to guide other people.

  26. DennisDor表示:

    USMexPharm: medicine in mexico pharmacies – certified Mexican pharmacy

發佈留言

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