Favicons: Cara memastikan penyemak imbas hanya memuat turun versi SVG

Baru -baru ini, Šime Vidas menyerlahkan thread Twitter yang membincangkan Favicon HTML. Kod Favicon awal saya mengandungi typo:

<link href="/favicon.ico" rel="icon" size="any"><link href="/favicon.svg" rel="icon" type="image/svg xml">

Kod yang betul menggunakan sizes dan bukannya size :

<link href="/favicon.ico" rel="icon" sizes="any"><link href="/favicon.svg" rel="icon" type="image/svg xml">

Pembetulan ini menghalang Chrome daripada memuat turun favicons ICO dan SVG, memastikan hanya SVG (format pilihan) yang digunakan. Fail ICO saya ialah 5.8kb, yang mewakili beban simpanan setiap halaman yang tidak dapat dielakkan.

Šime menyebutkan ini dalam Web Platform News #42, dengan menyatakan bahawa sementara SVG favicons disokong oleh semua pelayar moden kecuali safari, mengisytiharkan kedua -dua ICO dan SVG memerlukan sizes="any"<link> Tag untuk mengelakkan Chrome daripada mengutamakan ICO. (Lihat Chrome Bug 1162276 untuk maklumat lanjut). Dia memetik trik CSS sebagai contoh markup optimum, walaupun ini hanya benar selepas kesilapan itu dikenalpasti. Typo asal mungkin berpunca daripada artikel sebelumnya (kini diperbetulkan), tetapi artikel Andrey tetap menjadi sumber yang berharga untuk pelaksanaan Favicon praktikal.

Atas ialah kandungan terperinci Favicons: Cara memastikan penyemak imbas hanya memuat turun versi SVG. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!