“Tips
menampilkan favicon”
|
D
|
alam
pelajaran HTML kali ini kita akan mempelajari tentang bagaimana cara
menampilkan Favicon di browser.
Favicon (Favourite Icon) adalah sebuah icon image yang berukuran
kecil yang ditampilkan di address bar dan tab browser.
Dengan
adanya favicon ini memang kelihatan menarik, bahkan kita bisa hafal suatu situs
web dengan hanya melihat favicon-nya, jika kita memiliki banyak bookmark di
browser kita, maka kita akan melihat beraneka ragam favicon disana.
Lantas
bagaimana cara menampilkan favicon tersebut?
Pertama,
anda harus memiliki gambar yang ber-ekstensi .ico, yang standar ukurannya
sekitar 16X16px, program grafik seperti Photoshop atau Corel Draw bisa membuat
jenis file ini, namun jika anda ingin yang siap saji anda bisa mendownload dari
freefavicon,
ratusan favicon menarik dapat anda temukan disana.
Jika anda
sudah menemukan icon yang anda sukai, download dan simpan icon tersebut ke
komputer anda dengan nama “favicon.ico”
Selanjutnya
agar dokumen html dapat menampilkan icon ini, kita harus menambahkan kode berikut
ini di antara tag elemen <head> dan </head>:
<link rel="shortcut
icon" type="image/ico" href="favicon.ico">
Setelah
dimasukkan kedalam dokumen html maka akan terlihat seperti dibawah ini:
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Titel
Websiteku</title>
<link rel="shortcut
icon" type="image/ico" href="favicon.ico">
</head>
<body>
<p>Harap tenang... saya sedang
belajar tentang favicon</p>
</body>
</html>
Buka
Notepad kemudian salin kode diatas dan simpan ke komputer dengan nama
“testicon.html” jangan lupa agar menyimpannya di folder yang sama dengan
favicon.ico tadi.
0 komentar:
Posting Komentar