Assegnare un’icona ad un sito web

Potrebbe considerarsi il logo di un sito: avrete notato che capita sempre più spesso vedere delle piccole icone associate all’indirizzo di un sito web nella barra degli indirizzi del browser, nelle schede aperte sempre all’interno dei vari Firefox, Chrome, Explorer, Safari, ecc o nei Segnalibri.

Creare favicon (icone) per un sito web

L’immagine distintiva della pagina web viene chiamata “favicon” ed è uno strumento semplice, leggero e intuitivo, che può facilitare di molto la navigazione su internet. Con l’avvento della navigazione a tab, avere un’immagine che richiama immediatamente la scheda che vogliamo visualizzare, aiuta ad orientarci e a risparmiare tempo, fatica e clic.

Il termine “favicon” è un’abbreviazione dell’espressione inglese favorites icon. Generalmente si tratta del logo del sito in piccole dimensioni o di un’immagine che richiama il contenuto.

Come associare e visualizzare favicon in un sito internet

Vediamo nel dettaglio qual’è il procedimento per disegnare e assegnare un’icona al nostro sito web. Il procedimento è piuttosto semplice.

Innanzitutto, è conveniente utilizzare un’immagine che già abbiamo a disposizione e che identifichi immediatamente il sito. Il logo della nostra organizzazione, azienda, prodotto andrà benissimo. Per costruire la nostra favicon occorrerà utilizzare programmi per l’elaborazione grafica come Gimp o Adobe Photoshop. L’icona dovrà preferibilmente avere altezza e larghezza di uguali dimensioni ed è consigliabile che lo sfondo sia trasparente. In tal modo, a prescindere dal tema utilizzato dal browser, l’icona sarà visualizzata in modo ottimale.

Le dimensioni della nuova immagine dovranno essere 16px x 16px e una volta ultimatone il disegno, occorrerà salvarla con estensione .ico e nome “favicon”.

Una volta terminato il lavoro di editing grafico, sarà necessario caricare l’icona nella cartella root del nostro sito e aggiungere alla index del sito (o in ogni pagina, se necessario) la seguente semplice linea di codice:

<link rel="icon" href="http://<percorso_icona>favicon.ico" />

Dopo aver effettuato tutte le modifiche, bisognerà ricaricare le pagine del sito in cui si sono operati i cambiamenti. Per visualizzare la nuova icona del sito è fondamentale svuotare la cache e riavviare il browser (può capitare di doverlo fare più volte!).

Simone Apollo

Simone Apollo - Sociologo esperto di America latina, cooperazione internazionale, fundraiser e specialista di SEO e web-marketing per il non profit.

More Posts

Follow Me:
LinkedIn