LightBlog

Post Top Ad

LightBlog
LightBlog

Kamis, 14 Februari 2019

Tutorial Favicon

Ukuran Favicon

  • 16 × 16 - Masih standar untuk favicon. Harus dimasukkan dalam file favicon.ico.
  • 32 × 32 - Ukuran selanjutnya untuk favicons. Baik ikon berukuran 16 × 16 dan 32 × 32 piksel dapat dimasukkan dalam file favicon.ico. Ini adalah sesuatu yang sebenarnya tidak dilakukan generator favicon kami saat ini. Generasi pencipta ikon kami selanjutnya akan menyediakan ini.
  • 57 × 57 - Layar beranda iOS standar. Perangkat iPhone, iPod Touch, dan Android 2.1+.
  • 72 × 72 - Untuk iPad generasi pertama dan kedua.
  • 96 × 96 - ikon GoogleTV.
  • 114 × 114 - Untuk iPhone dengan tampilan retina resolusi tinggi yang menjalankan iOS 6.
  • 120 × 120 - Untuk iPhone dengan tampilan retina resolusi tinggi yang menjalankan iOS 7.
  • 128 × 128 - Ikon Toko Web Chrome.
  • 144 × 144 - Untuk iPad dengan layar retina resolusi tinggi yang menjalankan iOS 6. Juga IE10 Metro tile untuk situs yang disematkan.
  • 152 × 152 - Untuk iPad dengan tampilan retina resolusi tinggi yang menjalankan iOS 7.
  • 195 × 195 - Ikon Panggilan Cepat Opera.
Seperti yang Anda lihat, jumlah favicon yang dapat Anda buat telah bertambah. Jika Anda ingin menghemat waktu, kami sarankan Anda membuat setidaknya tiga favicons. A 16 × 16, 32 × 32 dan ikon 152 × 152 untuk digunakan dengan perangkat iOS / Android. Ikon berukuran lebih besar akan secara otomatis diturunkan oleh perangkat.
Saat ini generator kami hanya akan menghasilkan file 16 x 16 ico dari gambar Anda. Pembuat generasi kedua kami yang kami uji sekarang akan memungkinkan Anda untuk menghasilkan file ico dengan ikon pixel 16 × 16 dan 32 × 32 termasuk serta format png untuk 16 × 16, 24 × 24, 32 × 32, 48 × 48 , 57 × 57, 64 × 64, 72 × 72, 114 × 114, 120 × 120, 144 × 144, dan ikon berukuran 152 × 152.
Cari pengumuman kami segera tentang pembuat ikon baru yang telah kami kerjakan dan informasi lebih lanjut tentang cara menambahkan semua ukuran yang berbeda di situs web Anda.

Ikon Apple Touch

IPhone dan iPad telah keluar cukup lama dan Anda mungkin telah memperhatikan permintaan di log situs web Anda untuk file yang disebut apple-touch-icon.png. Jika Anda memiliki selamat situs web Anda mendapatkan lalu lintas dari pengguna iPhone dan iPad, kabar buruknya adalah browser web seluler mereka mencari file untuk membuat ikon khusus pada perangkat mereka yang tidak Anda miliki.
Berita baiknya adalah ini adalah perbaikan yang mudah. Peramban seluler Apple sedang mencari file bernama apple-touch-icon.png untuk membuat ikon bergaya Apple yang mewah di iPhone atau iPad. Cara mudah untuk memperbaikinya adalah dengan membuat atau menambahkan file yang disebut apple-touch-icon.png ke folder root situs web Anda. Gambar PNG harus minimal 45 piksel kali 45 piksel.
Jika Anda tidak dapat menyimpan file ke folder root, mungkin karena Anda menggunakan hosting gratis atau tidak memiliki akses, Anda dapat mengarahkan browser seluler Apple ke lokasi lain menggunakan kode berikut:
<link rel="apple-touch-icon" href="/folder/iphone-ipad-icon.png" />
Seperti kode favicon Anda perlu menambahkan kode ke bagian kepala HTML Anda.
Setelah Anda memiliki apple-touch-icon.png atau mengarahkan browser ke lokasi lain menggunakan kode tautan, pengunjung Anda dapat menyimpan situs web Anda di perangkat seluler Apple mereka dengan ikon yang bagus di perangkat iPhone dan iPad mereka. Ini pasti akan membuat situs web Anda menonjol di mesin mereka.

Cara Menambahkan Favicon Anda ke Blogger

Posting asli tentang Cara Menambahkan Favicon Anda ke Blogger adalah posting paling populer di sini di FreeFavicon. Sudah saatnya saya menulis posting baru tentang topik tersebut karena Blogger telah meningkat pesat dan instruksi itu tidak lagi diperlukan.
Untuk menambahkan favicon Anda ke blog Blogger Anda sekarang adalah proses tiga langkah sederhana. 
Langkah 1: Goto layout Anda di Blogger. 
Langkah 2: Klik Edit pada kotak yang mengatakan Favicon. Jendela baru akan terbuka. 
Langkah 3: Di jendela baru yang terbuka pilih gambar Anda untuk favicon Anda dan klik simpan. Blogger mengunggah gambar Anda dan menggunakannya sebagai favicon Anda.
Senang melihat bagaimana Blogger telah meningkatkan menambahkan favicon kustom Anda sendiri ke situs mereka. Tidak perlu mengedit kode lagi.

Hosting Favicon Anda dengan Dropbox

Dropbox adalah layanan yang fantastis. Saya menggunakannya secara teratur untuk menyinkronkan file antara desktop dan laptop saya. Itu memang memiliki kegunaan lain, seperti berbagi file dengan teman-teman Anda dan bahkan hosting situs web. Meskipun saya tidak akan merekomendasikan Anda meng-host situs web bisnis utama Anda dengan folder Publik bersama menggunakan Dropbox, menggunakan layanan untuk meng-host beberapa gambar, seperti favicon situs web Anda, memiliki beberapa keuntungan.
Jika Anda menggunakan layanan seperti Blogger dan ingin menambahkan favicon kustom Anda sendiri, Anda memiliki beberapa pilihan tempat untuk meng-host favicon Anda. Anda dapat mengunggah dan menyimpannya di server Google, meskipun terakhir kali saya mencoba mereka tidak menerima format .ico. Itu berfungsi sampai Anda ingin mengubah favicon Anda maka Anda harus mengulanginya lagi termasuk memperbarui kode Anda yang menunjuk ke favicon Anda.
Anda dapat meng-host favicon Anda pada layanan hosting gambar, tetapi kemudian mereka dapat menghapusnya kapan saja. Sekali lagi jika Anda ingin mengubah favicon Anda, Anda akan mengulang semua kode.
Karena Dropbox dapat meng-host file yang dapat diakses secara publik di Internet sekarang Anda memiliki opsi lain. Mengikuti tip dan trik wiki untuk membuat situs web Anda sendiri, Anda dapat dengan mudah membuat folder untuk favicon Anda, dan menyalin favicon Anda ke folder itu. Keuntungan meng-hosting favicon Anda di folder publik Dropbox Anda berarti Anda memiliki kontrol lebih besar terhadapnya. Jika Anda memutuskan untuk mengubah favicon Anda, yang perlu Anda lakukan hanyalah menyalin favicon yang ada dan itu akan diganti di situs web Anda. Anda tidak perlu mengulang kode yang menunjuk ke sana, dan Anda tidak perlu khawatir tentang layanan hosting gambar yang menghapusnya.
Jika Anda belum mencoba Dropbox, Anda harus melihatnya dengan serius. Mereka menawarkan ruang 2gb secara gratis, yang lebih dari cukup untuk berbagi dan menyinkronkan file antar komputer.
Mereka juga memiliki favicon yang hebat jika Anda mencari inspirasi.
Dropbox Favicon

Blogger.com Favicon ada di Internet Explorer

Cara Menambahkan Favicon Anda ke Blogger sejauh ini merupakan pos paling populer di blog ini. Jika Anda membaca komentar Anda akan melihat bahwa bagi sebagian orang itu berfungsi dengan baik dan bagi orang lain mereka tampaknya memiliki waktu yang sulit untuk membuatnya berfungsi. Kenyataannya adalah bahwa menambahkan favicon ke blog Blogger.com adalah sedikit peretasan. Hacks terkadang pecah dan tidak selalu berfungsi untuk semua browser web. Saat ini halnya dengan menambahkan favicon ke blog Blogger.com yang di-host di Blogspot untuk Internet Explorer.
Bagi Anda yang ingin mati-matian menggunakan favicon di Internet Explorer, Anda harus menggunakan file .ico, karena tampaknya Internet Explorer tidak ingin mendukung .png atau format lain untuk favicon. Anda tidak dapat mengunggah file .ico ke Blogger.com, artinya Anda perlu meng-host favicon Anda di tempat lain di Blogger.com. Opsi bisa berupa Google Page Creator .
Anda masih perlu memasukkan kode sebelum tag kepala penutup. Kode Anda kemudian akan terlihat seperti ini:

