Favicon CC il miglior modo per creare la tua Favicon online

Favicon CC accetta i formati immagine JPG, JPEG, GIF, PNG, BMP, ICO e CUR.

L'editor di icone gratuito offre un selettore di colori e trasparenza. Questi ti consentono di progettare facilmente icone con sfondi colorati e trasparenti.

Inoltre, l'editor fornisce una funzione di animazione che puoi utilizzare per animare la tua favicon. Puoi decidere la durata e il numero di iterazioni dell'effetto per fotogramma.

Puoi scaricare il file ICO gratuitamente. Per ottenere lo script HTML, devi pubblicare l'icona con una licenza Creative Commons.

E importante avere una favicon sul sito ?

Il tuo sito web o blog dispone di una favicon? 

Sai, quella piccola icona che compare nella barra degli indirizzi del browser e accanto ai siti che hai memorizzato nei segnalibri. Se hai in mente di aggiungere una favicon per dar modo agli utenti di identificare meglio il tuo marchio, è arrivato il momento di farlo. E la creazione di una favicon è più facile di quanto tu possa immaginare.

 

 

Che cos'è la favicon?

Favicon sta per "Favorite Icon" (icona preferita). La favicon è una piccola icona o un identificatore visivo associato a un sito web, destinato ad essere utilizzato quando un utente inserisce un sito nei segnalibri. I browser la usano anche nella barra degli indirizzi e nelle schede.
La favicon è generalmente un disegno grafico quadrato di dimensioni 16 x 16 pixel, salvato come file .ico nella directory principale del server. è possibile creare facilmente una favicon per il tuo sito o blog utilizzando un qualsiasi programma di grafica (ad esempio Photoshop) che consente di salvare i file grafici in .ico, che sono compatibili con tutti i browser. In alternativa, ci sono tanti servizi online che permettono agli utenti di generare favicon gratuitamente.

Perché è importante avere una favicon?

La favicon è molto piccola, ma non bisogna sottovalutarne il significato. è come se tu lasciassi senza logo i tuoi biglietti da visita o le tue buste intestate, o il tuo blog senza marchio! La favicon ha esattamente la stessa funzione, offrendo una rappresentazione visiva immediata del marchio aziendale, sito web o blog.
Avere una favicon che si ricorda facilmente è importante, perché ha la capacità di distinguere il tuo sito web nella moltitudine di altri siti favoriti che i tuoi lettori hanno nei segnalibri.
Le persone che utilizzano il web regolarmente sono abituate a vedere le favicon. Anche se non conoscono il nome di queste mini-immagini, gli utenti utilizzano costantemente questi marcatori visivi per individuare i siti nei loro preferiti. Grazie a ciò, la favicon può aiutare non solo a riconoscere il marchio, ma anche a fargli acquistare credibilità. Gli utenti sono talmente abituati a vedere favicon che i siti web che non dispongono di un identificatore visivo nella barra degli URL del browser o nei segnalibri possono apparire meno credibili o affidabili. 

Come dovrebbe essere la mia favicon?

La favicon agisce come logo in miniatura e identificatore visivo immediato del tuo blog o marchio. è una piccola immagine, quindi cerca di non aggiungere troppi dettagli. Potresti utilizzare la lettera iniziale del nome del tuo blog legata al tuo logo originale, come Amazon, o puoi utilizzare l'icona chiave del marchio, come il W cerchiato utilizzato da WordPress.
Essendo progettata per riflettere il marchio, può essere non facile crearla viste le sue esigue dimensioni. Usa perciò la fantasia e fai varie prove per vedere cosa funziona e cosa no.

Come faccio a creare una favicon?

Se disponi di un'immagine e pensi di poterne ottenere una buona favicon, è possibile crearla da te stesso usando un programma di progettazione, a condizione che consenta la creazione di file .ico. Per creare la favicon, il primo passo è fare in modo che l'immagine sia quadrata. Poi dovrai ridimensionare l'immagine a 16x16 pixel e salvare il file come favicon.ico.
Se non disponi di un programma di design appropriato, puoi creare la favicon online, utilizzando uno dei generatori di favicon popolari come Favicon.cc o GenFavicon.

Come aggiungere una favicon al mio sito ?

Come aggiungerla al sito?
 
Una volta che hai un file pronto, non dovrebbe essere difficile metterlo sul server. Per poter modificare il codice HTML del tuo sito web, avrai prima bisogno di accedere allo strumento di modifica del testo e alla cartella principale sul tuo sito web. Ecco una guida rapida:

 

 

1. Carica il file pertinente sul tuo server. Quindi inserisci l'indirizzo del tuo server FTP nella barra degli indirizzi del browser. Premi il pulsante “Invio”, accedi e carica il file nella cartella principale.

2. Quindi è necessario modificare la pagina HTML del tuo sito web. Trova e scarica il file “header.php” o “index.html” dal server. Se il tuo sito è realizzato in HTML, devi inserire il codice nell'area head del file “index.html”:

<  link rel="shortcut icon" type="image/x-icon" href="http://yourwebsite.com/favicon.ico"  >

Se lavori su WordPress, inserisci il codice nell'area head del file “header.php”:

< link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" >

Questo è tutto! Sarai sorpreso da quanto sia facile.

Originariamente era sufficiente effettuare l'upload del file favicon.ico nella root del proprio spazio web. 

Oggi è consigliabile aggiungere alle proprie pagine web un'apposita linea di markup (si tratta di semplice HTML) da inserire tra i tag e :

< link rel="icon" href="/favicon.ico" / >

Se avete scelto di usare un file GIF o PNG il markup cambia leggermente.
Favicon .GIF

< link rel="icon" href="/favicon.gif" type="image/gif" / >

Favicon .PNG

