We zien het vaak terugkomen in interfaces van websites en apps: een grote slagzin, tussentitel of button literal in all caps, met vaak ook meer witruimte tussen de verschillende letters. Een designkeuze die nauwgezet moet worden geanalyseerd afhankelijk van de situatie.
Een woord of zin in hoofdletters leest moeilijker, da’s een feit dat kan worden gestaafd met cijfers. Het duurt zo’n 13 tot 20% langer om een all caps tekst door te lezen dan een lowercase tekst. Niet overtuigd? Leg deze teksten naast elkaar en lees ze eens door.
Hoe komt dat? Uit onderzoek is gebleken dat de vormen van lowercase letters ervoor zorgen dat er bepaalde contouren worden gevormd, waardoor onze hersenen woorden sneller herkennen. Een woord in lowercase heeft een gevarieerde vorm, terwijl een woord in all caps steeds een rechthoekige vorm krijgt. Onze hersenen hebben het dus moeilijker om all caps woorden snel te lezen, omdat dat er in ons hoofd allemaal hetzelfde uitziet. We moeten dus letter per letter gaan lezen om te zien wat er staat. Dat gaat maar om een fractie van een seconde, maar het kán een belangrijk verschil zijn.
We zijn het van jongs af aan gewoon om lowercase teksten te lezen. Boeken, tijdschriften, kranten, teksten op het internet, ondertiteling op tv… allemaal gebruiken ze lowercase. We zijn het dusdanig gewend om op die manier teksten te lezen, dat het vertrouwder aanvoelt en sneller leest. Het is een kwestie van jarenlange training.
Teksten in all caps lijken bovendien ook vaak SCHREEUWEND over te komen. Een knop “schrijf je nu in” vs. “SCHRIJF JE NU IN” komt heel anders over. Schreeuwend komt over als opdringerig en agressief. Dat gevoel wil je niet overbrengen op je doelpubliek.
Wanneer wel, wanneer niet?
Focus op de boodschap
Doorlopende teksten en belangrijke informatie plaats je beter niet in hoofdletters. Een belangrijke voorwaarde bij het klikken van een knop, een tekst over de missie van je bedrijf of een uitleg bij het begin van een form-proces plaats je het best altijd in lowercase. De gebruiker moet de informatie immers rustig kunnen doornemen.
Korte slagzinnen of tussentiteltjes kunnen wel perfect in hoofdletters. Je beperkt je het best tot maximaal 1 regel, bij voorkeur slechts enkele woorden. Vanaf het moment dat je werkt met volzinnen en teksten, doe je dat het best altijd in lowercase.
Call-to-actions in de verf
Een call-to-action kan in hoofdletters, al maak je in het beste geval de afweging in combinatie met de boodschap. Een “cancel”-knop binnen de flow van het invullen van een formulier kan nogal agressief overkomen in caps. Belangrijke knoppen zoals “save” binnen een flow werken ook beter in lowercase, voor de leesbaarheid. Verkennende knoppen die doorlinken naar een andere pagina (bv. “bekijk portfolio” of “ontdek onze blog”), kunnen wel perfect in all caps.
Hoewel het gebruik van all caps in een knop geen dealbreaker is, beperk je je het best in het aantal tekst. Een woord in all caps is perfect oké. Bevat je knop de tekst “Accepteer de algemene voorwaarden”, dan plaats je die beter in lowercase of titlecase. Niet alleen voor de leesbaarheid, maar ook design-matig is dat beknopter en duidelijker. All caps tekst neemt veel meer plaats in. Wees vooral ook consistent.
Voor de vorm
Een naam binnen een logo wordt wel vaak in all caps gezet omdat dat vaak past bij de huisstijl van het merk. Een logo wordt zo een herkenningsteken waarbij mensen de naam vaak niet eens meer lezen. Het beeldmerk, de kleuren of de combinatie van het woord- en beeldmerk zorgen ervoor dat je klant je meteen herkent. Wanneer de gebruiker iets dus niet echt moet lezen, kan dat perfect werken.
Binnen grafische vormgeving wordt all caps ook vaker gebruikt als design-element. Denk aan de cover van een boek of een filmposter.
Inglourious Basterds movie poster
Conclusie van de caps discussie
Leesbaarheid is key! Als je twijfelt, gebruik dan lowercase. Indien je all caps gebruikt in je User Interface, zorg er dan voor dat je je zeker beperkt tot max. 1 regel. Maak een doordachte afweging en zorg voor een goede balans tussen all caps en lowercase elementen. These rules don’t apply op logo’s en grafische elementen (bv. posters, boeken, visuele elementen…).
Kijk ook wat past binnen je brand en je product. Grafische, visuele pagina’s (zoals productpagina,’s blogs, verkennende pagina’s…) lenen zich vaak beter tot all caps dan praktische pagina’s (zoals formulieren, belangrijke informatieve pagina’s…). Maak voor je knoppen een afweging en zorg er zeker voor dat het nooit overkomt alsof je roept tegen je bezoeker.
Laat ook eens enkele mensen doorheen je User Interface lezen en bevraag hen. Voer desnoods A/B tests uit op je websites, indien tijd en budget dat toelaten, en bekijk hoelang mensen erover doen om door je website te scrollen.
