Voice over van Mac gebruiken om je website te testen of deze goed navigeerbaar is met spraak en toetsenbord

voiceover van apple gebruiken om website te testen

Website testen met VoiceOver op Apple-apparaten

Hoe kun je voice over gebruiken om te testen op digitale toegankelijkheid? Voor dat we deze vraag beantwoorden, laten we eerst kijken wat VoiceOver is en hoe het werkt.

Wat is VoiceOver?

VoiceOver is beschikbaar op Mac, iPhone, iPad en Apple Watch. Voor webontwikkelaars is vooral de versie op Mac interessant, omdat je daarmee kunt testen of je website goed navigeerbaar is met spraak en toetsenbord.

Hoe kun je voice over gebruiken om te testen

Apple-apparaten hebben standaard een ingebouwde schermlezer genaamd VoiceOver. Dit is een toegankelijkheidsfunctie die gebruikers met een visuele beperking helpt om websites en apps te gebruiken. VoiceOver leest hardop voor wat er op het scherm staat, en laat gebruikers navigeren via toetsenbord of aanraking. Als webontwikkelaar of ontwerper kun je VoiceOver gebruiken om te testen of jouw website goed toegankelijk en bruikbaar is, ook zonder muis of zicht.

VoiceOver inschakelen op een Mac

Om VoiceOver op een Mac in te schakelen, kun je de sneltoets Command + F5 gebruiken. Je kunt het ook inschakelen via het menu: ga naar Systeeminstellingen, kies Toegankelijkheid, en selecteer vervolgens VoiceOver in de lijst aan de zijkant. Zet de optie aan.

[ Systeeminstellingen > Toegankelijkheid > VoiceOver ]

Zodra VoiceOver actief is, verandert de manier waarop je de computer bedient. De schermlezer gebruikt namelijk een speciale combinatie van toetsen, namelijk de VoiceOver-toetsen, die meestal bestaan uit de toetsen Control en Option. Deze worden vaak aangeduid als de VO-toetsen.

Navigeren met VoiceOver

Met VoiceOver navigeer je door de inhoud van een webpagina door gebruik te maken van de VO-toetsen in combinatie met pijltjestoetsen. Bijvoorbeeld:

  • Control + Option + Pijl-rechts om naar het volgende element op de pagina te gaan.
  • Control + Option + Pijl-links om terug te gaan naar het vorige element.
  • Control + Option + Spatiebalk om een knop of link te activeren.

Je kunt ook gewoon het toetsenbord gebruiken om te testen hoe iemand zonder muis je website zou ervaren. Gebruik bijvoorbeeld de Tab-toets om van het ene focusbare element naar het andere te springen, en Shift + Tab om terug te gaan.

De functie Rotor voor specifieke onderdelen op de page

Een andere handige functie is de Rotor. Deze kun je openen met Control + Option + U. Hiermee krijg je een overzicht van specifieke onderdelen op de pagina, zoals koppen, links of formuliervelden. Dit is een handige manier om snel te controleren of de structuur van je pagina logisch en toegankelijk is opgebouwd.

Een paar concrete voorbeelden om te testen

Tijdens het testen met VoiceOver kun je in ieder geval de volgende zaken testen:

  • Staan alle koppen in logische volgorde staan (H1 > H2 > H3, enz.)?
  • Hebben alle afbeeldingen een beschrijvende alt-tekst hebben?
  • Zijn Formulieren voorzien zijn van labels?
  • Kun je zonder muis de volledige website kunt bedienen?
  • Is Visuele focus (focusring) zichtbaar is bij toetsenbordnavigatie?

VoiceOver op iPhone of iPad

Ook op iPhone en iPad kun je VoiceOver gebruiken. Ga naar Instellingen, kies Toegankelijkheid, en zet VoiceOver aan. Navigatie gebeurt hier via veegbewegingen. Veeg bijvoorbeeld naar rechts om van element naar element te gaan, en tik dubbel om een geselecteerd item te activeren.

[ Instellingen > Toegankelijkheid > VoiceOver en zet het aan. ]

Testen om de website toegankelijk te maken mensen met een visuele handicap en mensen die de muis niet kunnen gebruiken

Door je website met VoiceOver te testen, zorg je ervoor dat deze toegankelijk is voor mensen die blind of slechtziend zijn, of die niet met een muis kunnen werken. Daarnaast draagt het bij aan een betere gebruikerservaring voor iedereen en helpt het om te voldoen aan internationale toegankelijkheidsrichtlijnen, zoals de WCAG (Web Content Accessibility Guidelines).

Wil je je website testen op andere kenmerken van digitale toegankelijkheid? Bekijk dan welke 7 gratis tools je hiervoor kunt gebruiken.

Volledige handleiding op apple.com

Gebruikershandleiding VoiceOver

deel dit artikel

categorieën