Favicon… Logo Blog yang Unik

Saat buka http://www.google.com, perhatikan pada address bar browser. Di samping url http://www.goggle.com ada logo kecil letter ‘G’ warna biru. Atau pernah juga membuka website lain dan melihat image atau logo di samping url-nya. Logo atau image yg muncul itu disebut favicon.

Tidak hanya pada address bar, favicon muncul jg pada tab bar dan bookmark atau favorites folder. Unik ya?. Dan asyiknya, blog jg bisa menampilkan favicon. Pingin?😀.

Caranya:
1. Buat gambar/image yg diinginkan.
Ukuran 16×16 atau 32×32 pixel dan lebih baik gunakan sedikit warna, max 256 warna.

2. Simpan image tadi dengan nama file beformat gif/jpg/png atau ico.
Jika nama file favicon yg dibuat berformat gif/jpg/png nantinya tidak akan muncul pada browser IE. Sedangkan jika berformat ico, akan berfungsi untuk bbrp browser (IE, Firefox, Netscape, Opera dll).

3. Uplod file tadi ke server blog.
Jika memiliki server blog sendiri (bukan gratisan :D), upload file favicon ke root server dengan nama file ‘favicon.ico’. Dengan begini, icon akan tampil untuk semua halaman, tanpa harus menuliskan tag khusus di setiap halamannya.

Sedangkan bagi yg menggunakan blog gratisan, upload file favicon ke tempat yg menyediakan link image, seperti geocities.com. Sebaiknya, buat nama file bebas dan berformat gif/jpg/png baru diupload ke geocities.com. Setelah tersimpan disana, rename (ganti nama) file tadi dengan format *.ico. Lalu jika sudah terganti, view nama file favicon tsb dan lihat url-nya.

4. Buka dan edit file utama blog (index.html) atau file blog yg ingin diberi favicon dan tuliskan tag berikut:

<link rel=”Shortcut Icon” href=”[url_icon]” type=”image/[format_icon]” />

diantara <head> dan </head>.

Contoh:
nama file favicon : favicon.jpg
urlnya : http://geocities.com/ynalinkware/favicon.jpg
tagnya :
<link rel=”Shortcut Icon” href=”http://geocities.com/ynalinkware/favicon.jpg” type=”image/jpg” />

Tapi jika nama favicon berformat ico (favicon.ico), maka type=”image/[format_icon]” tidak perlu dituliskan.
Tagnya menjadi:

<link rel=”Shortcut Icon” href=”http://geocities.com/ynalinkware/favicon.ico” />

Pengguna Blogger (Blogspot) bisa menambahkan tag tsb pada editing template. Pengguna Blogdrive pada edit main template. Dan pengguna Blogsome pada manage lalu pilih file.

Berburu Icon Siap Pakai
Jika malas atau kesulitan membuat image/logo untuk favicon, ga usah ragu segera berburu di internet. Dengan search menggunakan keyword ‘free icon’, kita akan disajikan link2 yg menyediakan image/logo gratis yg pastinya bagus dan unik. Tinggal pilih sesuai selera.

Beberapa link yg bisa ditengok untuk mendownload icon gratis diantaranya Icon Library dan Icon Archives. Bisa juga menggunakan images untuk bullets.

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

%d blogger menyukai ini: