ICO vs PNG per i favicon

ICO è universale ma datato; PNG è moderno ma richiede un collegamento esplicito. Ecco come usarli insieme al meglio.

4 min di lettura

Check favicons on any website

Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.

Install Chrome Extension

ICO: il fallback universale

Ogni browser desktop cerca /favicon.ico senza che tu faccia nulla. È un contenitore che può ospitare più risoluzioni.

I collegamenti Windows e Esplora file si basano su .ico, quindi anche se le favicon web non ti interessano, pubblicane uno per il sistema operativo.

PNG: pixel-perfect a qualsiasi densità

PNG offre una resa cristallina su display HiDPI quando lo colleghi con <link rel="icon" sizes="...">.

Usa PNG 192×192 e 512×512 per il web manifest, e 180×180 per l'apple-touch-icon.

Verdetto: usali entrambi

Pubblica un .ico multi-risoluzione per il supporto universale, più varianti PNG per display HD e prompt di installazione PWA. Aggiungi anche un SVG per l'icona vettoriale più nitida.

FAQ

Should I use ICO or PNG for a favicon?

Use both: ICO for universal /favicon.ico fallback and PNG for high-DPI tabs and PWA manifest icons.

Does every browser support PNG favicons?

Modern browsers do when you link them with <link rel="icon" type="image/png">. ICO remains the safest default.

Is ICO outdated?

ICO is older but still required for Windows shortcuts and automatic /favicon.ico discovery by browsers.

Guide correlate

Prova gli strumenti

Continua a leggere