Creiamo icone con favicon-generator

favicon URL Avete mai notato che nella barra dell’URL del vostro browser, ogni tanto compare un’iconcina diversa a seconda del sito che si stà visualizzando?

Bene quest’icona delle dimensione di 16×16 pixel si chiama favicon e può essere inserita in qualsiasi sito con una sola riga di codice.

Per crearla ci sono diversi modi:

  1. Vi comprate un programma per disegnare icone – :(
  2. Vi scaricate un programma freeware per disegnare icone – :(
  3. Oppure usate dei comodi servizi web gratuiti come favicon-generator:D

Il servizio totalmente gratuito e privo di registrazione, vi consente d’importare immagini da riadattare ad icone, oppure di disegnarvele voi stessi.

Favicon-generator

La scermata di presentazione è la seguente:

FaviconGeneratornella quale potrete caricare un’immagine dal vostro disco fisso e convertirla in icona, scegliendo di mantere le proporzioni dell’immagine, oppure di aggiungerla alla galleria delle icone.

Io le cose amo farle da me, quindi vi ho disegnato un piccolo Super Mario come iconcina utilizzando l’editor:

EditorNella schermata potrete eseguire diverse operazioni quali:

  • Selezione della cromatura
  • Disegno
  • Selezione automatica del colore
  • Gomma
  • Ripristino immagine
  • L’ultima opzione consente di aggiungere l’icona alla galleria delle immagini del sito

Una volta ultimato il disegno premiamo su Create Favicon, e il servizio ci consentirà di scaricare l’icona su disco.

Favicon-generatorCi verrà inoltre ricordato come si inserisce la favicon nel nostro sito internet, infatti bisognerà utilizzare il seguente tag all’interno dell’head del documento HTML, in questo modo:

<html>
<head>

<link rel=”shortcut icon” href=”http://www.VostroSito.com/favicon.ico”>

</head>

<body>

</body>
</html>

Ovviamente l’icona la dovete caricare su server nella stessa cartella dove avete la index page, in modo tale da non dover modificare il pathname per trovare l’immagine!

Favicon-Generator è un servizio 2.0 gratuito, veloce, intuitivo e molto leggero che non richiede competenze di programmazione, ma solo un pò di fantasia! E voi la vostra icona come l’avete creata?

Altri articoli correlati:

Alberto Trussardi

Alberto Trussardi è un Web Designer Freelance di Bergamo. Studentre universitario presso il Dipartimento di Scienze Informatiche dell'Università degli Studi di Milano. Ama la grafica e tutto quello che gravita attorno al design, informatica e web.
Ti è piaciuto l'articolo?

Puoi seguire tutti gli aggiornamenti del blog iscrivendoti gratuitamente ai Feed Rss!
  • Feed

  • Cosa sono

  • Reader

Se vuoi puoi condividerlo su:

Puoi trovare articoli simili in: Servizi Web, Web 2.0, Web Design

6 COMMENTI

  • Federico
    19 giugno 2009

    Ottimo servizio, non sapevo che si potesse personalizzare la barra dell’URL ..

  • Roberta
    19 giugno 2009

    Per WordPress è uguale oppure c’è qualche tag diverso?

    • Alberto
      19 giugno 2009

      Prova con questo, <link rel=”shortcut icon” href=”< ?php bloginfo('template_url'); ?>/favicon.ico” /> così vai in automatico all’interno del Template caricato e ti prende l’icona che inserisci.

      Ovviamente l’icona la devi mettere su server dove c’è la index del template.

      risposta a:  Roberta
  • Roberta
    20 giugno 2009

    Scusa era già inserito nel template, effettivamente la prende in automatico, basta chiamarla favicon.ico … Grazie mille!!!! :D

  • Emanuele
    20 giugno 2009

    Sicuramente una cosa poco nota, ma decisamente interessante. Inoltre risci a spiegare le cose anche a gente digiuna di informatica come me XD

LASCIA UN COMMENTO pesonalizza il tuo avatar registrandoti su gravatar.com