Een screenreader is software die informatie op een scherm omzet naar spraak of braille. In het Nederlands wordt ook wel schermlezer gezegd.
Screenreaders worden vooral gebruikt door mensen die blind of slechtziend zijn. Maar ook veel andere mensen kunnen er baat bij hebben, bijvoorbeeld mensen die tekst liever laten voorlezen om zo beter informatie op te nemen of die tijdelijk geen scherm kunnen gebruiken.
Met een screenreader kun je een computer, telefoon, tablet, website of app bedienen zonder muis en zonder naar het scherm te kijken.
Wil je direct oefenen met een specifieke screenreader? Gebruik dan een van deze handleidingen:
- Website testen met NVDA op Windows
- Website testen met VoiceOver op Mac
- App of website testen met VoiceOver op iPhone en iPad
- App of website testen met TalkBack op Android
Wat doet een screenreader?
Een screenreader leest niet alleen gewone tekst voor. De software vertelt extra informatie over wat voor onderdeel iemand tegenkomt.
Denk aan:
- koppen;
- links;
- knoppen;
- menu's;
- formuliervelden;
- afbeeldingen;
- tabellen;
- foutmeldingen;
- statusmeldingen;
- geselecteerde of uitgeschakelde onderdelen.
Een goede knop wordt bijvoorbeeld niet alleen voorgelezen als Verzenden, maar ook als knop. Zo weet de gebruiker wat het onderdeel is en wat ermee kan.
Spraak en braille
De meeste mensen kennen screenreaders vooral door de computergestuurde stem. Maar screenreaders kunnen informatie ook doorgeven aan een brailleleesregel.
Een brailleleesregel is een apparaat met een of meerdere rijen kleine beweegbare puntjes. Daarmee kan iemand tekst voelen in braille.
Maar zoveel mensen, zoveel wensen. Niet elke screenreadergebruiker gebruikt braille. Niet elke gebruiker werkt op dezelfde snelheid. En niet iedereen gebruikt dezelfde software, sneltoetsen of instellingen.
Hoe werkt een screenreader technisch?
Een screenreader haalt informatie uit het besturingssysteem, de browser, de website of de app.
Daarvoor gebruiken besturingssystemen een toegankelijkheidslaag. In het Engels heet dit een Accessibility API.
Een API is een koppeling waarmee programma's informatie met elkaar uitwisselen. Via die API krijgt hulpsoftware, zoals een screenreader, informatie over onderdelen op het scherm.
Voor toegankelijkheid zijn vooral drie soorten informatie belangrijk:
- Naam: hoe heet het onderdeel? Bijvoorbeeld
Zoeken,Menu openenofE-mailadres. - Rol: wat is het onderdeel? Bijvoorbeeld knop, link, kop, invoerveld of tabel.
- Waarde of status: wat is de stand? Bijvoorbeeld aangevinkt, geselecteerd, ingeklapt, fout of uitgeschakeld.
Als naam, rol of status ontbreekt, wordt een onderdeel vaak onduidelijk voor screenreadergebruikers.
Voorbeeld: een knop met alleen een vergrootglas-icoon ziet er voor ziende gebruikers uit als zoeken. Maar als de knop geen toegankelijke naam heeft, kan een screenreader alleen "knop" voorlezen. De gebruiker heeft dan geen idee wat de knop doet.
Goede code is belangrijk
We weten nu dat een screenreader niet simpelweg pixels op het scherm leest, maar zijn informatie haalt uit de toegankelijkheidslaag (API).
Daarom is goede, semantische HTML-code heel belangrijk. Die bevat veel van deze informatie namelijk al van zichzelf.
Gebruik bijvoorbeeld:
h1-6elementen voor koppen- echte
buttonknoppen voor acties - echte links voor navigatie
labelelementen om namen aan formuliervelden te geven- alt-teksten bij informatieve afbeeldingen
- lijsten voor opsommingen
- tabelkoppen bij gegevenstabellen
ARIA - Accessible Rich Internet Applications
Misschien heb je weleens van ARIA gehoord, attributen die je aan HTML kunt toevoegen om toegankelijkheisinformatie mee te geven. Gebruik ARIA alleen als gewone HTML niet genoeg is. ARIA kan helpen, maar is ook een van de grootste oorzaken van toegankelijkheidsproblemen op het web momenteel, omdat het vaak verkeerd wordt gebruikt.
Je kunt meer lezen over ARIA in het artikel Wat is WAI-ARIA.
Screenreaders zijn niet makkelijk
Voor beginners kan een screenreader best overweldigend zijn. Je hoort veel informatie in korte tijd. Ook werkt de bediening anders dan je gewend bent.
Dat betekent niet dat testen met een screenreader geen zin heeft. Maar wees je er wel van bewust dat je hem anders zal gebruiken dan iemand die er elke dag mee werkt. Ik zie tijdens gebruikersonderzoeken ook altijd veel verschillen tussen ervaren gebruikers. Het betekent dus dat je voorzichtig moet zijn met conclusies.
Als iets niet lukt, kan dat drie oorzaken hebben:
- de website of app is niet toegankelijk;
- je gebruikt de screenreader nog niet handig genoeg;
- de combinatie van screenreader, browser, apparaat en instellingen werkt anders dan je verwacht.
Controleer daarom waar mogelijk de oorzaak voordat je een fout rapporteert.
Hoe gebruiken mensen screenreaders?
Mensen gebruiken screenreaders op verschillende manieren.
Sommige gebruikers laten een hele pagina vanaf het begin voorlezen. Dat kan vooral handig zijn bij onbekende of belangrijke inhoud. Veel gebruikers springen sneller door de pagina. Zij navigeren bijvoorbeeld via:
- koppen;
- links;
- formuliervelden;
- knoppen;
- tabellen;
- landmarks of herkenningspunten;
- zoeken op de pagina.
Een goede pagina moet dus op twee manieren werken:
- de volledige leesvolgorde moet logisch zijn;
- de structuur moet snel scannen mogelijk maken.
Screenreader testen is geen volledige audit
Screenreader testen is nuttig, maar onthoud dat het geen volledige toegankelijkheidsaudit is.
Met een screenreader vind je vooral technische problemen zoals:
- naam, rol en status;
- leesvolgorde;
- kopstructuur;
- formulieren;
- foutmeldingen;
- links en knoppen;
- afbeeldingen;
- dynamische onderdelen zoals menu's en dialogs.
Andere toegankelijkheidsproblemen vind je er niet mee.
Problemen die je mist als je alleen een screenreader test:
- kleurcontrast
- zoom en tekstgrootte
- toetsenbordfocus voor mensen zonder screenreader
- ondertiteling
- begrijpelijke taal
- grootte van aanraakdoelen
- aanwezigheid van bewegende content
- foutpreventie in formulieren
Gebruik testen met een screenreader daarom altijd als onderdeel van een bredere check.
Welke screenreaders zijn er?
Op de meeste gangbare besturingssystemen is een screenreader beschikbaar.
| Platform | Screenreader | Opmerking |
|---|---|---|
| Windows | NVDA | Gratis en open source, Windows |
| Windows | JAWS | Betaalde (prijzige) screenreader van Freedom Scientific. Veel gebruikt in professionele omgevingen, Windows. |
| Windows | Verteller | Ingebouwd in Windows. Ook bekend als Narrator. |
| macOS | VoiceOver | Ingebouwd in macOS. Voor websites vooral testen met Safari. |
| iOS en iPadOS | VoiceOver | Ingebouwd in iPhone en iPad. Werkt met speciale gebaren. |
| Android | TalkBack | Screenreader voor Android. Werkt met speciale gebaren. |
| ChromeOS | ChromeVox | Ingebouwd in ChromeOS. |
| Linux | Orca | Veel gebruikt binnen GNOME-omgevingen. |
Met welke screenreader moet je testen?
Begin vooral pragmatisch. Welke screenreader je kiest, hangt af van wat je test en wie je doelgroep is.
Test je een website voor Windows-gebruikers? Start dan met NVDA op Windows, bij voorkeur in een gangbare browser zoals Firefox, Chrome of Edge.
Test je een website voor Mac-gebruikers? Test dan met VoiceOver op macOS in Safari.
Test je mobiele websites of apps? Test dan zowel VoiceOver als TalkBack. Ondanks dat een app op beide platformen beschikbaar kan zijn, zitten er grote verschillen tussen de onderliggende techniek. Dit vraagt veel van ontwikkelaars en het gaat vaak mis.
Bij diensten met grote impact, zoals overheid, zorg, onderwijs, bankzaken of werkprocessen, is testen met echte gebruikers extra belangrijk.
Wat kun je zelf testen?
Ook zonder veel ervaring kun je zelf al veel vinden.
Dingen die je zelf al kunt controleren:
- wordt de paginatitel duidelijk voorgelezen?
- zijn koppen echt koppen en logisch?
- zijn links duidelijk?
- hebben knoppen een naam?
- hebben formuliervelden labels?
- worden foutmeldingen voorgelezen?
- hebben informatieve afbeeldingen goede alt-tekst?
- is de volgorde van de pagina logisch?
- kun je menu's, dialogs en pop-ups bedienen?
Schrijf bij problemen altijd op:
- welke screenreader je gebruikte;
- welk besturingssysteem;
- welke browser of app;
- welke stap je nam;
- wat je verwachtte;
- wat er gebeurde.
Veelvoorkomende problemen
Problemen die ik vaak tegenkom als ik met een screenreader ga testen:
- een knop wordt alleen voorgelezen als
knop, zonder naam - een link zegt alleen
lees meer - een afbeelding wordt voorgelezen als bestandsnaam, geen alternatieve tekst
- een formulierveld heeft geen label
- een foutmelding verschijnt wel visueel, maar wordt niet voorgelezen
- een dialog opent, maar de informatie op de pagina erachter wordt nog steeds voorgelezen
- informatie is alleen zichtbaar, maar wordt niet voorgelezen
- interactieve onderdelen werken alleen met de muis of gewone swipegebaren
Praktische testvolgorde
Gebruik deze volgorde als je net begint:
- Test eerst met toetsenbord zonder screenreader.
- Test daarna met een screenreader.
- Begin met de volledige leesvolgorde.
- Controleer de kopstructuur.
- Controleer links en knoppen.
- Controleer formulieren en foutmeldingen.
- Controleer afbeeldingen.
- Controleer menu's, dialogs en dynamische onderdelen.
- Controleer op mobiel met VoiceOver of TalkBack.
Meer leren
Als je nog meer wilt lezen over screenreaders, kijk dan ook eens op de volgende pagina's
- W3C WCAG: Name, Role, Value
- W3C Understanding Name, Role, Value
- WAI: Providing Accessible Names and Descriptions
- WebAIM: Screen Reader Testing resources
Wil je na al deze informatie aan de slag met een specifieke screenreader? Gebruik dan een van deze handleidingen: