VoiceOver staat al op je Mac. Je hoeft niets te downloaden en niets te betalen: Command + F5 en hij praat. Wat daarna gebeurt, zorgt ervoor dat de meeste mensen hem binnen twee minuten weer uitzetten. Er begint een stem die je niet kunt bijhouden en je pijltjestoetsen doen ineens iets anders dan je verwacht.
Zonde, want dit is de enige test die je laat horen wat er van je pagina overblijft zonder scherm. Alles wat je alleen ziet, bestaat voor een schermlezergebruiker niet.
Wat je nodig hebt
Een Mac en Safari. VoiceOver en Safari komen van dezelfde maker en werken het beste samen. Chrome en Firefox werken ook, en gedragen zich op onderdelen anders. Test in Safari en houd er rekening mee dat een andere browser tot een andere uitkomst leidt.
Verder een koptelefoon, als je met collega’s in een ruimte zit.
VoiceOver aanzetten
Druk op Command + F5. Op een Mac met Touch ID werkt ook: drie keer snel op de Touch ID-knop drukken. De eerste keer verschijnt een welkomstvenster. Met Enter ga je verder, met V start je de ingebouwde training die je stap voor stap door de bediening loopt.
Drie dingen die je meteen wilt weten:
- Control zet de spraak stil. De belangrijkste toets van de eerste dag.
- De VO-toets is Control + Option. Bijna elk commando begint daarmee. In handleidingen staat die combinatie als VO. Vergrendelen kan met Control + Option + puntkomma, dan hoef je ze niet steeds vast te houden.
- Op een MacBook hoort er soms Fn bij de F-toetsen, afhankelijk van je toetsenbordinstelling.
Praat hij te snel voor je, zet dan de spreeksnelheid lager in het VoiceOver-hulpprogramma. Dat open je met VO + F8, de snelheid staat onder Spraak.
Zet in datzelfde hulpprogramma onder Visueel het bijschriftvenster aan. Dat toont op het scherm mee wat VoiceOver zegt, als tekst. Voor een test is dat het eerste wat ik aanzet: je kunt teruglezen wat er precies werd gezegd, het overnemen in een bevinding, en het laten zien aan iemand die niet meeluisterde.
De commando’s die je nodig hebt
| Wat je wilt doen | Toetsen |
|---|---|
| VoiceOver aan of uit | Command + F5 |
| Spraak stoppen | Control |
| Naar het volgende onderdeel | VO + Pijl rechts |
| Naar het vorige onderdeel | VO + Pijl links |
| Onderdeel activeren | VO + Spatie |
| Alles voorlezen vanaf hier | VO + A |
| Webrotor openen | VO + U |
| Naar de volgende kop | VO + Command + H |
| Naar de volgende link | VO + Command + L |
| Naar het volgende formulierveld | VO + Command + J |
| Naar de volgende tabel | VO + Command + T |
| Naar de vorige van die soort | Shift erbij, dus VO + Command + Shift + H |
| Een groep in gaan | VO + Shift + Pijl omlaag |
| Een groep verlaten | VO + Shift + Pijl omhoog |
| VoiceOver-hulpprogramma openen | VO + F8 |
Tab en Shift + Tab blijven gewoon werken. Het verschil: met Tab loop je langs alles wat bedienbaar is, met VO + Pijl rechts loop je langs alles, inclusief tekst, afbeeldingen en lege groepen. Beide vertellen je iets anders over je pagina.
De webrotor is waar je test begint
Druk op VO + U. Je krijgt een lijst te zien en te horen. Met Pijl links en Pijl rechts wissel je van soort: koppen, links, formulierbesturingselementen, oriëntatiepunten. Met Pijl omhoog en Pijl omlaag loop je door de lijst, met Enter spring je naar het onderdeel, met Escape sluit je de rotor. Typen filtert de lijst.
Dit is de belangrijkste stap, en de reden is dit: een dagelijkse gebruiker leest jouw pagina zelden van boven naar beneden. Hij opent deze lijst en kiest waar hij begint. Staat er in de koppenlijst drie keer “Kop niveau 2, Lees meer”, dan weet je al genoeg voordat je één regel code hebt geopend.
Er is ook snelnavigatie. Druk Pijl links en Pijl rechts tegelijk in en losse letters gaan werken, waaronder H voor de volgende kop en de cijfers 1 tot en met 6 voor kopniveaus. Het volledige lijstje staat in het helpmenu van VoiceOver.
Zo loop je een pagina door
1. Luister naar de paginatitel
Laad de pagina en luister naar wat VoiceOver als eerste zegt. Beschrijft de titel deze pagina, of hoor je op elke pagina hetzelfde? Staat de naam van de pagina vooraan, vóór de naam van de site? Dat scheelt een dagelijkse gebruiker seconden per tabblad.
2. Vraag de koppen op
VO + U, koppenlijst. Lees hem van boven naar beneden en stel jezelf één vraag: begrijp ik hieruit waar deze pagina over gaat en wat erop staat? Let op één h1, op overgeslagen niveaus en op koppen die alleen visueel een kop zijn.
Wil je hetzelfde zien in plaats van horen, dan legt de WCAG Radar de koppenstructuur als blokjes over je pagina heen. Hoe je die structuur controleert, staat in zo controleer je de koppenstructuur van je website.
3. Vraag de links op
Wissel in de rotor naar de linklijst. Nu staat elke linktekst los van zijn omgeving, zonder de zin eromheen en zonder de afbeelding ernaast. Kun je van elke regel zeggen waar hij heen gaat? Losse URL’s, “hier” en twaalf keer “Lees meer” vallen hier meteen op.
4. Doe het formulier
Ga met Tab door je formulier en luister per veld. Je hoort het label, de soort van het veld en of het verplicht is. Hoor je alleen “invoerveld”, dan hangt het label er niet aan vast.
Verstuur daarna expres een leeg formulier. Zegt VoiceOver iets? Stilte na het verzenden is een van de dingen die ik in onderzoeken het vaakst tegenkom: de foutmelding staat wel op het scherm, maar de schermlezer meldt hem niet en de focus gaat er niet heen.
5. Open de componenten
Menu’s, dialoogvensters, tabs, accordeons, filters. Luister naar de toestand: hoor je “uitgeklapt” of “geselecteerd” als dat zo is? Gaat de focus het dialoogvenster in, blijft hij erin, en sluit Escape het venster? Voor de focus zelf is er een aparte test, die staat in hoe test ik focusvolgorde.
Wat je hoort als er iets mis is
| Wat je hoort | Wat er waarschijnlijk aan de hand is |
|---|---|
| “afbeelding” plus een bestandsnaam als DSC_0421 | De afbeelding heeft geen alt-tekst en VoiceOver valt terug op de bestandsnaam |
| Alleen “knop”, zonder naam | Een knop zonder toegankelijke naam, meestal een icoonknop |
| “link” bij iets dat een actie uitvoert | Een a-element op een plek waar een button hoort |
| Tekst zonder “kop niveau” ervoor | De kop is alleen visueel opgemaakt, met een grotere letter |
| “groep” bij iets waarop je kunt klikken | Een div met een klikafhandeling, zonder rol en zonder toetsenbordbediening |
| Stilte bij een foutmelding of statusbericht | De melding staat niet in een live region en krijgt geen focus |
| Een menuknop die niets zegt over open of dicht | aria-expanded ontbreekt of wordt niet bijgewerkt |
Een schermlezer geeft je een signaal en geen oordeel. Controleer in de code wat je hoort voordat je het opschrijft als bevinding. Soms ligt het aan de pagina, soms aan de combinatie van browser en schermlezer, en dat verschil hoor je niet.
Wat een VoiceOver-test niet is
Het is geen simulatie van blind zijn. Laat je scherm aan tijdens het testen. Je zoekt juist het verschil tussen wat je ziet en wat je hoort, en dat verschil is het probleem. Ogen dicht doen geeft bovendien een vertekend beeld van hoe moeilijk iets is: een dagelijkse gebruiker kent zijn schermlezer, draait hem op een snelheid die jij niet kunt volgen en gebruikt sneltoetsen die jij niet kent.
Het dekt niet alles. Contrast, zoom tot 400%, zichtbare focus, bediening met alleen het toetsenbord en begrijpelijke taal zijn allemaal aparte tests.
Eén schermlezer is één combinatie. VoiceOver met Safari geeft andere uitkomsten dan NVDA met Firefox. Werkt iets in VoiceOver, dan werkt het niet automatisch overal. Voor Windows staat er een apart artikel over NVDA.
Veelgestelde vragen over VoiceOver
Moet ik VoiceOver installeren op mijn Mac?
Nee. VoiceOver zit in macOS zelf. Command + F5 zet hem aan en uit, en op een Mac met Touch ID werkt drie keer snel op de Touch ID-knop drukken ook.
Welke browser gebruik ik bij VoiceOver?
Safari. Chrome en Firefox werken ook met VoiceOver en gedragen zich op onderdelen anders, dus een uitkomst in Safari zegt niets over die browsers.
Wat is de VO-toets?
VO staat voor Control + Option. Bijna elk commando begint met die twee toetsen. Met Control + Option + puntkomma vergrendel je ze, zodat je ze niet steeds hoeft vast te houden.
Kan ik met VoiceOver zelf een toegankelijkheidsonderzoek doen?
Je vindt er problemen mee die geen enkele geautomatiseerde scan vindt. Een volledig onderzoek is breder: contrast, zoom, focuszichtbaarheid en toetsenbordbediening toets je apart, en een onderzoek dat je in het Register wilt gebruiken moet volgens WCAG-EM zijn uitgevoerd.
Hoe lang duurt het voordat ik VoiceOver kan bedienen?
Voor de commando’s uit dit artikel heb je ongeveer een uur nodig. Vlot werken met de rotor kost een paar sessies. Je hoeft VoiceOver niet zo goed te kennen als een dagelijkse gebruiker om er problemen mee te vinden.
Verder
Zet VoiceOver deze week één keer aan op je eigen homepage en vraag alleen de koppenlijst op. Dat is tien minuten werk en het levert bijna altijd iets op.
Twijfel je of iets wat je hoort een echt probleem is? Stuur je vraag naar [email protected]. En werk je op Windows, lees dan testen met NVDA.
