Memasang dan Membuat Favicon Buat Blog

Untuk mempercantik dan memperlihat ke profesional-an blog kita bisa di tempuh dengan banyak cara. Dari memilih theme yang baik, memperhatikan kaidah bahasa penulisan, memberikan gambar-gambar yang relevan, memperhatikan colour harmony di setiap element blog, relevansi setiap artikel, kebenaran artikel dan masih banyak lagi. Dan ada satu lagi yang biasanya luput dari pandangan, yaitu pemberian favicon yang akan menjadi ciri kas blog kita.

Favicon adalah icon yang biasanya muncul setiap kali blog kita di tampilkan. Browser akan menampilkan dengan lokasi yang beda-beda. Seperti Google Chrome, menampilkan favicon di sebelah kiri judul artikel. Tapi kalau di Firefox muncul di sebelah alamat website.

Favicon

Favicon keliatannya sepele tapi akan menjadi keliatan lebih profesional jika blog kita di pasangi icon tersebut. Juga akan menjadi identitas pribadi blog kita yang akan membedakan bookmark (jika pengguna membookmark blog kita) blog kita dengan bookmark-bookmark yang lain.

Nah untuk membuat dan memasang favicon, berikut langkah-langkahnya:

  1. Favicon adalah berformat .ico, maka dari itu anda harus membuatnya dengan bantuan aplikasi Icon Maker seperti SIB Icon Editor, anda bisa mengunduhnya versi gratis dari aplikasi itu di sini.
  2. Setelah pengunduhan udah selesai, instal aplikasi tersebut dan kemudian buka aplikasi-nya sehingga anda akan mendapatkan tampilan seperti gambar di bawah ini.
    tampilan aplikasi icon maker 
  3. Buat icon dengan ukuran 16 x 16 atau 32 x 32 px. Jika anda kesusahan menggambar di icon editor ini, anda bisa membuatnya di CorelDraw atau Photoshop lalu Import di SIB Icon Editor.
  4. Lalu simpan icon itu dan beri nama favicon.ico.
  5. Transfer file favicon.ico ke root folder di mana file-file .php atau .htm anda di publish. Biasanya di public_html atau www.
    public_html folder 
  6. Nah sekarang coba refresh browser anda untuk memuat kembali blog anda.

Semoga sedikit bermanfaat.

Artikel-artikel Yang Berhubungan Dengan Artikel Ini

12 Komentar

Willy - KL  on April 12th, 2009

Kalo favicon yang bisa beranimasi gimana?
GIF ?
Mang GIF bisa dipakai ya?
Kl saya si, ga pernah utak atik bagian sono..
Soalnya bukan owner si..
hehee..

artikel terakhir Willy – KL | Shortcut key untuk mematikan monitor

addidnugroho  on April 26th, 2009

Lah kalo kita ga punya web server sendiri gimana? Gimana cara upload faveicon-nya?

artikel terakhir addidnugroho | About

Bart. Edi  on April 26th, 2009

@addidnugroho: setahu saya sih ngga bisa..

henky  on April 27th, 2009

wah tulisan anda sangat bagus sekali mendidik dan memberikan wawasan buat pemula .. sukses selalu buat anda

yudhit  on April 28th, 2009

keren neh mas.. dah lama saya nyari cara ngedit favicon.. thksnya segera diterapkan.

Bart. Edi  on April 28th, 2009

@yudhit: Sama-sama hehehe….

gunar  on April 29th, 2009

mas, kok saya ga berhasil ya?
blog saya berbasis wordpress 2.7
saya upload pake filezilla ke rootnya piblic_html?
ukuran 32×32?kira2 salah apa ya mas?
trus kalo icon nya ber animasi bisa ga ya mas?
thank’s

Bart. Edi  on April 29th, 2009

@gunar: Coba pak, kasi baris ini: di antara tag .

gunar  on May 1st, 2009

terima kasih mas Edi, ternyata cuma butuh matiin browser (atau matikan inetnya) saya. kmrn saya cuma refresh ternyata tidak bisa. mas, minta ijin re post ya… + mau saya tambah cara buat favicon animasi. sudah saya coba di http://www.hobijalan.co.cc
terima kasih banyak mas edi.

artikel terakhir gunar | IM2, Sinyal Penuh Koneksi Putus

Bart. Edi  on May 1st, 2009

@gunar: ya mas gunar, untuk animated favicon bisa di baca disini: http://www.animatedfavicon.com/, terus terang saya mau coba pakai yang animated, jadinya lambat, karena file gif nya agak besar sekitar 20kb an.

Kuliah Gratis  on July 29th, 2009

Wah kayaknya gak harus pake .ico n gak harus pake Web Server coz tinggal di edit di script templatenya ja pake link image biasa gak usah .ico
Kuliah Gratis´s last blog ..Mengembalikan Jati Diri Bangsa My ComLuv Profile

sms gateway  on October 24th, 2009

Udah lama saya pengin bikin favicon, gak jadi-jadi. Thank U trik-nya, segera dicoba.
sms gateway´s last blog ..Cara Mudah Menampilkan Status Yahoo! Messenger My ComLuv Profile

Berikan opini anda tentang artikel ini

CommentLuv Enabled