Usare favicon in formato GIF o PNG

di Michele Costanzo Commenta

favicon gif png in HTML
Nelle scorse settimane abbiamo visto l’importanza della favicon nel caratterizzare un sito web e favorirne la riconoscibilità. In particolare abbiamo poi analizzato il codice HTML che consente di indicare ai browser la posizione dell’icona da utilizzare con funzione di favicon.

Una favicon GIF o PNG

In questa guida vedremo come modificare il codice HTML quando si decide di utilizzare con funzione di favicon una immagine GIF o PNG in sostituzione della più “tradizionale” icona in formato ICO. Come nel caso che abbiamo già analizzato l’indicazione della favicon andrà effettuata all’interno della sezione <head> del codice HTML.

Per usare una favicon in formato GIF utilizzeremo un codice di questo tipo:
<link rel=”icon” href=”/miaicona.gif” type=”image/gif” />
Possiamo osservare che l’unica significativa variazione è rappresentata dall’introduzione dell’attributo type=”image/gif” che indica al browser il fatto che l’icona del sito è costituita da una immagine di tipo GIF.

Analogo è il caso delle favicon in formato PNG per le quali utilizzeremo un codice con questa forma:
<link rel=”icon” href=”/miaicona.png” type=”image/png” />
In questo caso in “type” viene ovviamente indicato il formato PNG.

Piccoli accorgimenti

Nei codici che abbiamo visto il parametro “href” individua il percorso relativo o assoluto dell’immagine da utilizzare come icona. Ovviamente quindi tale indirizzo andrà modificato in funzione di come è stato progetto il sito.

Anche nel caso delle favicon in formato GIF o PNG l’immagine usata può avere qualsiasi nome ma si ottiene una migliore compatibilità con in vecchi browser utilizzando rispettivamente file denominati favicon.gif o favicon.png.

Sempre nell’ottica di una migliore compatibilità con alcuni browser può essere utile collocare una icona “di default” denominata “favicon.ico” nella cartella radice del sito.

Lascia un commento

Il tuo indirizzo email non verrà pubblicato.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>