Home -> Articoli ->Favicon

Una Favicon non è altro che una iconcina di piccole dimensioni (16x16) che appare sulla barra degli url, affianco all'url stesso.

Creare una Favicon

Per poter creare questa iconcina, potete usare Photoshop ed un plug-in gratuito per questo programma, che vi consentirà di salvare le immagini in formato icona (.ico) e che potete scaricarlo gratuitamente dal sito www.telegraphics.com.au/sw/. Scaricate il tool "ICO (Windows Icon) Format" disponibile per windows e mac.

Dopo aver scaricato e scompattato il file, spostate il file nella cartella dei plugin del vostro programma. Nel mio caso Photoshop, nella cartella C:/Programmi/Adobe/Photoshop/CS2Plug-InImporta-Esporta.

Aprite ora Photoshop e scegliete un file nuovo. Le dimensioni devono essere di 16 x 16 pixel ed il fondo può essere trasparente in quanto supportato dal formato ico.

Disegnte ora la vostra iconcina... Nel farlo ricordatevi che il formato ico è molto simile ad una gif, per cui supporta la trasparenza e si possono usare al massimo 256 colori. Una volta disegnata, potete salvarla scegliendo la voce "ICO (windows icon)" anzichè gif o altro.

Una volta salvata, dovete inserire il codice seguente nella nostra pagina html e più precisamente nell'head, sotto il TAG TITLE:

<LINK REL="SHORTCUT ICON" type="image/x-icon" HREF="http://www.miosito.it/img/icona.ico">

A tal punto il mini tutorial è finito...

Per vedere la vostra favicon su Firefox, basta semplicemente lanciare la pagina e la vedrete, mentre per Internet Explorer il tutto è un pò più arduo. Infatti se lanciate direttamente la pagina con Internet Explorer, non vedrete comparire l'iconcina; per farla vedere, la pagina web in questione deve essere salvata tra i preferiti del vostro browser e quindi di ogni visitatore. Ecco qui la sola!!

Per ulteriori info, potete visitare il sito ufficiale http://www.favicons.com/index.html.

Un ottimo validatore di favicon lo potete trovare qui: http://www.html-kit.com/favicon/validator/.

Cerca nel sito