<link href='http://www.example.com/favicon.ico' rel='shortcut icon'/>
</head>
Kode saat ini diinstal pada blog uji Blogger Favicon Gratis dan ditampilkan di Internet Explorer 7 pada Windows Xp Pro. Jika tidak berhasil, tinggalkan komentar dan kami akan melihat apakah itu dapat diselesaikan


Cara Menambahkan Favicon Anda ke Pembaruan Blogger

Google / Blogger melanggar instruksi di posting sebelumnya tentang cara menambahkan favicon Anda sendiri ke blog blogspot dengan menambahkan beberapa HTML yang merujuk favicon Blogger.com. Untungnya perbaikan untuk ini relatif sederhana. Inilah yang terjadi.
Blogger.com telah menambahkan HTML mereka sendiri ke templat di dekat bagian atas yang mereferensikan favicon mereka. Sepertinya ini jika Anda melihat kode sumber.
<link href='http://www.blogger.com/favicon.ico' rel='icon' type='image/vnd.microsoft.icon'/>
Petunjuk tentang Cara Menambahkan Favicon Anda ke Blogger pada langkah ketiga mengatakan untuk menambahkan kode HTML Anda sendiri yang merujuk favicon Anda tepat di bawah tag <head>. Namun browser web akan menggunakan referensi terakhir sehingga kode favicon Blogger.com akan datang kemudian. Cara mengatasinya adalah dengan meletakkan kode favicon Anda tepat sebelum tag <head> penutup yang terlihat seperti ini: </head>.
Kode Anda yang merujuk favicon khusus Anda kemudian menimpa kode Google / Blogger.com untuk favicon dan favicon khusus Anda akan kembali.
Saya menguji ini di blog Free Favicon Blogspot dan favicon telah kembali. Cobalah di blog Blogspot Anda dan beri tahu saya jika berhasil.

Cara Menambahkan Favicon Anda ke Blogger

