Hoe kan je het beste lettertype kiezen voor je website?

Hoe kan je het beste lettertype kiezen voor je website?

“Welk font of lettertype kan ik het beste gebruiken voor mijn website?”

Dat is een veelgestelde vraag bij het bouwen van een nieuwe website. Er zijn wel honderden lettertypes beschikbaar en dat maakt het heel lastig om te kiezen. Vroeger was de keuze van het lettertype veel makkelijker. Toen kon je alleen kiezen uit een paar beschikbare lettertypes, zoals  Arial of Verdana.

Omdat de keuze tegenwoordig zo groot is, wordt vaak gewoon het lettertype gebruikt dat standaard staat ingesteld bij het thema dat je gebruikt. Maar soms past dat gewoon niet bij datgene wat je wenst uit te stralen met je website. Het loont dan zeker de moeite om eens te experimenteren met andere lettertypes. Maar hoe begin je daar aan?

Gelukkig bestaan er aantal tools en tips die je kunnen helpen het beste lettertype te kiezen voor jouw website. Of het nu gaat om het tonen van een lettertype, het kiezen van een lettertype of het combineren van meerdere lettertypes, in dit artikel laat ik je zien dat werken met lettertypes makkelijker is dan je zou denken. Laten we er meteen in vliegen!

Google Fonts

Vroeger moest het gekozen lettertype aanwezig zijn op de computer van de bezoeker, anders kon dit niet worden weergegeven. Om dit te verhelpen, werden er een aantal lettertypes geselecteerd,  die worden verondersteld aanwezig te zijn op alle computers en mobiele apparaten. Dit noemen we Web safe fonts, zoals Arial, Helvetica en Verdana. 

Ondertussen kunnen we kiezen uit vele moderne lettertypes die veilig gebruikt kunnen worden. Er zijn meerdere aanbieders van webfonts op de markt. Onder andere Google stelt gratis webfonts ter beschikking. De lettertypes van Google noemen we Google Fonts en kun je snel en makkelijk gebruiken op elke website. 

Meest populaire Google Fonts

Hoe begin je nu aan je keuze voor het beste lettertype voor je website? Om je op weg te helpen, heb ik een aantal populaire fonts voor je uitgezocht. Zo krijg je een goed idee  hoe deze lettertypes eruit zullen zien op je website.  Deze fonts zijn alvast een goede keuze om mee te starten.

Op https://fonts.google.com/analytics kan je zelf zien welke lettertypes momenteel heel populair zijn:

Vervolgens kan je op https://fonts.google.com/ bekijken hoe een bepaald Google Font er uit ziet. Je kan zelf de tekst vervangen om te zien hoe jouw stukje tekst er uit zal zien in een bepaald lettertype. 

Ik zet hieronder de 10 meest gebruikte Google Fonts van het afgelopen jaar even voor je op een rijtje:

1. Roboto

Roboto

2. Open Sans

3. Lato

4. Slabo 27px

5. Oswald

Roboto

6. Roboto Condensed

7. Source Sans Pro

8. Montserrat

9. Raleway

10. PT Sans

Ideetjes stelen van andere websites

Je kan ook altijd inspiratie opdoen door eens wat te gaan surfen naar andere websites. Het kan zijn dat je daar een lettertype tegenkomt dat je mooi vindt. Gelukkig zijn er een aantal manieren waarmee je kan achterhalen welk lettertype er op een bepaalde website gebruikt is.  

  1. Maak eerst een printscreen van een stukje tekst waarvan je het lettertype wil weten. Ga naar What The Font en laad daar de afbeelding op. WhatTheFont vertelt je meteen welk lettertype gebruikt is. Wordt het gewenste font niet gevonden, dan reikt WhatTheFont alternatieven aan die het meeste in de buurt komen.
  2. Als je Google Chrome als browser gebruikt, kan je de Google Chrome extension Font Picker installeren. Als je dan een bepaald lettertype wilt achterhalen, dan klik je met je rechtermuisknop op de tekst en kies je Font Details. Er verschijnt dan een scherm met alle gegevens over dat lettertype:

Meerdere lettertypes combineren

Vaak wordt hetzelfde lettertype voor zowel de tekst als voor de koppen en tussenkopjes gebruikt. Maar dat hoeft niet noodzakelijk. Om het interessant te maken, kan je een ander lettertype gebruiken voor de platte tekst en de kopteksten.

De kopteksten zijn de kopjes die boven de tekst staan. Ze mogen goed opvallen, dus lekker groot zijn. Je wil immers dat de bezoeker snapt wat in de onderstaande tekst geschreven is en het breekt de tekst op in stukken waardoor het sneller gelezen gaat worden.  

Platte tekst is de tekst die hier geschreven is. Het belangrijkste is dat deze goed leesbaar is. Als dit niet het geval is, haken mensen snel af. Hoe zorg je dat het goed leesbaar is? Door een juiste grootte te gebruiken, een ruime regelafstand te gebruiken en als laatste de tekst niet over de volledige pagina breedte te laten lopen, maar slechts over een deel van de pagina.  Tegenwoordig zie je steeds vaker dat er voor de inhoud een groter lettertype wordt gebruikt met een grote regelafstand. Dit maakt de tekst overzichtelijker en beter te scannen. 16px en zelfs 18 px is tegenwoordig geen uitzondering meer.

Wil je twee lettertypen combineren dan moet je goed nadenken over wat je hiermee wilt bereiken. Ga je voor harmonie of juist voor een mooi contrast? Kies je voor een mooi contrast waarbij je een moderne letter combineert met een klassieke letter of kies je voor een ander contrast? Een harmonieuze combinatie kan ook erg mooi zijn. 

Op https://fontpair.co/ kan je heel wat voorbeelden van combinaties zien:

Ook op https://www.canva.com/font-combinations/ kan je zoeken naar combinaties van lettertypes. Je vertrekt hier van een bepaald lettertype en krijgt dan een heleboel mogelijke combinaties voorgeschoteld, telkens met een voorbeeld van een bestaande website.

Google Fonts gebruiken op je WordPress website

Hopelijk heb je nu al een beter idee van de lettertypes die je wilt gaan gebruiken op je website! Nu is het enkel nog een kwestie van ze te tonen op je website. Het grote voordeel van Google Fonts is dat deze vaak al geïntegreerd zitten in een WordPress thema. Je kunt dan makkelijk in een website bij de instellingen van het thema het lettertype van Google fonts instellen. Laten we eens kijken hoe dat zit bij DIVI, het thema dat ik meestal gebruik voor mijn websites.

Nadat je inlogt op je WordPress website, ga je in het dashboard naar DIVI > Theme Customizer. 

Vervolgens ga je naar General Settings > Typography:

Bij Header font en Body font kan je nu het standaard lettertype kiezen voor je kopteksten en je platte tekst. Als je op het pijltje achteraan klikt, zal je zien dat er keuze is uit een grote hoeveelheid fonts. Je kan hier elk lettertype dat Google Fonts beschikbaar stelt, gebruiken. Als je je lettertype hebt gekozen, klik je bovenaan op Publiceren. De tekst en kopteksten van je website zullen nu in dit standaard lettertype worden weergegeven. 

Kun jij in jouw WordPress thema geen Google fonts installeren? Dan kan je nog altijd de plug-in Google Fonts for WordPress installeren. Via deze plug-in heb je ook allerlei mogelijkheden om het lettertype aan te passen. 

Conclusie

Lettertypes zijn een belangrijk, maar vaak onderschat onderdeel van je website. Zorg er voor dat je lettertype goed leesbaar is en niet teveel afleidt.  Met behulp van bovenstaande tips kan je zelf op zoek naar het beste lettertype voor je website.

Heb je toch nog twijfels? Neem dan contact op en ik help je graag verder.

 

Disclaimer: Sommige links zijn affiliate links, dat betekent dat ik een klein bedrag krijg als jij via die link overgaat tot een aankoop. 
Jij betaalt hiervoor echter totaal niets extra.

[crp]

Hulp nodig bij het beheer van je website?

Springweb

Ontwikkelt en beheert WordPress websites.

Algemene voorwaarden | Disclaimer | Privacyverklaring

© 2019 Alle rechten voorbehouden. Webdesign Springweb.

CONTACT

Korenbloemlaan 23
2980 Zoersel
België
E-mail: info@springweb.be
Tel: 0474/71.83.01
BE 0678.789.568

Download de gratis checklist

Download de gratis checklist, druk hem af en start met het verzamelen van het nodige materiaal.  Als alles afgevinkt is, bezorg je het nodige materiaal aan je webdesigner!

Creëer samen een website die voldoet aan al jouw doelen en wensen!

Bedankt!

Klaar om een nieuw webproject te starten?


Download en vul de vragenlijst in en neem hem mee in het eerste contact met je webdesigner.

Bedankt! Je vragenlijst komt er zo aan!

Pin It on Pinterest