Cos’è una favicon? De­fi­ni­zio­ne ed esempi

L’im­por­tan­za delle favicon per i siti web va ben oltre il semplice design. Tra le altre cose, le piccole icone servono anche per l’orien­ta­men­to e hanno effetti positivi sulla SEO.

Un piccolo simbolo con un grande effetto: una favicon è una piccola icona che viene vi­sua­liz­za­ta, ad esempio, sul lato sinistro della scheda del browser e consente di avere una visione d’insieme anche se si hanno numerosi siti web aperti. Di solito mostra un logo sem­pli­fi­ca­to o un’immagine: tramite essa si può fa­cil­men­te iden­ti­fi­ca­re il sito web cor­ri­spon­den­te. La favicon ha quindi un si­gni­fi­ca­to par­ti­co­la­re: serve come orien­ta­men­to e rafforza la presenza di un sito web.

Quale sia esat­ta­men­te la favicon più adatta o cosa si può uti­liz­za­re per crearne una dipende dall’aspetto del vostro marchio. Poiché il simbolo stesso ha una di­men­sio­ne di pochi pixel, spesso i loghi so­fi­sti­ca­ti e det­ta­glia­ti non possono essere vi­sua­liz­za­ti in modo sod­di­sfa­cen­te. In questo caso, si consiglia una variante sem­pli­fi­ca­ta del simbolo iden­ti­fi­ca­ti­vo vero e proprio.

La grande im­por­tan­za della favicon si può già intuire dal nome: si tratta di una parola composta, creata dall’unione dei termini “favorite” e “icon”, che significa “icona dei preferiti”. Le piccole immagini non appaiono solo nelle schede del browser, ma anche nei se­gna­li­bri, dove vengono salvati i siti web preferiti. Inoltre, ora le favicon si trovano anche come icone delle app, nei menu di ricerca o nella cro­no­lo­gia del browser.

La grande im­por­tan­za della favicon giusta per il vostro sito web si spiega con diversi motivi:

• Pro­fes­sio­na­li­tà: la favicon è parte in­te­gran­te di un sito web pro­fes­sio­na­le. Rafforza la fiducia dei vi­si­ta­to­ri nel vostro marchio e dimostra che per voi sono im­por­tan­ti anche i piccoli dettagli. Anche se la maggior parte delle persone non è in grado di dire che cos’è esat­ta­men­te una favicon, ne no­te­reb­be­ro im­me­dia­ta­men­te l’assenza.
• Iden­ti­fi­ca­zio­ne: la favicon è par­ti­co­lar­men­te im­por­tan­te anche per motivi pratici. Gli utenti tro­ve­ran­no il vostro sito web molto più ra­pi­da­men­te grazie alla piccola icona, anche se sono aperte numerose schede con­tem­po­ra­nea­men­te. L’icona rende inoltre il vostro marchio in­con­fon­di­bi­le nei motori di ricerca o nell’elenco delle app.
• Raf­for­za­men­to del vostro marchio: un buon logo ga­ran­ti­sce che il vostro marchio venga ri­co­no­sciu­to e può svolgere un ruolo nel processo de­ci­sio­na­le d’acquisto. Per quanto fon­da­men­ta­le sia il design del logo per la vostra startup o il vostro marchio, anche la giusta favicon è si­gni­fi­ca­ti­va.

Almeno in­di­ret­ta­men­te, la favicon ha anche un si­gni­fi­ca­to per l’ot­ti­miz­za­zio­ne per i motori di ricerca. Sebbene non influisca di­ret­ta­men­te sul ranking, una buona favicon ha comunque un effetto positivo sulla SEO. I motivi sono i seguenti:

