Il seguente post spiega come impostare una favicon sul proprio sito/blog.
Questa mini-guida si divide in 3parti:
- Creazione di una favicon utilizzando uno tra i tanti strumenti disponibili online;
- Impostazione della favicon sulla pagina principale del sito;
- Validazione della favicon.
Prima di iniziare una piccola spiegazione :
“Favicon è un termine inglese, contrazione di favorites icon. Solitamente è una piccola immagine (16×16, 32×32), spesso un logo, pertinente ai contenuti del sito web correlato. La favicon viene visualizzata alla sinistra dell’URL nella barra degli indirizzi di un browser, nel momento in cui si naviga un sito che ne è provvisto. L’icona è inoltre visualizzata nel menu dei preferiti di un browser.” (from Wikipedia)
Per creare una favicon esistono diversi tool online che facilitano il compito ai non esperti di grafica. Tra i più funzionali e semplici:
- favicon.cc : forse è il servizio più duttile e concreto, permette di creare favicon a partire da zero disegnando su una griglia oppure da immagini. Si possono creare anche favicon animate. Inoltre il sito contiene una vasta raccolta di elementi generati dagli utenti;
- Genfavicon : permette di caricare un immagine dal disco o di prelevarla ad un url, di farne il cropping (ritaglio) e quindi di ottenere l’icona;
- FavIcon from Pics : consente la creazione di favicon animate e non, con l’aggiunta di testo scorrevole;
- favikon : come il precedente permette caricamento, crop e icona;
Una volta ottenuta la favicon la carichiamo sul webserver del nostro sito oppure recuperiamo l’indirizzo se viene conservata su un servizio di Hosting.
Per installare la favicon dobbiamo inserire all’interno dei tag <head> </head> della pagina web le seguenti linee di codice:
<link rel=”shortcut icon” href=”url_favicon” />
<link rel=”icon” href=”url_favicon” />
dove url_favicon è l’indirizzo della vostra icona
(es. http://www.esempio.com/images/favicon.ico).
Ricordate che l’immagine può essere in formato ICO, PNG o GIF, di solito però viene preferito il formato .ico perchè viene letto correttamente da tutti i browser.
Infine per testare il lavoro fatto al fine di essere sicuri che la favicon è stata installata correttamente provate Favicon Validator.
Per qualsiasi dubbio, chiarimento o altro non esitate a commentare.
Approfondimenti...
Con un programma freeware è possibile personalizzare le proprie cartelle inserendo al loro interno sfondi tratti da immagini di nostro gradimento. Così come...
I repository Launchpad sono veramente comodi, permettono di installare e tenere aggiornati i software senza fatica. Aggiungerli è questione di un attimo,...
Nell’articolo “Registrare le chiamate di Skype con Scx Tools“, vi ho spiegato come registrare le chiamate di Skype sotto Ubuntu. All’epoca della...
Pochi mesi fa la Linux Foundation ha annunciato l’acquisto di Linux. com, uno dei principali portali dedicati a Linux e all’Open Source. Ieri la Linux...
Un video molto utile e chiaro che spiega cosa significa sottoscrivere i feed rss. Cosa vuol dire seguire un blog?
Commenti...
Grazie x il post.
ho fatto tutto come hai scritto tu, ho anche provato avedere con favicon validator se tutto andava bene ed era tutto ok ma la favicon non vuole farsi vedere
ho creato una favicon animata con FavIcon from Pics ma non riesco ad inserirla nel blog. Una volta effettuato il download non riesco a caricare su Imageshack il formato favicon.ico e di conseguenza non posso inserire lentrambe le linee di codice. Puoi spiegarmi per favore come fare?
Grazie…buona giornata
grazie per l’articolo, molto utile ed scritto in maniera chiara. Buon anno!
perfetto!! su altri siti non è così completo e semplice
# 16/12/2008 20:30