< link rel="icon" href="/favicon.png" type="image/png" / >

Se usate WordPress come piattaforma di pubblicazione potete aggiungere questo markup HTML con un semplice hook (per maggiori informazioni vi invito a leggere questo post sul nostro blog).

Favicon... e errori 404
La mancanza della favicon può comportare, tra le altre cose, un inconveniente piuttosto noiso: se omettete la favicon, infatti, noterete crescere a dismisura la dimensione dell'error log del vostro sito web che si riempirà di errori 404 dovuti al fatto che i browser cercano sempre questo file navigando su un sito web e, pertanto, ogni tentativo di scaricarlo finirà col generare un errore.

Favicon... e la cache

Una precisazione doverosa: tutti i browser hanno l'abitudine di salvare in cache la favicon. Questo significa che se si carica una favicon per la prima volta, oppure si sostituisce una precedente favicon, per visualizzarla nel browser può essere necessario cancellare la cache o attendere qualche ora/giorno (a seconda delle impostazioni).

Come creare una Favicon per il sito web?

Come faccio a creare un file .ico

Come detto la favicon è un file grafico e dovrebbe rappresentare il sito web cui è associata. Questo file grafico può essere realizzato partendo da un logo (opportunamente rimpicciolito) o da una scritta (ad esempio estraendo una o due lettere del titolo).

Da un punto di vista tecnico il file può essere realizzato con un qualsiasi software di grafica (come da esempio Photoshop) e poi salvato in PNG o JPG. Una volta salvato potrà poi essere convertito in .ico utilizzando un software o un servizio ad hoc.

Limitandoci ai servizi on-line segnalo quello presente all'interno della nostra piattaforma Toolset.it: si tratta di un potente editor di favicon (basato su HTML5) attraverso il quale è possibile disegnare on-line la propria favicon partendo da zero oppure importando un'immagine preesistente.

Una volta concluso il lavoro sarà possibile salvare e scaricare il file favicon.ico da caricare sul proprio sito.

Alcuni siti per creare favicon

Puoi farlo da solo o usare un aiuto online. Non è necessario utilizzare generatori online speciali per crearne una, sebbene spesso siano abbastanza comodi e semplici. Ecco alcuni esempi di siti web che ti possono aiutare:

• Favicon Generator;
• Favicon Generator ORG;
• Dynamic Drive Favicon Tool;
• Favigen;
• Gen Favicon;
• Degraeve Favicon;

Come vedi, non hai nemmeno bisogno di un grafico per realizzarla. Tuttavia, se stai pianificando di lanciare un sito in tutto il mondo e di avere un marchio globale, probabilmente faresti bene a rivolgerti a un designer professionista per creare qualcosa di unico che corrisponda al tuo marchio. Tuttavia, se hai intenzione di farlo da solo, possono essere necessari circa 10 minuti per realizzarne una semplice: devi solo caricare il logo del tuo sito web in uno dei siti menzionati qui sopra e scaricare il file pronto. è facilissimo!

Inoltre, prova questi siti web per trovare alcune idee interessanti di favicon:

• Fresh Favicons;
• The Favicon Gallery;
• Delta Tango Bravo.

Come creare l'icona
Naturalmente per realizzare l'icona ci sono svariati e svariati programmi di grafica che consentono di salvare con l'estensione ".ico"; se si vuole utilizzare una immagine già elaborata si può procedere come segue:

* Scarichiamo il programma Free " Irfan View " o un qualsiasi programma che gestisca i file con estensione .ico;
* Apriamo l'immagine, selezionando eventualmente l'area di nostro interesse;
* Cambiamo le dimensioni in pixel a 16x16;
* Decrementiamo i colori a 256;
* Salviamo l'immagine come "favicon.ico".

Che cos'è una favicon ?

L'icona classica è un file .ICO da 16×16, con supporto a colori o trasparente a 16 o 24 bit. Molto più tardi, è apparsa nelle dimensioni 32×32, ma i browser più vecchi la riducono ancora a 16×16.

Perché ne hai bisogno? 

Oggi è una componente importante dell'interfaccia del sito web, che svolge un ruolo importante anche nelle applicazioni web avanzate.

Regole fondamentali delle favicon

 
Affinchè sia visualizzata bisogna rispettare i seguenti passi:

* Deve avere le dimensioni di 16 x 16 pixel;
* Deve usare pochi colori (max 256);
* Deve essere chiamata obbligatoriamente " favicon.ico ";
* Deve essere ubicata nella directory radice del proprio sito Web;

... e soprattutto deve essere inserita nella pagina html tra i tag HEAD col seguente codice:

< link rel="shortcut icon" type="images/x-icon" href="/favicon.ico" >

Qual è il suo scopo?

Ovviamente, è molto più semplice cercare il bookmark di cui hai bisogno, perché è più facile cercare un'icona familiare che leggere tutti i nomi dei siti web. Pertanto, il suo compito è migliorare l'esperienza dell'utente. Questa è la ragione principale per cui dovresti usarla. Oggi, puoi trovare questa popolare componente in tutti i siti web e browser moderni più famosi, nelle sue schede di navigazione. Le aziende globali hanno icone (popolari) e facilmente riconoscibili, che le aiutano a distinguersi dalla massa di altre risorse web (e sono buoni esempi di favicon a cui guardare). Senza dubbio, è uno strumento utile per siti di ogni tipo. è stata creata per una ricerca rapida e visiva, per trovare l'esatto sito web di cui hai bisogno tra migliaia di bookmark su internet, aiutando il tuo pubblico di destinazione a trovarti più veloce e in modo semplice.

Al sito web, senza un'icona identificabile personale, verrà assegnato il simbolo generico del browser, il che significa che è un must have se t'interessa diffondere la conoscenza del tuo marchio.