Negli ultimi tempi vi abbiamo proposto degli ottimi generatori di Favicon.ico, l’iconcina 16x16px che identifica graficamente un sito (si trova, solitamente, nella barra degli indirizzi o tra i bookmark), utilissima e indispensabile per personalizzare al meglio il proprio sito o blog. Generatori che, solitamente, convertono testo o immagini Jpeg nel classico formato Ico. Ma, avendo un po’ di tempo, perché non provare a creare da zero la propria Favicon, con Photoshop?
Vi premetto che è davvero un’operazione semplice, e con pochi accorgimenti potrete creare delle bellissime iconcine personalizzate, per aggiungere un tocco di classe in più al vostro sito. Prima di iniziare abbiamo bisogno di un accorgimento: dobbiamo, infatti, scaricare il plugin di Photoshop che supporta i file .ico. L’operazione è gratuita, e da ora in poi, dopo aver installato il plugin, potremo sia aprire che salvare file in questo formato. Una volta installato il tutto, possiamo iniziare con la creazione dell’icona vera e propria.
16×16 pixel è probabilmente una grandezza troppo piccola per iniziare a lavorare. Per questo, vi consigliamo di iniziare un nuovo file di grandezza 64×64 pixel con 72 di risoluzione. In questo quadrato appena creato (per ingrandirlo ovviamente usiamo la lente d’ingrandimento) possiamo iniziare a incollare il nostro logo, oppure a creare una piccola scritta o – ancora – a inserire un simbolo. Una volta contenti del nostro disegno, andiamo a “Immagine > Dimensione immagine” (“Image > Image Size”) e cambiamo la dimensione a 16×16 pixel. Prima di confermare, andiamo dove dice “Resample image” e scegliamo “Bicubic sharper” (se disponibile nella vostra versione di Photoshop).
A questo punto, una volta ridotta l’iconcina, salviamo con nome e come formato, ovviamente, scegliamo Windows Icon (ICO). Una volta pronta l’immagine, non ci resta altro che metterla online nel nostro sito. Innanzitutto, rinominiamola “favicon.ico”, dopodiché facciamo un upload e posizioniamola nella stessa cartella dove c’è il file principale (solitamente “index.htm” o “index.html” o “index.php”). Dopodiché apriamo il file principale, e all’interno del tag
E il gioco è fatto!
<head> e </head> inseriamo la stringa:<link rel="Shortcut Icon" href="/favicon.ico"></link>E il gioco è fatto!
#1GH
e per Gimp? Il niente & il nulla?
#2Micheluzzo
Molto molto interessante!! Ce provo.
#3flux
mah guarda… gimp le fa già tutte queste cose, salva in ico, fa il resize ecc
#4nikkio
bello! spendere 1000 euri per un programma e fare le emoticon…. qualcosa di più economico no?
chessò il paint.net, il gimp… cene sono decine e gratis!!
#5huejuice
Lo uso spesso questo plug!
#6angelo
Scusate l’ignoranza, ma qualcuno può dirmi qual è il percorso per trovare la ‘cartella dove c’è il file principale (solitamente “index.htm” o “index.html” o “index.php”)’
Io ho firefox, ma nella cartella del programma (C/programmi/mozilla firefox) non vedo nessuna cartella ‘index’. Dove sbaglio?
Grazie
#7angelo
Grazie della risposta (che non ho avuto). Ho risolto comunque
#8Darth Master
@ nikkio:
basta scaricarlo -.-
#9Nikopolidis
Grazie per il post, mi è stato utile nell’inserire la Favicon per il mio sito 🙂