Bagaimana cara menguji serangkaian ikon sentuh browser, favicon dan ubin untuk situs web?

8

Berbagai browser dan perangkat memiliki spesifikasi dan standar sendiri untuk jenis ikon seperti favicon yang mereka gunakan untuk mewakili halaman web. Jawaban ini di situs desain grafis memberikan gambaran yang cukup bagus .

Misalkan Anda telah bersusah payah untuk menyediakan sejumlah besar file ikon ini dengan deklarasi yang sesuai dalam HTML Anda - tetapi Anda tidak memiliki setiap perangkat yang Apple hasilkan ditambah perangkat Windows 8 plus berbagai versi Android untuk digunakan untuk menguji semuanya.

Apakah ada cara mudah untuk menguji konfigurasi Anda dan melihat file apa (jika ada) berbagai perangkat dan browser yang akan dimiliki, tanpa harus memiliki semua perangkat yang diperlukan?

Sunting agar jelas, maksud saya ikon yang dinyalakan dan digunakan browser saat mewakili halaman web dalam fitur browser seperti "paling banyak dikunjungi", "favorit" atau saat membuat pintasan layar beranda, yang dideklarasikan di halaman web <head>tetapi tidak ditampilkan di mana saja di halaman web <body>.

testing favicon icon resources user56reinstatemonica8
sumber

Jawaban:

3

Saya selalu menggunakan generator favicon di realfavicongenerator.net , yang memungkinkan Anda untuk melihat bagaimana karya seni pilihan Anda akan muncul di perangkat yang berbeda. Ada beberapa opsi dan Anda dapat mencoba dengan ikon contoh mereka untuk menguji. Mulailah dengan SVG persegi untuk hasil terbaik karena situs akan mengonversinya ke format yang diperlukan dan memberi Anda folder terkompresi dengan segala sesuatu yang siap digunakan.

Ini juga layanan gratis tanpa registrasi atau omong kosong lainnya yang diperlukan. Cukup gunakan dan donasi jika Anda merasa berguna.

Tom Brossman
sumber
Saya suka situs itu. Generator favicon terbaik yang pernah saya gunakan. Ini akan menghasilkan Zip dengan semua file gambar Anda dan menghasilkan semua baris kode yang diperlukan agar berfungsi.
Tersedia
0

Saya sarankan mencoba emulasi perangkat di Google Chrome. Ini adalah cara termudah yang pernah saya lihat dan harus bekerja. Berikut ini artikel lengkapnya, https://developer.chrome.com/devtools/docs/device-mode

Ben Hoffman
sumber
Saya memang mencoba ini, tetapi saya tidak tahu bagaimana mendapatkannya untuk melakukan sesuatu yang kemudian akan menampilkan ikon sentuh bagaimana browser akan misalnya pada halaman tab kosong. Apakah Anda tahu kalau itu mungkin?
user56reinstatemonica8
Saya tidak berpikir ada cara mudah untuk menguji ikon itu.
Ben Hoffman
-1

Cukup uji ini dengan menggunakan Mozilla Firefox, sebagian besar pengembang aplikasi web menggunakan metode ini untuk pengujian

Ashraf Zebronet
sumber
Ini sama sekali tidak menjawab pertanyaan. "Cukup uji dengan menggunakan ..." OP bertanya bagaimana cara menguji. Saya ingin melihat ini memerah sehingga kita bisa menggunakan FF untuk menguji bagaimana item seperti windows-tile-150x150.png mewakili situs di FireFox, misalnya.
Will Lanni