In ons vorig blogbericht hebben we je verteld waar je op moet letten bij het kiezen van een font voor jouw website of blog. Vandaag willen we het met je hebben over correct gebruik van fonts op websites. Aan de hand van voorbeelden laten we je zien wat je kunt doen om ervoor te zorgen dat jouw website perfect leesbaar is en dat bezoekers niet opgezadeld worden met een hoofdpijn van bijbelse proporties. Dit is een lesje WordPress typografie voor beginners.
WordPress typografie is niet moelijk
Typografie gaat over het opmaken, vormgeven, zetten en drukken van tekst. Het richt zich op zowel de leesbaarheid als de vormgeving van teksten in tijdschriften, boeken en advertenties, maar ook op websites, verkeersborden etc. Zoals veel zaken in het leven is ook typografie onderhevig aan trends én persoonlijke smaak. Typografie bepaalt voor een groot gedeelte hoe bezoekers jouw website ervaren. Slecht leesbare teksten kunnen resulteren in het feit dat bezoekers niet de moeite nemen om jouw website te lezen of jouw website vroegtijdig verlaten.
Lettergrootte
Als je kijkt naar hoe websites er een jaar of tien geleden uit zagen, dan valt het op dat men vaak kleine letters gebruikte. Als je dat vergelijkt met websites anno 2019 dan kun je concluderen dat een wat grotere letter beduidend gemakkelijker te lezen is. Ga daarom voor een lettergrootte van minimaal 14px tot 16px voor de hoofdtekst van jouw website.
Regelafstand
Regelafstand is een belangrijk onderdeel van WordPress typografie. Voldoende regelafstand zorgt ervoor dat jouw ogen weinig moeite hoeven te doen om de informatie op te nemen. Zeker met grote paragrafen tekst doe je er goed aan om de regelafstand te vergroten.
Contrast
Contrast is het verschil tussen tegenstellingen. In dit geval bedoelen we het verschil tussen de voorgrondkleur en de achtergrondkleur. Wanneer het contrast te laag is, raken de letters verloren in de achtergrond en zal de bezoeker zijn uiterste best moeten doen om de tekst te kunnen lezen. Voldoende contrast zorgt voor een prettig leesbare tekst.
Leesbaarheid
Als we het hebben over de ‘body text’ dan hebben we het over het onderdeel dat het grootste gedeelte van jouw website in beslag neemt. Dit is de normale ‘hoofdtekst’, die je op iedere pagina van de website kunt vinden. Hoewel het tegenwoordig mogelijk is om hippe fonts te gebruiken op jouw website, doe je er goed aan om een makkelijk leesbaar en neutraal font te kiezen. Het belangrijkste is immers dat bezoekers de tekst daadwerkelijk kunnen lezen.
Kleurencombinatie
Pizza is lekker en satésaus is lekker, maar als je satésaus over een pizza gooit dan wordt het toch minder lekker. Dat geldt ook voor kleuren. Sommige kleuren laten zich gewoonweg moeilijk combineren. Enkele kleurencombinaties in de categorie ‘zum kotzen’ zijn: oranje/groen, rood/paars, bruin/zwart en rose/oranje, waarvan je hieronder een voorbeeld kunt zien.
Lettergewicht
Hoewel van veel fonts alleen de varianten regular en bold voorhanden zijn, kennen professionele fonts veel verschillende lettergewichten. Je kunt hierbij denken aan ultralight, light, thin, regular, italic, medium en bold. Als je serieus aan de slag wilt gaan met WordPress typografie, dan doe je er goed aan om een font te kiezen met een ruime keuze aan gewichten en te bepalen welk gewicht geschikt is voor jouw tekst.
Accenten
Een stuk tekst dat dikgedrukt, schuingedrukt of onderstreept is of een uitroepteken bevat, zal meer aandacht vragen van de lezer. Maar pas hiermee op. Want op het moment dat je teveel van deze accenten gebruikt, wordt de tekst rommelig en verdwijnt de focus van de lezer.
Marges
De marge is de witruimte om een stuk tekst heen. Dat kan bijvoorbeeld de ruimte zijn tussen de tekst en een kader of tussen de tekst en de rand van het beeldscherm. Door te zorgen voor voldoende marges kan de tekst ‘ademen’ en zal deze gemakkelijker te lezen zijn.
Achtergrondafbeeldingen
Kijk, we snappen het wel. Een foto van een ondergaande zon op de achtergrond van jouw reisblog kan best sfeerverhogend werken. Maar we zien het in de praktijk maar al te vaak dat een dergelijke achtergrondafbeelding ten koste gaat van de leesbaarheid van de tekst. Als je toch persé een achtergrondafbeelding wilt gebruiken, zorg dan voor voldoende contrast.
Fontcombinaties
Door gebruik te maken van verschillende lettertypes kan een webpagina een stuk interessanter worden. Het is dan wel zaak dat je lettertypes selecteert die daadwerkelijk bij elkaar passen. Zo moeten de fonts elkaar aanvullen, maar tegelijkertijd moeten ze toch voldoende van elkaar verschillen. Gelukkig zijn er tal van sites te vinden die jou kunnen helpen bij de keuze van de juiste fontcombinaties. Kijk maar eens op: deze site, deze site, deze site of deze site.
Tot slot
Er is natuurlijk nog veel meer te vertellen over WordPress typografie. Toch hopen we dat we je met dit blogbericht op de goede weg geholpen hebben. Wil je dat we eens met een kritische blik naar jouw website kijken? Laat het ons weten.
