Vi sarete accorti come in, oramai, tutti i siti sono presenti quelle piccole immagini a lato dell’indirizzo web lo identifica. Per creare questa piccola immagine possiamo utilizzare uno dei tanti programmi presenti sul web, oppure se già disponiamo di Photoshop o Photoshop Elements lo potremmo creare con questo software.
Ecco gli strumenti di cui abbiamo bisogno:
- Il software Photoshop o Photoshop Elements (software a pagamento)
- Windows Icon (ICO) file format Photoshop plugin (scaricabile gratuitamente)
- Il Blocco note oppure un editor HTML
Dove possiamo recuperarli:
- Photoshop dal sito della Adobe –> Adobe Photoshop
- Il Plugin lo troviamo gratuitamente qui –> http://www.telegraphics.com.au/sw/
- Il Blocco note lo troviamo in tutte le versioni di Windows: Start–> Tutti i programmi –> Accessori (Win XP), Start –> Programma –> Accessori (Win 98/2K).
Ora installiamo il Plug-in scaricato per Photoshop, il file dovrebbe avere un nome simile a questo: icoformat-win-1.6f2.zip. Unzippiamo il file compresso, al suo interno troveremo tre file: COPYING, README.txt e icoformat.8bi.
Il file che ci interessa di più di tutti è l’ultimo quello con estensione .8bi, se volete sopratutto se sapete l’inglese potete leggere il file README.txt dove sono presenti le istruzioni, se no ve le dico io.
Andate in Risorse del Computer –> Programmi –> Adobe –> Photoshop –> PLUG-IN –> Formati di file (quest’ultimo è la cartella dove dovremo trascinare il file icoformat.8bi. Seguite gli step delle immagini se non avete capito:
PASSO 1
PASSO 2
PASSO 3
PASSO 4
Ora possiamo che abbiamo installato il nostro Plug-In se abbiamo Photoshop aperto lo chiudiamo poi lo riavviamo e le modifiche saranno apportate.
Per prima cosa creiamo la nostra immagine, vi ricordo che la grandezza finale dell’immagine favicon.ico deve essere OBBLIGATORIAMENTE 16 pixel X 16 pixel. Quindi per lavorare al meglio possiamo creare un’immagine più grande ma per non perdere qualità dell’immagine facciamo in modo che le dimensioni siano multipli di 16, esempio 64 X 64.
Creare una Favicon.ico con Photoshop
A questo punto creiamo la nostra immagine, ricordiamoci sempre di rispettare le dimensioni 16 X 16. Ora facciamo clic nella barra del menu su FILE –> SALVA CON NOME. (come da figura)
Creare una Favicon.ico con Photoshop
A questo punto selezionate dal menù a discesa del Formato ICO (Windows Icon) (*.ico) e dategli il nome favicon. (come da figura)
Creare una Favicon.ico con Photoshop
Ecco ora che abbiamo il nostro file, che possiamo inserire nella pagine web attraverso il TAG HTML seguente:
<link rel="SHORTCUT ICON" href="/favicon.ico">;
da inserire nell’head della pagina.