-->
Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Membuat dan Memasang Favicon untuk Blog

cara-membuat-dan-memasang-favicon

Masmalven.com - Sebenarnya untuk membuat Favicon cukup mudah, namun ada beberapa blogger yang belum tahu caranya. Karena ukuran icon yang kecil pasti susah untuk menentukan ukuran yang pas apalagi jika Anda belum mengerti edit di Photoshop.

Sebelum mas malven membahas tentang bagaimana cara membuat Favicon, alangkah baiknya jika kita bahas terlebih dulu apa itu Favicon dan kenapa Anda harus membuatnya?

Favorit Icon singkatan dari Favicon. Favicon adalah sebuah ikon berupa gambar yang berfungsi sebagai identitas visual website. Favicon ini akan muncul di tab dan bookmark browser.

Anda bisa perhatikan tab browser yang sedang membukan situs Masmalven. Anda lihat di di tengah dan Anda akan menemukan logo Masmalven di tab browser tersebut.

favicon mas malven

Pertanyaannya, mengapa Anda perlu menggunakan Favicon untuk blog atau website? Jawabannya, untuk memudahkan visitor mengingat blog atau website Anda. Dengan begitu, orang akan lebih mudah menemukan situs Anda.

Anda bisa gunakan tools online atau Photoshop, dengan ukuran 16x16 px atau 94x94 px dan ukuran file maximal 100kb.

Berikut ini adalah beberapa favicon generator yang bisa Anda gunakan jika Anda tidak ingin repot harus edit di photoshop:

Favicon & App Icon Generator
Real Favicon Generator
Favicon Generator
Favicon.io

Daripada kelamaan, yuk ikuti langkah-langkah dibawah ini untuk cara membuatnya:

Cara Membuat Favicon Online
Anda siapkan terlebih dahulu gambar yang akan di convert menjadi favicon.
1. Klik link Favicon Generator yang sudah saya berikan diatas.

2. Klik Choose File dan pilih Generate only 16x16 favicon.ico

3. Silahkan klik Create Favicon

cara-membuat-favicon-online-1

4. Jika sudah, Anda klik Download the generated favicon

cara-membuat-favicon-online-2

5. Selesai

Simple bukan? Untuk alternatif lain yaitu menggunakan Photoshop. Anda bisa berkreasi sesuai keinginan Anda di Photoshop atau Anda bisa lihat cara edit favicon di youtube. Yuk simak langkah-langkah dibawah ini.

Cara Membuat Favicon di Photoshop
Pastikan ukuran icon 94x94 agar gambar terlihat maksimal dan tidak blur ketika di pasang.

1. Buka Photoshop di PC atau Laptop

2. Silahkan Anda buat project baru dengan dengan tekan CTRL+N di PC atau Laptop

3. Anda perhatikan ukuran pada bagian width : 94px dan height : 94px dan klik Oke

cara-membuat-favicon-di-photoshop-1

4. Saya akan coba membuat favicon blog saya sendiri

5. Anda pilih T (Teks) dan tulis logo blog kamu misalkan M atau Malven dll. Jangan lupa untuk tambahkan warna background. Untuk menghapus bagian yang tidak diperlukan, klik Magic Eraser Tool.

cara-membuat-favicon-di-photoshop-2

6. Jika sudah, Anda simpan dengan cara tekan CTRL+S

7. Isikan nama dan pada bagian format pilih PNG. Jika sudah Anda pilih Save

cara-membuat-favicon-di-photoshop-3

Jika Anda ingin layer dijadikan satu, klik kanan dan pilih merge down.

Sampai disini, Anda sudah berhasil membuat favicon. Tapi masih bingung cara memasangnya, saya akan bahas sekalian cara dibawah ini.

Cara Memasang Favicon di Blog

1. Masuk ke Blogger.com

2. Anda klik Setelan > Dasar. Jika sudah ketemu, Anda klik tulisan Favicon seperti gambar dibawah

cara-memasang-favicon-1

3. Nanti akan muncul jendela baru, Anda Pilih File

cara-memasang-favicon-2

4. Jika sudah, pilih Simpan dan Selesai

Info:
Favicon biasanya tidak langsung muncul, tunggu beberapa menit.

Demikian penjelasan tentang Cara Membuat dan Memasang Favicon di Blog. Semoga bermanfaat dan selamat mencoba.
... ...