De favicon is het icoontje dat je ziet in het tabblad van een geopende website. Veel websites hebben een gepersonaliseerde favicon, maar lang niet allemaal. Zonde, want het implementeren van de favicon is in principe zo gedaan en zorgt voor herkenbaarheid en een professionele uitstraling.
Een favicon toevoegen (of wijzigen) aan je website? In dit artikel vertellen we je meer over het waarom en hoe!
Hoe herken je een favicon?
Als je naar je openstaande tabbladen kijkt dan zie je verschillende iconen en logo’s. Deze staat vóór de meta title. Bij onze website zie je bijvoorbeeld ons logo van The Content Case. Doe je een zoekopdracht in Google, dan zie je het herkenbare ‘G-logo’ als favicon.
Stel je geen favicon in, dan wordt er automatisch een symbool toegevoegd. Dat is standaard een grijze wereldbol. Maak je bijvoorbeeld een website in WordPress zonder de favicon in te stellen, dan wordt het WordPress-logo gegenereerd.
Voordelen Favicon instellen
Zo’n automatische WordPress favicon is natuurlijk minder wenselijk. Je bezoekers moeten focussen op jou als bedrijf, niet op het platform waarop de website is gemaakt. Favicon voordelen:
- Professionelere uitstraling.
- Icoon zorgt voor herkenbaarheid en branding van je website/bedrijf.
- Website is in een favorietenlijst gemakkelijker terug te vinden: favicon = favorite icon.
Hoe kies je een favicon voor je website?
Een favicon van je logo past goed bij je uitstraling. Heb je een logo met veel tekst? Kies dan alleen het symbool uit je logo of de eerste letter, want de favicon wordt klein weergegeven. Het moet immers professionaliteit uitstralen, geen warboel.
- Zorg dat de favicon in een vierkant past.
- Een transparante achtergrond en het gebruik van opvallende kleuren wordt over het algemeen als visueel aantrekkelijker ervaren.
- Grijs logo? Houd rekening met de lichtgrijze tabbladkleur in browsers, je favicon mag niet wegvallen in de achtergrond.
Bewegende favicon gif
Het is ook mogelijk om een bewegend favicon gifje te plaatsen. Zo’n geanimeerde favicon is absoluut creatief, maar is het ook goed voor de user experience? De meningen zijn verdeeld, zo blijkt uit fora.
Voorstanders vinden het een leuke manier van opvallen. Tegenstanders zien vooral nadelen: ‘Het lijkt op die manier alsof de website steeds maar aan het laden blijft. Bovendien leidt het bezoekers af van de website zelf. Zij moeten zelf kunnen kiezen of zij bewegend beeld willen zien, dat mag niet opgedrongen worden. Kortom, irritant en niet wenselijk’.
Denk je er toch over om dit te doen, dan moet je goed overwegen of dit past bij je bedrijf, producten of diensten. Na plaatsing kan een onderzoek uitwijzen of bezoekers dit als storend ervaren. Twijfel? Met een normale favicon zit je zeker safe.
Bestand omzetten met favicon generator
Ben je eruit welke favicon je gaat gebruiken? Dan kun je deze omzetten naar een .ico-bestand. Browsers herkennen dit bestand bij het genereren van de tabbladen.
Je kunt een favicon maken met Photoshop. Tevens zijn er verschillende gratis favicon generators, zoals Favicon Generator en Favicon.cc. Bestand uploaden, genereren, downloaden en klaar!
Favicon instellen
Nu je het .ico-bestand hebt gegenereerd is het tijd om de favicon in te stellen op je website. Dat is in principe zo gebeurd. Je doet het eenmalig, waarna het icoon automatisch op alle pagina’s van je website verschijnt.
Je kan de favicon toevoegen aan de code door het .ico-bestand te uploaden naar de root directory van je server. Soms duurt het enkele dagen voordat het icoon zichtbaar is.
Een CMS biedt daarnaast vaak de mogelijkheid om deze via het menu te uploaden. In WordPress kan dat bij de meeste thema’s bijvoorbeeld via de WordPress Customizer > Site-identiteit. Heeft je CMS geen automatische optie, dan biedt een favicon plugin uitkomst. Kom je er zelf niet uit? Dan helpen we je graag.
Favicon toevoegen, doen!
Zoals je hebt kunnen lezen is een favicon niet verplicht, maar biedt het toch een aantal voordelen en dat voor kleine moeite. Een quick win als je het aan ons vraagt. Ga aan de slag met je branding en laat zien wie je bent, succes!