Tecnico

Cos'è una favicon, e perché il tuo sito ne ha bisogno?

La piccola icona in una scheda del browser è spesso la prima cosa che un visitatore nota, e la prima che tradisce un sito incompleto.

Cos'è

Una favicon (abbreviazione di "favorite icon") è la piccola immagine quadrata che appare accanto al titolo della tua pagina in una scheda del browser, in un elenco di segnalibri e a volte nella cronologia e nei suggerimenti di ricerca del browser. Di solito è una versione semplificata di un logo: abbastanza piccola da restare riconoscibile a pochi pixel di dimensione, come una lettera, una forma semplice o un'icona.

Senza una favicon, i browser mostrano al suo posto un'icona generica e vuota, lo stesso segnaposto usato per qualsiasi sito che non ne ha impostata una, il che rende subito evidente che questo dettaglio specifico non è mai stato configurato.

Perché è importante

Una favicon mancante è un dettaglio piccolo, ma anche uno dei più visibili: compare in ogni singola pagina del tuo sito, in ogni scheda del browser, per ogni visitatore, sempre. Quando qualcuno ha diverse schede aperte, la favicon è spesso l'unico modo per individuare visivamente di nuovo la tua scheda tra le altre: un'icona vuota generica rende tutto questo più difficile e segnala silenziosamente "questo sito non è mai stato davvero completato".

È anche una delle vittorie più rapide di tutto questo elenco: a differenza delle decisioni di contenuto o design, una favicon richiede pochi minuti per essere creata e aggiunta, senza manutenzione continua una volta impostata.

Come risolverlo

  1. Crea un'immagine quadrata semplice (idealmente una versione semplificata del tuo logo): gli strumenti gratuiti per generare favicon possono convertire automaticamente un logo esistente nei formati e nelle dimensioni giuste.
  2. Salva il risultato come favicon.ico o favicon.svg e caricalo nella cartella principale del tuo sito (o ovunque la tua piattaforma di hosting si aspetti i file delle icone).
  3. Aggiungi <link rel="icon" href="/favicon.ico"> (o l'equivalente SVG) all'interno della sezione <head> della tua pagina.
  4. Se usi un website builder (Squarespace, Wix, Webflow, WordPress), cerca un campo di caricamento "favicon" o "icona del sito" nelle impostazioni generali del sito invece di modificare direttamente il codice.
  5. Ricarica la pagina in una nuova scheda del browser (o svuota la cache del browser) per confermare che la nuova icona appaia: le favicon a volte vengono memorizzate nella cache e sono lente ad aggiornarsi.

Verifica se il tuo sito ha questo problema

Launch Readiness analizza il tuo sito alla ricerca di questo e altri ~50 problemi prima del lancio, in pochi secondi — gratis, senza registrazione.

Avvia un'analisi gratuita