• Funzione se­gna­li­bro: in par­ti­co­la­re su Chrome, la favicon funge da se­gna­li­bro. I siti web che sfruttano questa funzione vengono in­di­vi­dua­ti molto meglio e possono po­si­zio­nar­si in modo pro­mi­nen­te. In molti casi, questo aumenta si­gni­fi­ca­ti­va­men­te il traffico.
• Facilità d’uso: l’usabilità di un sito web ha un impatto diretto sul suo successo. Gli utenti premiano le pagine che seguono un concetto rigoroso, sono vi­si­va­men­te ac­cat­ti­van­ti e sulle quali è possibile navigare in modo intuitivo. Le favicon con­tri­bui­sco­no a questo obiettivo. I vi­si­ta­to­ri rimangono più a lungo e più spesso su siti web ben pro­get­ta­ti, e questo viene a sua volta premiato dai motori di ricerca nel ranking.
• Vi­si­bi­li­tà: una maggiore vi­si­bi­li­tà grazie a un’icona ap­pro­pria­ta è anche ri­com­pen­sa­ta con un miglior po­si­zio­na­men­to nel lungo periodo. Gli utenti sono più propensi ad aprire un sito web con un’icona ac­cat­ti­van­te, so­prat­tut­to perché questa viene vi­sua­liz­za­ta anche nei risultati della ricerca.

Non è possibile delineare le ca­rat­te­ri­sti­che di una buona favicon in generale. Questo perché l’approccio adatto dipende in larga misura dal marchio e dal suo design. Molte aziende uti­liz­za­no anche il proprio logo come favicon, ma questo funziona solo se rimane ac­cat­ti­van­te anche in miniatura e a bassa ri­so­lu­zio­ne. Tuttavia, alcune regole di base per creare una mini-grafica adeguata sono le seguenti:

• Corporate identity: gli esempi di favicon di successo sono sempre in linea con la corporate identity di un’azienda. Anche se non è possibile uti­liz­za­re il proprio logo come simbolo, il motivo scelto dovrebbe comunque abbinarsi al resto del design. Questo è l’unico modo per pre­ser­va­re l’unicità del marchio.
• “Less is more”: le favicon sono molto piccole, per cui le de­co­ra­zio­ni e i dettagli elaborati non vengono mostrati al meglio quando l’icona viene ef­fet­ti­va­men­te uti­liz­za­ta, so­prat­tut­to su uno smart­pho­ne. Il risultato appare di­sor­di­na­to e non più ac­cat­ti­van­te. Un’opzione è quindi sempre quella di uti­liz­za­re le iniziali di un marchio. Poiché solo raramente è possibile riportare l’intero titolo nella favicon, conviene piuttosto uti­liz­za­re la lettera iniziale o un’icona semplice ma si­gni­fi­ca­ti­va.
• I colori giusti: i colori uti­liz­za­ti devono ov­via­men­te cor­ri­spon­de­re alla vostra corporate identity. Se non li avete ancora scelti, tenete a mente che i colori con­tra­stan­ti sono una buona idea, in quanto catturano più ra­pi­da­men­te l’at­ten­zio­ne. Tuttavia, tenete sempre presente che i diversi browser vi­sua­liz­za­no le favicon in modo leg­ger­men­te diverso. Ad esempio, le immagini piccole possono avere uno sfondo bianco o grigio, il che può cambiare un po’ l’effetto.

Se de­si­de­ra­te integrare una favicon, dovete ri­spet­ta­re le di­men­sio­ni delle favicon ap­pro­pria­te. Sebbene di norma si tratti di 16 x 16, 32 x 32 o 48 x 48 pixel, alcuni browser purtroppo si di­sco­sta­no da questi valori. Di seguito un elenco delle eccezioni:

In linea di principio, le favicon possono essere create in diversi formati. Tuttavia, il più comune è .ico, un con­te­ni­to­re di dati immagine che consente diverse pro­fon­di­tà di bit e ri­so­lu­zio­ni. Questo formato è sup­por­ta­to dalla maggior parte dei browser. È possibile uti­liz­za­re anche .png, .gif o .svg. Questi tre formati, però, non sono com­pa­ti­bi­li con tutti i browser. Anche il formato .jpg è uti­liz­za­bi­le, ma la bassa ri­so­lu­zio­ne non lo rende ideale.

Nella Digital Guide troverete numerosi altri articoli che vi ser­vi­ran­no per la vostra presenza online. Oltre a delle linee guida per la creazione di un sito web, c’è anche una guida utile per inserire le favicon su WordPress.