Opvallend (on)toegankelijk: alles over tekstafstand

Het is weer zo ver, de Week van de Toegankelijkheid! Met als thema: toegankelijk onderwijs. Dit is een week om extra goed stil te staan bij onze medemens en na te denken over hoe we kunnen zorgen dat iedereen mee kan doen in de digitale wereld.

Daarom zal ik deze week niet één, niet twee… maar drie artikelen delen met inzichten over de WCAG-succescriteria. Te beginnen met succescriterium 1.4.12 Tekstafstand. Waarom? Omdat het vandaag ook nog eens Wereld Dyslexiedag is, waar dit succescriterium een directe link mee heeft. Poah, wat een toeval.

Wist je trouwens dat in Nederland ongeveer 4% van de bevolking dyslexie heeft? Wat betekent dat er in vrijwel elke klas wel een kind met dyslexie zit. En nog een leuke tip van flip: wist je dat in Finland zeer weinig mensen dyslexie hebben? Dit komt doordat woorden zo precies worden uitgesproken als ze geschreven worden.

Allereerst: wat is dyslexie?

Dyslexie is een lees- en leerstoornis waarbij er problemen zijn met lezen en spelling. Dit heeft niet te maken met intelligentie, maar met de manier waarop de hersenen informatie verwerken. Iemand zonder dyslexie ziet een letter en weet bijna automatisch hoe deze hoort te klinken en kan daar dan een woord uit opmaken.

Deze automatische verwerking gaat bij iemand met dyslexie minder goed. Hierdoor gaat lezen, spellen en soms ook schrijven vaak traag en het kost meer energie. Dit maakt het lezen van teksten op bijvoorbeeld websites dan ook een stuk uitdagender.

Gelukkig zijn er tegenwoordig verschillende manieren waarop we de leeservaring voor iemand met dyslexie op het web kunnen verbeteren. Zo kan je bij het ontwerpen van je website al rekening houden door te letten op je keuzes qua lettertypen, lettergroottes, kleuren, schrijfstijl, enzovoort.

Comic Sans toegankelijk?!

Ja… lettertype Comic Sans is superlelijk (vind ik), maar… Comic Sans kan oprecht nuttig zijn voor mensen met dyslexie. Waarom? Omdat het een duidelijk schreefloos lettertype is dat helpt bij het onderscheiden van letters, wat het lezen vergemakkelijkt!

Ook kan iemand met dyslexie ervoor kiezen om de instellingen van de website vanuit de auteur te overschrijven met zelf ingestelde stijlkenmerken. Dit laatste is waar WCAG-succescriterium 1.4.12 op inhaakt. Komt ‘ie dan!

WCAG 1.4.12 – Tekstafstand

Dit succescriterium is bedoeld om ervoor te zorgen dat mensen de tekstafstand kunnen aanpassen om hun leeservaring te verbeteren. Hiervoor wordt er gekeken naar de mogelijkheid om de tekstafstand op vier manieren te vergroten:

  • Tussen regels

  • Tussen alinea's

  • Tussen letters

  • Tussen woorden

Elke combinatie hiervan kan een gebruiker helpen bij het makkelijker lezen van de tekst. Als de tekstafstand op deze vier manieren kan worden aangepast, is de kans groot dat de gebruiker de stijlkenmerken kan aanpassen naar de eigen behoeften. Dit is enerzijds dus fijn voor mensen met dyslexie, maar kan ook mensen met visuele beperkingen helpen.

Voorbeeld van een deel van de homepagina van de website van Cardan met op links ((1)) de standaardweergave en op rechts ((2)) de weergave na het toepassen van de stijlkenmerken zoals beschreven in WCAG succescriterium 1.4.12.

Waar let ik op in een toegankelijkheidsonderzoek?

