Het is een belangrijk onderdeel van een website, maar toch wordt het vaak vergeten: de favicon. Dit is de afbeelding die naast de naam van de site in het tabblad van de browser staat. Waarom is dit eigenlijk belangrijk? Hoe kun je zelf een favicon maken? Je leest het in dit artikel.
Wat is een favicon?
Grote kans dat je er nog niet eerder van hebt gehoord. Als je allemaal verschillende tabbladen hebt openstaan op je website, dan zie je verschillende afbeeldinkjes in die tabbladen naast elkaar verschijnen. Dat zijn de favicons.
Waarom heb je een favicon nodig?
Een favicon is een belangrijk onderdeel van de site-identiteit. Het laat meteen iets zien van jouw bedrijf of organisatie. Denk aan vormen en kleuren. Hoe klein het ook is, de bezoeker vangt direct een glimp van je website op. En daarmee ook van jouw merkidentiteit of brand identity.
De favicon staat ook broederlijk naast de tagline. Dat is het stukje tekst wat naast de favicon verschijnt. Dat zijn vaak maar enkele woorden, omdat er niet veel tekst in een tab past. Vaak zie je niet de hele tekst, maar zodra je er met je cursor overheen schuift, verschijnt de hele tagline. In het geval van deze website kun je zien dat de auteur van dit artikel zowel webdesign als fotografie levert.
Soms verschijnt de tagline in een top header, bovenaan een website. Wil je weten hoe je dat kan maken? Lees dan hier hoe je een header met het thema en de bouwer Divi maakt.
Uit welke favicons kan je kiezen?
Sommige mensen houden van strakke, duidelijke, afgelijnde favicons. Weer anderen zetten daar een foto of hun volledige logo neer. Je uiteindelijke keuze hangt volledig af van jouw eigen situatie.
Deze mogelijkheden kom je vaak tegen:
- Volledige logo: handig als je een eenvoudig logo hebt. Is je logo ingewikkelder, dan kun je daar ook voor kiezen. Maar hou er rekening mee dat het niet zo goed zichtbaar gaat zijn.
- Ingekort logo: sommige logo-ontwerpers leveren ook de “mark”, dat is een verkorte versie van het logo. Dat kan een stijlvol ontworpen letter of een afbeelding zijn.
- Een foto: dit kan voor zelfstandige ondernemers, maar ook hier moet je er rekening mee houden dat de favicon minder goed zichtbaar is.
- Een eigen ontworpen favicon: hierin kan je de kleuren en eventueel de initialen terug laten komen, al dan niet in hetzelfde lettertype als het logo.
Hoe kom ik aan een favicon?
Gaat het om een volledig logo of een foto? Dan heb je al een favicon. Wil je het grafisch aanpakken? Dan kun je overwegen om het uit te besteden aan een graphic designer of grafische vormgever. Geef die persoon dan duidelijk de instructie dat je zowel een logo als favicon wilt.
Hoe plaats ik mijn favicon in WordPress?
Om een favicon in te stellen of aan te passen, volg je deze route:
- Log in om bij je WordPress-dashboard te komen.
- Ga naar dashboard > appearance > customizer. Of klik op “customizer” in de zwarte balk bovenaan in je WordPress-balk.
- Ga dan naar general settings > site identity.
- Onder “site icon” kun je je favicon uploaden of aanpassen.
- Tevreden? Klik op “publish”.
Nog geen WordPress-gebruiker en twijfel je tussen twee websitebouwers? Lees dan hier wat beter voor jou is: Wix of WordPress.
Hoe maak ik zelf een favicon?
Je kan dit eenvoudig zelf doen. We gaan er hier van drie verschillende scenario’s uit.
Scenario 1: een logo als favicon
Dan hoef je enkel bovenstaande stappen te volgen en je logo up te loaden. Dit werkt als je logo binnen het vierkante formaat van de favicon past. Is dat niet het geval, dan raad ik je aan om naar scenario 3 te gaan.
Scenario 2: een foto als favicon
Ook hier hoef je enkel bovenstaande stappen te volgen en de foto up te loaden. Dat gaat goed, zo lang je foto vierkant is. Of als je uitsnede binnen het vierkant formaat van de favicon past. Lukt dat niet, ga dan naar scenario 3.
Scenario 3: zelf een favicon met tekst maken
Wat eigenlijk altijd werkt, is gebruik maken van de gratis tool favicon.io.
Je gaat als volgt te werk:
- Surf naar favicon.io.
- Kies voor de optie “tekst > ICO”. ICO is trouwens een formaat voor computerpictogrammen.
- Voer je tekst in met één of twee letters.
- Stijl je letters in het lettertype van je logo en / of website. Denk ook aan lettergrootte, probeer ervoor te zorgen dat het duidelijk blijft.
- Stijl je letter- en achtergrondkleuren. Het is raadzaam om dezelfde hoofdkleuren te gebruiken als op je website. Dat doe je door de kleurcode op te sporen en deze te kopiëren en te plakken in favicon.io.
- Ben je tevreden met resultaat? Klik dan op “download”.
- Je krijgt een ZIP-file, zet dit op je bureaublad en open het.
- Kies in het mapje het bestand voor de browser Google Chrome dat uit 512 bij 512 pixels bestaat, dat herken je in de bestandsnaam.
- Plaats het op je WordPress-website via de eerdergenoemde stappen.
Op zoek naar nog meer tips om een geweldige website te bouwen? Ontdek dan hier hoe je met fotografie en vormgeving een prachtige site maakt!
Conclusie
Hoewel het vaak vergeten wordt, is de favicon heel belangrijk voor je site. Het zorgt dat je herkenbaar blijft in die wirwar van tabbladen die openstaan. Je kan dit uitbesteden aan een grafisch vormgever of webdesigner, of het eenvoudig weg zelf doen.