waarom gaat mijn website kapot als je de tekst groter zet

Tekst die niet mag vergroten is een bekend WCAG-knelpunt

Een site die "kapot" gaat zodra een klant de tekst groter zet, komt bijna altijd door vaste maten: tekst, knoppen of containers die in pixels zijn vastgezet in plaats van in eenheden die meeschalen. Zet een klant de tekstgrootte in de browser omhoog, dan blijft een vak met een vaste pixelhoogte even groot, en de tekst erin loopt eruit, valt over andere elementen heen of wordt afgekapt. Menu's die precies passen bij de standaardgrootte, klapstukken die niet meegroeien en knoppen waarvan de tekst buiten de rand valt zijn de meest voorkomende symptomen.

Dit is geen esthetisch mankement maar een functioneel probleem: als een label onleesbaar wordt of een knop niet meer aanklikbaar is omdat de tekst eroverheen loopt, kan een klant een stap in het bestelproces niet meer afronden. Dat raakt dezelfde kwetsbare plekken als bij toetsenbordbediening van de hele bestelling: een schaalprobleem dat op de kernpagina's onschuldig oogt, kan bij de bestelstap of het inlogscherm de doorslag geven. Ook koppen en tussentitels lopen risico: als een structuurelement bij vergroting in elkaar klapt, wordt de leesvolgorde raar, iets dat ook voorkomt in het bredere verhaal over koppen, structuur en navigatie.

Waar dat in WCAG 2.1 staat: het vergrotingscriterium

WCAG 2.1 stelt dat tekst tot een bepaald percentage vergroot moet kunnen worden zonder dat inhoud of functionaliteit verloren gaat; dat is het uitgangspunt achter het criterium voor herschaalbare tekst, zoals te lezen valt in de richtlijn zelf. In de praktijk toetst een scan dit door de pagina op meerdere tekstgroottes te laden en te kijken of tekst wordt afgesneden, overlapt of onleesbaar wordt. Wat een geautomatiseerde test niet ziet, is of de pagina dan nog prettig te gebruiken is of alleen technisch "niet kapot" — dat verschil hoort bij de dingen die een automatische scan niet kan beoordelen.