Pembaruan: Blogger telah meningkat dan instruksi ini tidak lagi diperlukan.
Blogger.com adalah salah satu platform blogging paling populer di Internet, namun jika Anda memiliki blog, Anda sering terjebak dengan favicon Blogger.com default. Sulit memberi merek blog Anda dengan sentuhan pribadi Anda sendiri ketika Anda memiliki favicon Blogger.com di bilah alamat. Jika orang membookmark blog Anda, mereka tidak akan melihat favicon Anda dan mungkin dengan cepat melupakan situs web Anda. Tidak ada alasan mengapa Anda tidak dapat mengubah favicon di blog Blogger.com Anda dengan salah satu desain Anda sendiri. Anda hanya perlu mengikuti langkah-langkah mudah ini dan segera blog Blogger.com Anda akan menampilkan favicon baru yang dibuat khusus.
  1. Hal pertama yang perlu Anda lakukan adalah membuat favicon buatan sendiri. Dalam hal ini Anda tidak harus menggunakan gambar untuk generator favicon , tetapi gambar Anda harus berupa .gif atau .png. Dalam contoh Anda, kita akan menggunakan file .png. Jika Anda tidak yakin gambar seperti apa yang digunakan untuk menelusuri beberapa favicon gratis yang kami tawarkan, mungkin akan ada satu di sana yang ingin Anda gunakan. Jika Anda memutuskan untuk menggunakan salah satu dari banyak favicon yang kami tawarkan jangan klik "Unduh favicon ini" karena itu akan memberi Anda file dalam format Windows .ico. Alih-alih mengklik kanan pada gambar dan pilih "Simpan Gambar Sebagai".
  2. Setelah Anda memiliki gambar yang ingin Anda gunakan sebagai favicon Anda, goto blog Blogger.com Anda dan buat posting baru. Tidak masalah apa yang Anda panggil karena Anda tidak perlu mempublikasikannya. Setelah Anda membuat posting baru gunakan tombol unggah gambar untuk mengunggah favicon Anda ke blog Blogger.com Anda. Setelah mengunggah gambar, Anda harus beralih ke mode "Edit HTML" jika Anda menggunakan mode "Tulis". Setelah Anda melihat HTML Anda akan melihat sesuatu seperti ini: Anda perlu menyorot dan menyalin bagian dalam tanda kutip tepat setelah src. Dalam hal ini akan: Anda harus menempelkannya ke Notepad atau editor teks lain. Anda tidak ingin kehilangan ini dan Anda akan menutup jendela pengeditan Blogger.com berikutnya.


    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM3QDtB0YHdFG8KAV5N-fyGdBEOI5zYJfcNyWIY-BWfJ0Nde5pqQtWj_PbpUK8jlh0Waf7AWeOd5IhJEVyqiQHenRMOe2N_DV3FOwY114BNBLvz0-rih663M6fEdPgm7s4Yo5j5rdkPUvt/s400/favicon.png" alt="" id="BLOGGER_PHOTO_ID_5212704798569567682" border="0" />https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM3QDtB0YHdFG8KAV5N-fyGdBEOI5zYJfcNyWIY-BWfJ0Nde5pqQtWj_PbpUK8jlh0Waf7AWeOd5IhJEVyqiQHenRMOe2N_DV3FOwY114BNBLvz0-rih663M6fEdPgm7s4Yo5j5rdkPUvt/s400/favicon.png
  3. Setelah Anda memiliki lokasi gambar yang Anda unggah disalin, Anda dapat mengklik tab Layout di blog Blogger.com Anda. Setelah Anda berada di Layout, Anda perlu mengklik "Edit HTML" Lihat di HTML untuk tag yang mengatakan<head> </head>dan kanandi bawah di atasnya tempel: <tautan href = ”rel = 'ikon pintasan' /> 
    <tautan href =” rel = 'ikon' type = 'image / png' /> 
    Setelah Anda menyisipkan garis-garis itu ke dalam templat, salin src dari gambar yang ingin Anda gunakan saat Anda mengunggah yang Anda unggah sebelumnya dan tempel ke dalam dua baris yang baru saja Anda tambahkan di mana href = "berada. Dalam kasus kami, tampilannya seperti ini: Klik simpan template dan Blogger.com Anda sekarang seharusnya menampilkan favicon kustom baru yang mewah di bilah alamat ketika Anda mengunjungi blog Anda. <link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM3QDtB0YHdFG8KAV5N-fyGdBEOI5zYJfcNyWIY-BWfJ0Nde5pqQtWj_PbpUK8jlh0Waf7AWeOd5IhJEVyqiQHenRMOe2N_DV3FOwY114BNBLvz0-rih663M6fEdPgm7s4Yo5j5rdkPUvt/s400/favicon.png' rel='shortcut icon'/>
    <link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM3QDtB0YHdFG8KAV5N-fyGdBEOI5zYJfcNyWIY-BWfJ0Nde5pqQtWj_PbpUK8jlh0Waf7AWeOd5IhJEVyqiQHenRMOe2N_DV3FOwY114BNBLvz0-rih663M6fEdPgm7s4Yo5j5rdkPUvt/s400/favicon.png' rel='icon' type='image/png'/>

Jika Anda ingin melihat bagaimana kami melakukannya, lihatlah di blog Blogger.com Favicon Gratis kami tempat kami menambahkan favicon hebat kami.
Anda dapat menggunakan layanan hosting gratis lainnya untuk meng-host favicon khusus Anda, tetapi Anda tidak ingin menggunakan layanan hosting gambar yang menghapus gambar setelah sekian hari. Menggunakan Blogger.com untuk meng-host gambar berfungsi dengan baik, tetapi Anda juga bisa menggunakan Google Page Creator , atau bahkan akun Flickr Anda .
Bersenang-senang menambahkan favicon khusus Anda ke blog Blogger.com Anda!
Pembaruan: Tampaknya Internet Explorer sedang sulit dan mungkin Anda perlu menggunakan file .ico. Periksa posting ini untuk informasi lebih lanjut. Blogger.com Favicon ada di Internet Explorer

Tidak ada komentar:

Posting Komentar

LightBlog

We’ll never share your email address with a third-party.

Label

Label

Label