Cara Format Favicon Berfungsi
Mengetahui cara setiap format berfungsi membantu anda menyahpepijat masalah "favicon saya tidak dipaparkan" yang tidak dapat dielakkan.
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
Bekas .ico
Fail .ico ialah pengepala diikuti oleh satu atau lebih entri imej. Setiap entri boleh menjadi BMP atau PNG, dan setiap entri mempunyai lebar, tinggi dan kedalaman bit.
Penyemak imbas menghuraikan direktori, memilih entri yang sepadan dengan saiz yang diminta dan menyahkod hanya satu itu.
PNG dalam .ico
Untuk saiz 64×64 dan ke atas, pemampatan PNG memotong saiz fail sebanyak 5-10x tanpa kehilangan penglihatan. Penjana moden (termasuk kami) melakukan ini secara automatik.
SVG favicon
Favicon SVG ialah fail SVG biasa. Penyemak imbas menjadikannya seperti mana-mana SVG lain, dan blok <style> boleh menyesuaikan warna berdasarkan pilihan-warna-skim.
Cara pelayar memilih
Jika anda menyediakan berbilang teg <link rel="icon">, penyemak imbas memilih yang paling sepadan dengan permukaan (tab lwn penanda halaman lwn pemasangan). SVG diutamakan apabila disokong; .ico adalah sandaran.
Soalan lazim
What is inside a .ico file?
A header plus a directory of image entries. Each entry can be BMP or PNG at a specific width and height.
How do browsers choose which favicon to display?
Browsers read all <link rel="icon"> tags and pick the best match for the surface — tab, bookmark, or install prompt. SVG is preferred when supported; .ico is the fallback.
Why use PNG inside an .ico instead of BMP?
PNG compression cuts file size 5–10× at 64×256 with no visible loss, which speeds up page loads.
Can I use only SVG for favicons?
Not safely. Always ship favicon.ico as a fallback for older browsers, Windows shortcuts, and embedders that ignore SVG.