Ga naar de inhoud

1.4.12 – Tekstafstand (WCAG) | Niveau AA

1.4.12 – Tekstafstand (WCAG) | Niveau AA

Gebruikers kunnen de tekstafstand aanpassen zonder dat inhoud of functionaliteiten verloren gaan.

Sommige gebruikers veranderen de tekstafstand die een website gedefinieerd heeft naar een waarde die hen helpt bij het lezen. Door ervoor te zorgen dat gebruikers in staat zijn de tekstafstand aan te passen, biedt je een betere leeservaring aan.

Tekstafstand betekent hier de afstand tussen alinea’s, regels, woorden en letters. Voor mensen met dyslexie en slechtzienden kan meer ruimte tussen deze tekstuele elementen het lezen bevorderen.

Wat te doen

Test of gebruikers de content van je website kunnen aanpassen, zonder dat er content of functionaliteiten verloren gaat. Om dit criterium te testen, verander je:

  • De regelhoogte naar ten minste 1,5 keer de lettergrootte
  • De afstand tussen alinea’s naar ten minste 2 keer de lettergrootte
  • De letterafstand naar ten minste 0,12 keer de lettergrootte
  • De spatiëring van woorden naar ten minste 0,16 keer de lettergrootte

Om deze stijleigenschappen te testen, gebruik je het volgende stukje CSS-code:

* {
line-height: 1.5 !important;
letter-spacing: 0.12em !important;
word-spacing: 0.16em !important; }
p {
margin-bottom: 2em !important;
}

Tips

  • Om deze stijleigenschappen te testen op meerdere pagina’s, moet iedere keer handmatig de CSS-code overschreven worden. Gebruik de Stylus browser plugin om standaardinstellingen te definiëren. Hiermee test je gemakkelijk meerdere pagina’s met twee klikken. Uitzonderingen: Menselijke talen en scripts die geen gebruik maken van een van de eigenschappen (regelhoogte, afstand tussen alinea’s, letterafstand en spatiëring van woorden)

WCAG 2.2 toevoeging

Bij sommige talen is het gebruikelijk om een andere tekstafstand te gebruiken. Auteurs worden aangemoedigd om lokaal beschikbare richtlijnen te volgen voor het verbeteren van de leesbaarheid en zichtbaarheid van tekst.