Maak een favicon

5 March, 2008

in Gebruiksvriendelijkheid

Gebruik een favicon

faviconEen favicon helpt je bezoeker om jouw site te herkennen. Het is een klein icoontje dat in de adresbalk van je browser staat.

Ook als een bezoeker je site in zijn favorieten zet zal het icoontje zorgen dat je site makkelijker herkenbaar is in zijn of haar lijst met favorieten

Hoe zet je een favicon in je website?

Ook al is een favicon een "must have", heel veel websites hebben er nog steeds geen. Gelukkig is het heel makkelijk om snel een favicon toe te voegen via de volgende stappen.

  1. Maak een icon of logo van 16x16 of 32x32 pixels.
  2. Noem het bestand "favicon.ico".
  3. Upload het plaatje naar je website.
  4. Zet de volgende code tussen je <head> en </head> tags. Zorg dat je het adres van het plaatje invult.

    <link rel="shortcut icon" href="http://url-to-the-favicon/favicon.ico" type="image/x-icon">

Als je een Wordpress website hebt dan kun je het bestand favicon.ico direct in de hoofd directory van je theme zetten. Vervolgens zorg je met de volgende code dat Wordpress zelf de juiste directory opzoekt.

<link rel="shortcut icon" href="<?php bloginfo('stylesheet_directory');?>/favicon.ico" type="images/x-icon">

Als dit allemaal te technisch is dan kun je ook de favicon manager wordpress plugin gebruiken. Je kan het bestandje nu vanaf je dashboard toevoegen.

Hoe maak je een favicon

Uploaden is het makkelijke gedeelte. Het maken van icoon of favicon is de volgende uitdaging.

Gelukkig zijn er verschillende websites die je helpen met het maken van een favicon.

Voor het professionele werk zijn er ook speciale software producten.

Voor de luie webmasters zijn er ook websites die kant en klare favicons ter download aanbieden.

Update: animated favicons

Bijna de animated favicons vergeten. Alhoewel dit naar mijn weten alleen mogelijk is bij Firefox browsers misschien toch interessant om te vermelden. Het is mogelijk bewegende plaatjes te gebruiken op dezelfde manier als een normale favicon. Het bewegende plaatje zie je dan terug in je adresbalk, tabje of lijstje favorieten.

Je gebruikt de code hierboven en verandert eventueel de naam en de extensie van het bestand. Je hoeft niet per se een .ico bestand te gebruiken. Een .gif werkt net zo goed.

Op de volgende website kun je gratis animated favicons downloaden.

Blijf op de hoogte

Vond je deze informatie interessant, zorg dan dat je het laatste nieuws en de beste kortingen via onze nieuwsbrief ontvangt. Schrijf je nu in >>>

Je kan je natuurlijk ook op onze RSS feed inschrijven en het nieuws volgen via je eigen RSS Reader.

{ 1 trackback }

Wwohn : Maak van je logo een link naar je homepage
03.25.08 om 18:51

{ 3 reacties }

Liesbeth 28.03.08 om 14:36

Hallo Oeroek,
Hartelijk dank voor de tip. ik ga de plugin zeker installeren want het is echt handig! Dit log is trouwens ook erg goed en volledig over hoe je een favicon maakt. Ik zet je wel in mijn favorieten bij del.isio.us

Anouk 16.08.08 om 14:20

Hi,
Ik gebruik
http://www.mobilefish.com/services/favicon/favicon.php om mijn favicons te maken.

Webdesign Roosendaal 20.02.10 om 15:45

Hallo,

stiekem sta ik ervan te kijken dat je niet dé plugin voor favicons in dit lijstje hebt geplaatst! Check eens http://www.telegraphics.com.au/sw/. Daar kun je een plugin voor Photoshop downloaden, waarmee je direct zelf .ico bestanden kan aanmaken. Ontzettend handige tool, ik gebruik hem altijd.

Previous post:

Next post: