Hoe moet ik mijn content opmaken?

Content is king. Maar als je content erbij loopt als een pauper, wordt deze niet serieus genomen. De opmaak van je content kan namelijk invloed hebben op hoe de bezoeker zich voelt. Hier kun je voor zorgen door het juiste lettertype te kiezen met de juiste grootte en de lengte van je regels te beperken tussen de 50 en 75 karakters.

Dat de opmaak van je content invloed kan hebben op hoe een bezoeker zich voelt, blijkt uit een studie van Kevin Larson en Rosalind Picard van de MIT. Zo schrijven zij in hun conclusie:

"From these studies we have both discovered methodologies for measuring affect differences and that high quality typography can improve mood."

Betere typografie kan leiden tot een beter gevoel bij jouw bezoekers. Maar wat is betere typografie?

Welk lettertype moet ik kiezen?

Lettertypes zijn in te delen in vier verschillende categorieën:

Serif

Deze lettertypes hebben extra lijntjes aan de uiteindes van elke letter. Dit lettertype wordt vaak gebruikt voor kranten en boeken. Grappig om te weten is dat het woord serif wereldwijd gebruikt wordt, maar volgens de 'Webster Dictionary' zijn oorsprong kent in Nederland. Serif zou namelijk afgeleid zijn van de oud hollands woorden 'schreef' (lijn, streep) en 'schriven' (schrijven).
Voorbeelden zijn: Times New Roman en Georgia.

Deze tekst is geschreven met het serif lettertype 'Times new Roman'.

Sans serif

Deze lettertypes hebben juist geen extra lijntjes aan de uiteindes van de letters maar zijn juist zo strak mogelijk.

Deze tekst is geschreven met het sans serif lettertype 'Arial'.

Script

Bij deze lettertypes lijkt het alsof ze met de handgeschreven zijn.

Decoratieve lettertypes

Dit zijn lettertypes die niet in de drie bovenstaande categorieën voorkomen, omdat ze bedoeld zijn om te gebruiken als decoratie. Het is niet verstandig een dergelijk lettertype te kiezen voor de opmaak van grote stukken tekst.

Deze tekst in geschreven met het decoratieve lettertype 'Impact'.

Grote stukken tekst, die meestal de 'body' genoemd worden, kun je het beste tonen met een serif of een sans serif lettertype. Sinds het ontstaan van het web is er een discussie gaande over welke van de twee beter is voor websites. Voorheen was de keuze voor een serif lettertype meestal niet bevordelijk voor de leesbaarheid van een website. Omdat we vroeger werkten met schermen met een lage resolutie (mindex pixels per oppervlakte), zorgden de lijntjes aan het uiteinde van letters ervoor dat de tekst rommeliger en daardoor minder goed leesbaar werd. Door de opkomst van retina en HiDPI schermen (meer pixels per oppervlakte) is deze keuze niet meer zo vanzelfsprekend. Volgens de usability goeroes van de Nielsen Norman Group is de tijd die men nodig heeft om een tekst te lezen in een serif of sans serif lettertype vrijwel gelijk. Je kunt beargumenteren dat een serif lettertype beter is, omdat dat gebruikt worden in boeken, kranten en magazines. Maar ook die vlieger gaat niet op, zo schrijft Jakob Nielsen:

"Almost all mainstream printed newspapers, magazines, and books use serif type, and thus people are more accustomed to reading long texts in this style. However, given the research data, the difference in reading speed between serif and sans serif is apparently quite small. Thus, there's no strong usability guideline in favor of using one or the other, so you can make the choice based on other considerations — such as branding or the mood communicated by a particular typographical style."

De keuze voor een serif of sans serif lettertype kun je daarom volledig laten afhangen van de stijl en sfeer die jij wilt neerzetten op je website.

Hoe groot moet het lettertype zijn?

Standaard staat het lettertype van een browser (zoals Internet Explorer, Firefox of Chrome) ingesteld op een grootte van 16 pixels. Toch lijkt 12 pixels de gangbare maat wanneer je gaat kijken naar populaire websites als nu.nl of telegraaf.nl. Zelfs de resultaten van Google hebben een grootte van 12 pixels. Waarom gebeurt dit? Waarom doen we moeite om het lettertype kleiner te maken, terwijl de standaard van 16 pixels juist gekozen is om de tekst goed leesbaar te maken?

Ik heb twee mogelijke verklaringen voor dit fenomeen. Ik geef namelijk de schuld aan mensen zoals ik, webdesigners. Wij webdesigners hadden namelijk al snel door dat wanneer je een lettertype kleiner maakte, het er mooier, moderner en strakker uitzag. Dat het ten koste ging van de leesbaarheid was een bijzaak. Het opleveren van een 'mooie' website was belangrijker dan het opleveren van een 'goede' website. Een aantal factoren heeft ervoor gezorgd dat dit niet meer de norm hoeft te zijn:

• Het werd steeds makkelijker om te onderzoeken hoe bezoekers een website gebruiken. De zogenaamde 'usbality' van een website werd steeds belangrijker. Daaruit blijkt dat grotere lettertypes (ja, een open deur) beter leesbaar zijn. Wij webdesigners wisten dit natuurlijk allang, maar nu het ook nog eens onderschreven wordt door onderzoeken is het tijd dat wij ons aanpassen.
• Er komen steeds meer oudere mensen op het web. Oudere mensen hebben over het algemeen slechtere ogen en daardoor behoefte aan grotere teksten. Volgens een onderzoek van Jakob Nielsen is het aantal mensen met een leeftijd van tussen de 65 en 74 die het web zijn gaan gebruiken in 2012 toegenomen met 9% in vergelijking met 2011. Mooi of niet mooi, grotere lettertypes zijn nodig om ook voor deze bezoekers een website leesbaar te maken.

Een andere verklaring die ik heb is simpelweg verwarring. Er is namelijk een verschil tussen pixels en punten. Wanneer jij een tekstverwerker opent, dan staat deze standaard ingesteld op een lettergrootte van 12 punten. Wanneer je een website maakt, zou je kunnen denken dat dit vertaald kan worden naar 12 pixels. Maar dit klopt niet. 12 punten is namelijk 16 pixels, maar het is begrijpelijk dat deze fout gemaakt wordt.

Gelukkig zijn er steeds meer websites die niet bang zijn om grotere en dus beter leesbare lettertypes te gebruiken. Langzaam ontstaat er het idee dat groot best mooi kan zijn. Dit komt ook doordat de schermen die wij gebruiken steeds beter worden. We kunnen (en moeten) meer pixels per oppervlakte laten zien. Bekijk bijvoorbeeld nu.nl op een retina of HiDPI scherm en je ziet hoe belachelijk klein het allemaal is.

Gebruik dus minimaal 16 pixels als grootte van je lettertype. Maar het mag ook gerust groter, om bijvoorbeeld de lengte van je zinnen te verkleinen.

De lengte van je regels

De ideale lengte van een regel is tussen de 50 á 75 tekens. Ten eerste geeft dit een prettig gevoel, omdat je sneller kunt lezen. Je hoeft je hoofd niet te bewegen om een hele lang zin te lezen. Daarnaast blijkt dat elke keer wanneer iemand naar een nieuwe regel springt, dit een boost geeft voor de lezer. Deze boost neemt geleidelijk af naarmate de zin langer is.

De lengte van je regels kun je beperken door het vlak waarin de tekst staat smaller te maken. Dit kan nogal een uitdaging zijn. Op onze eigen website worstelen wij ook met dit probleem. Een manier om het content vlak smaller te maken, is door er een balk naast te plaatsen met extra info. Op onze nieuwe website hebben wij ervoor gekozen om dit niet te doen. De extra content in de zijbalk leidt alleen maar af. We willen de bezoeker leiden van punt A naar B. Eerst de belangrijkste tekst en dan pas de overige informatie, zoals het aanmelden voor onze nieuwsbrief of het tonen van de gerelateerde artikelen. Een balk aan de zijkant is voor ons geen oplossing. Wij zijn daarom aan het experimenteren met het vergroten van de tekst. Hoe groot kunnen wij ons lettertype maken voordat het beperkingen oplevert in de hoogte van de regels? Vooralsnog hebben wij geen oplossing gevonden, maar zodra we een keuze hebben gemaakt zal ik dit artikel updaten.

Hopelijk kun je met deze tips aan de slag om je bezoeker een beter gevoel te geven met jouw content. Heb je nog vragen, laat het mij dan weten in het commentaar.