Favicons menggantikan ikon globe di bilah alamat.
Kredit Gambar: r0mu/iStock/Getty Images
Favicon adalah cara yang kreatif dan praktis untuk menambahkan bakat visual yang halus ke kehadiran situs web Anda. Favicons adalah gambar kecil yang digunakan browser Web pada tab halaman dan bilah alamat. Mereka menampilkan logo atau gambar yang terkait dengan situs web yang bertindak sebagai pengenal merek visual di sebelah judul atau URL. Favicons adalah pengidentifikasi situs yang sangat berguna dalam penjelajahan tab karena ruang teks yang tersedia yang digunakan untuk judul halaman berkurang menjadi hampir tidak ada saat pengguna membuka lebih banyak tab.
Langkah 1
Rancang ikon yang ingin Anda gunakan dalam program pengeditan foto atau grafis. Anda dapat mengambil logo atau gambar yang ada terkait dengan situs atau merek Anda dan menyesuaikannya agar mematuhi standar favicon. Favicons selalu menggunakan dimensi persegi dan memiliki ukuran maksimum yang didukung 256-kali-256 piksel. Pangkas dan ukuran gambar agar sesuai dengan kotak 256-kali-256-piksel jika Anda akan menggunakan pengepakan ikon untuk mendukung berbagai ukuran. Jika Anda hanya akan melakukan satu versi, gunakan ukuran 16-kali-16-piksel.
Video Hari Ini
Langkah 2
Ekspor grafik ikon sebagai file gambar PNG dari program desain grafis. PNG adalah format gambar standar W3C untuk favicon. Beberapa browser mungkin menampilkan file JPG sebagai favicon, tetapi standar ini tidak didukung secara resmi. Selain itu, program pengepakan ikon mungkin tidak berfungsi dengan gambar dalam format lain. Favicons juga mendukung file GIF dan ICO.
Langkah 3
Kemas file PNG Anda yang diekspor ke file ICO dengan program konverter ICO. Program konverter ikon memproses favicon PNG, memformatnya untuk beberapa ukuran favicon yang didukung secara luas dan menyematkannya ke dalam satu file. File ICO menyediakan favicon resolusi lebih tinggi daripada piksel 16-kali-16 untuk perangkat yang mendukungnya.
Langkah 4
Masuk ke layanan hosting situs web Anda dan unggah file PNG atau ICO ke server media situs web Anda. Salin URL file yang diunggah; Anda akan membutuhkannya untuk melampirkan favicon ke situs.
Langkah 5
Buka program pengeditan situs Anda dan tambahkan kode berikut, yang dimodifikasi dengan URL file favicon seperti yang ditunjukkan, ke bagian situs web Anda.
Untuk file PNG:
Untuk file ICO:
Kecuali Anda menggunakan situs yang dikontrol CMS atau menyertakan bagian berbasis file, Anda harus menambahkan kode ke setiap halaman yang ingin Anda tampilkan ikonnya. Favicon muncul setelah Anda menyimpan dan memperbarui halaman situs.
Tip
Program pengeditan foto seperti Photoshop dan Corel Draw bekerja dengan baik untuk mendesain dan memformat ikon. Atau, Anda dapat menggunakan program gratis seperti Paint.net dan Pixlr.
Peringatan
Beberapa browser secara otomatis mengaitkan file gambar yang terletak di direktori /favicon sebagai favicon; namun, organisasi W3C tidak mendukung praktik ini karena ini bukan standar yang didukung secara universal dan bertentangan dengan prinsip arsitektur Web. Selain itu, banyak layanan hosting Web dan sistem CMS tidak mengizinkan pengguna menempatkan konten media di luar direktori file media, sehingga praktik ini tidak mungkin dilakukan.
