Tips en tools
Praktische tips, tools en handleidingen om de digitale toegankelijkheid van je website te verbeteren. Van kleurcontrast tot koppenstructuur.
Tabel met knoppen om in de kolommen te sorteren
Sorteerbare tabellen kom je overal tegen: in dashboards, overzichtspagina’s, webshops en CMS-systemen. Je klikt op een kolomkop en de tabel sorteert zichzelf. Visueel is dat duidelijk, maar voor een schermlezergebruiker is het vaak onzichtbaar. De kolomkop ziet er niet uit als iets interactiefs – en de schermlezer vertelt het ook niet.
Hoe verwijder ik de melding ‘Google vragen over dit bericht’ – en waarom zou je dat willen?
Als je regelmatig digitale toegankelijkheid test, dan weet je hoe onmisbaar de Tab-toets is. Het is dé manier om snel te controleren of een website met alleen het toetsenbord te bedienen is. Tijdens onze audits zeg ik het altijd: wat niet met de Tab-toets bereikbaar is, is ook niet bereikbaar voor veel hulpsoftware.
Hoe test je elementen die op hover, focus of klik verschijnen (en meteen weer verdwijnen)?
Sommige UI-elementen verschijnen alleen kort, bijvoorbeeld vensters, dropdowns of menus die op hover of focus zichtbaar worden. Die kunnen interactieve onderdelen bevatten die je moet testen op toegankelijkheid. Bijvoorbeeld:
Hoe test ik focus zichtbaarheid
Navigeer je met de muis door een website, dan zie je welk element actief is doordat je muisaanwijzer erop staat. Maar voor mensen die het toetsenbord gebruiken, is er een ander visueel signaal nodig: de focusmarkering. Zonder die markering ben je verdwaald op de pagina. Je drukt op Tab, er gebeurt iets – maar je hebt geen idee waar je bent.
Hoe test ik focusvolgorde?
Focusvolgorde is een van die dingen die je pas opvalt als het misgaat. Je drukt op Tab en ineens spring je van de header naar de footer, of je opent een modal en de focus blijft achter de overlay hangen. Voor iemand die alleen het toetsenbord gebruikt, is dat het verschil tussen een bruikbare website en een onbruikbare.
Gestrand dicht bij de poolcirkel : digitale ontoegankelijkheid
Een maand geleden maakte ik samen met mijn zoon en onze teckels een rondreis door Zweden. Alles verliep soepel: met de trein van Stockholm naar Umeå, waar we dicht bij de poolcirkel een stuga (lees: houten huisje in een bos vol muggen met karakter) hadden gehuurd.
Overlay-toegankelijkheidstools: lossen ze echt iets op?
Waarom dit mini-onderzoek Veel teams vragen me of je digitale toegankelijkheid kunt “fixen” door een overlay of widget toe te voegen die fouten automatisch oplost. En, in het verlengde daarvan: voldoe je met zo’n tool meteen aan de wet (EAA of BDTO)?
Waarom correcte HTML-lijsten hét verschil maken in toegankelijkheid
Wie wel eens een toegankelijkheidsaudit heeft gezien, weet: de grootste problemen zitten vaak in de kleinste details. Een klassiek voorbeeld? Lijsten in HTML. Wat voor de ogen slechts een rijtje bullets lijkt, kan voor iemand met een schermlezer uitlopen op een mijnenveld van verwarring.
Zo controleer je de koppenstructuur van je website
Een logische koppenstructuur (H1, H2, H3, …) is cruciaal voor webtoegankelijkheid én SEO. Maar hoe weet je of jouw pagina goed is opgebouwd? Met de gratis browserextensie HeadingsMap zie je in één oogopslag of de structuur klopt en waar verbeteringen nodig zijn. In deze handleiding lees je stap voor stap hoe je de tool gebruikt en waar je op moet letten.
Hoe maak je een citaat in een PDF-document (en waarom dat belangrijk is voor toegankelijkheid)
Als webredacteur werk je dagelijks met teksten, visuals en documenten. Vaak gaat het niet alleen om wat je schrijft, maar ook om hoe je het aanbiedt. Want een document dat er op het eerste gezicht goed uitziet, kan voor iemand die een schermlezer gebruikt juist verwarrend zijn. Een goed voorbeeld hiervan is een citaat in een PDF: hoe zorg je dat dit ook écht als citaat wordt herkend?
Hoe geef ik een applicatie een accessible name?
Soms kom je in een audit een element tegen met role="application" dat geen toegankelijkheidsnaam (accessible name) heeft. Dat is een probleem, want een schermlezer weet dan niet wat dit onderdeel van de pagina doet. In dit artikel leg ik uit wat role="application" is, wanneer je het gebruikt en hoe je het een correcte naam geeft.
Video transcript: goed resultaat met een gratis tool
Verder op deze pagina staat een video die in een toegankelijkheidsaudit zou worden afgekeurd. In deze video komt informatie in beeld die niet toegankelijk is voor mensen die de video niet kunnen zien. Probeer het zelf te begrijpen: