La FAVICON o “Favorites Icon” è l’icona che vediamo nel nostro browser internet in alto a sinistra, vicino alla barra dell’indirizzo. L’utilizzo principale di questa icona è quello di apparire all’interno del menu dei siti preferiti.

Esistono diversi tipi di immagini utilizzabili per la creazione della favicon, quelli più diffusi sono i seguenti:

1) .ICO
Se puntate sulla compatibilità tra i diversi browser internet, questo formato è sicuramente il più adatto. L’estensione .ico è supportata dalla maggior parte dei browser tra cui Internet Explorer (dalla versione 4.0 in su), Google Chrome, Mozilla Firefox, Opera e Safari. Come per le icone di Windows, è supportata la trasparenza.

2) .GIF
L’estensione .gif è simile alla .ico, l’unica differenza forse per alcuni utenti meno esperti con i programmi di grafica per la creazione di icone è quella di poterla creare con un qualsiasi programma che supporti il salvataggio di immagini in formato .gif. L’unico neo del formato .gif è quello di non essere supportato da Internet Explorer, perlomeno fino alla versione 8.0 e dalle versioni precedenti alla 4.0 di Google Chrome e Safari. Anche il formato .gif supporta la trasparenza con i soliti limiti dell’estensione e cioè: non sono utilizzabili sfumature con più di 256 colori e la trasparenza deve avere un colore di “match” (che combaci con il colore di sfondo).

3) .PNG
L’estensione .png rispetto alla .gif ha il vantaggio di supportare pienamente la trasparenza dell’icona e di non avere il limite dei 256 colori. La compatibilità con i diversi browser è pari a quella dell’estensione .gif, se non per Internet Explorer, il quale supporta l’estensione .png solo dalla versione 8.0.

4) .JPG
L’estensione .jpg è identica alla .png con qualche differenza: non è supportata da Internet Explorer e non supporta la trasparenza.

5) .GIF Animata

Questa estensione è identica al formato .gif con la possibilità però di essere animata. Purtroppo le favicon in formato gif animato sono supportate solo da Firefox e Opera.

I metodi di integrazione della favicon all’interno del codice HTML sono i seguenti:

1) Metodo supportato dalla maggior parte dei browser:
<link rel="shortcut icon" href="http://www.ilmiosito.com/favicon.ico" />

2) Integrazione dei formati differenti da quelli .ico:
<link rel="icon" type="image/png" href="http://www.ilmiosito.com/favicon.png">
<link rel="icon" type="image/gif" href="http://www.ilmiosito.com/favicon.gif">
<link rel="icon" type="image/jpeg" href="http://www.ilmiosito.com/favicon.jpg">

Per la creazione di favicon ci sono diversi siti che offono la possibilità di farlo direttamente online:
DynamicDrive FavIcon Generator
Favicon.cc
Animated FavIcon


Lascia una risposta