Als ik dit succescriterium onderzoek, bekijk ik de pagina’s bij een vensterbreedte van de browser van 1280 pixels en 100% zoom met de volgende aangepaste stijlkenmerken:

  • Regelhoogte van minimaal 1,5 keer de lettergrootte

  • Afstand na alinea’s van minimaal 2 keer de lettergrootte

  • Letterafstand van minimaal 0,12 keer de lettergrootte

  • Woordafstand van minimaal 0,16 keer de lettergrootte

Vervolgens kijk ik of de tekstafstand op een pagina op deze manier aangepast kan worden zonder verlies van content of functionaliteit. Dit betekent dat alle informatieve inhoud op de pagina op een leesbare manier aanwezig moet blijven en moet blijven werken.

Wat ik nog wel eens mis zie gaan is dat er na het toepassen van de stijlkenmerken content buiten de pagina of buiten het vak waar het in staat valt, waardoor een deel van de tekst niet meer te lezen is. Wat ook vaak voorkomt, is dat tekst over andere tekst heen valt en daardoor niet of niet goed meer te lezen is.

Voorbeelden van veelvoorkomende problemen na het toepassen van de stijlkenmerken zoals beschreven in WCAG succescriterium 1.4.12: (1) Tekst valt verticaal buiten het vak, (2) Tekst valt horizontaal buiten het vak, (3) Tekst overlapt met elkaar.

Bron afbeeldingen

Waar kijk ik niet naar?

Een aantal dingen vallen buiten de scope van dit succescriterium:

  • Het gaat er niet om dat tekst op de pagina verandert na het instellen van de aangepaste stijlkenmerken. Het gaat er alleen om dat als de stijlkenmerken worden toegepast, er geen verlies van content of functionaliteit optreedt.

  • Dit succescriterium geldt niet voor teksten die niet beïnvloed worden door de stijlkenmerken, zoals afbeeldingen van tekst en ondertiteling die vast gemonteerd is in een video.

  • Het succescriterium geldt ook niet voor PDF-documenten. In deze blog lees je welke succescriteria wél van toepassing zijn op PDF’s.

Tot slot

Kort samengevat: succescriterium 1.4.12 gaat dus over het aanpassen van de tekstafstand om de visuele weergave van tekst zo makkelijk mogelijk waarneembaar te maken voor mensen met een beperking. Later deze week ga ik hierop verder met twee andere succescriteria, namelijk 1.4.4 Herschalen van tekst en 1.4.10 Reflow. Tot dan!

Vragen?

Heb je inhoudelijke vragen over consistente navigatie of andere zaken omtrent WCAG? Mail dan naar support@cardan.com. Heb je een specifiek onderwerp dat je graag wilt zien terugkomen? Stuur ons dan een e-mail naar contact@cardan.com.

Gerelateerde artikelen

  • WCAG vs EN 301 549: Wat is het verschil en waarom maakt het uit?

    Als je werkt aan digitale toegankelijkheid, ben je ongetwijfeld bekend met WCAG 2.1 (of zelfs al met de WCAG 2.2 AA). Maar steeds vaker kom je ook de term EN 301 549 tegen. Wat is precies het verschil tussen deze twee standaarden? En waarom zou je organisatie aandacht moeten besteden aan EN 301 549, zelfs als je al WCAG implementeert?

    • WCAG
    • Wetgeving
  • EN 301 549: De Europese norm voor digitale toegankelijkheid

    EN 301 549 is de geharmoniseerde Europese norm voor digitale toegankelijkheid van informatietechnologie (websites, apps, hardware en software). Deze standaard is verplicht voor alle overheidsinstanties en wordt breed aanbevolen binnen het bedrijfsleven en de publieke sector.

    • WCAG
    • European Accessibility Act
  • Opvallend (on)toegankelijk: tekst herschalen of vergroot weergeven

    WCAG 1.4.4 – Herschalen van tekst stelt dat tekst tot 200% vergroot moet kunnen worden zonder hulptechnologieën en zonder dat content of functionaliteit verloren gaat. Denk aan tekst die buiten beeld valt of overlapt. Horizontaal scrollen is bij dit criterium nog toegestaan.

    • WCAG