Een Favicon maken

Het kleine pictogram dat je in de browser vaak links naast het webadres ziet staan heet een Favicon.
Dat is eigenlijk een plaatje van 16 bij 16 pixels dat je kunt maken in Photoshop. Als je vervolgens dit plaatje naar de server upload en een bepaalde code in je website zet zal het verschijnen.

Een Favicon maken in Photoshop.
Om in Photoshop een Favicon te kunnen maken heb je een plugin nodig. Deze download je hier.

  • Sla het zip-bestand op, op je harde schijf.
  • Pak het zip-bestand uit.
  • Kopieer het bestand ICOFormat.8bi naar de plugins directory van Photoshop (in de map file formats)
  • Herstart Photoshop en je kunt er mee aan de slag.
  • Maak een nieuw bestand via bestand > nieuw.
  • Maak het bestand 16 px breed en 16 px hoog.
  • Zet linksonder in je scherm de weergave even op 500% om beter te kunnen zien wat je doet.
  • Nu kun je een plaatje maken. Geef de Favicon bijvoorbeeld de achtergrond rood met behulp van het emmertje en zet er witte letters
  • Sla het bestand op als favicon.ico
  • Klaar is je Favicon!

Een Favicon maken zonder Photohop
Voor het maken van een Favicon kun je ook bijvoorbeeld Icon Art gebruiken. Dat is hier gratis te downloaden.

De Favicon gebruiken

  • Upload de Favicon naar de root van je website, dat is waar ook je index staat.
  • Zet tussen de head-tags de volgende code:
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />