Een app op toegankelijkheid testen

Deze zelftest kan gebruikt worden om een app te testen op toegankelijkheid. Zonder ervaring een app testen op de volledige WCAG succescriteria is erg omvangrijk en complex. Om je app volledig te testen volgens de richtlijnen heb je tevens kennis van de hulpmiddelen nodig. Met deze test kun je zelf al een goede eerste indruk krijgen van de toegankelijkheidsstatus van de app.

Vragen zelftest app toegankelijkheid

Als het doel is om een beeld te vormen van toegankelijkheid hoef je niet de hele WCAG richtlijn te kennen. Wij hebben de WCAG richtlijn versimpelt tot een korte uitleg en een vraag. Disclaimer: Door de eenvoud van de vragen zal je een goed beeld krijgen. Je zult met 20% van de moeite waarschijnlijk al tot 80% van de fouten vinden. Toch zal het geen volledig beeld geven.

We gebruiken de hulpmiddelen tekstvergroting, de schermlezer en een meting van contrast. We beantwoorden 14 vragen. Wil je een volledig beeld kun je op de pagina richtlijnen meer te weten te komen over de volledige WCAG richtlijn.

Visueel testen

Zonder hulpmiddel kun je de onderstaande punten testen.

1. Ondertiteling bij video

Bij het publiceren van een video moet er ondertiteling zijn, zelfs bij live video. Hierdoor kunnen mensen die ondertiteling nodig hebben de inhoud ook direct tot zich nemen. Lees meer over (live) ondertiteling van een video bij WCAG pagina succescriterium 1.2.2 en pagina succescriterium 1.2.4.

Vraag: Is er ondertiteling beschikbaar bij video?

2. Beschrijving van video

Als er belangrijke informatie te zien is die je niet kunt horen moet je de informatie beschrijven. Dit doe je door een geluidsspoor aan te bieden waar de visuele informatie in beschreven wordt. Op deze manier kunnen mensen die blind zijn alle informatie horen. Lees meer bij WCAG pagina succescriterium 1.2.3 en pagina succescriterium 1.2.5.

Vraag: Zijn details die je ziet in video’s beschreven?

3. Scherm draaien

Gebruikers in een rolstoel hebben hun toestel soms horizontaal gemonteerd. De inhoud van het scherm moet meedraaien met de weergave van het toestel. Ondersteun een verticale en horizontale weergave. Lees meer bij WCAG pagina succescriterium 1.3.4.

Vraag: Draait de inhoud van het scherm mee als je je toestel draait?

4. Duidelijke instructies

Zorg voor duidelijke instructies wanneer je vraagt om gegevens in te vullen. Voeg een label toe aan de invoervelden, bijvoorbeeld ‘Voornaam’. Geef het aan indien gegevens volgens een vastgestelde volgorde ingevuld moeten worden. Markeer velden wanneer ze verplicht zijn. Lees meer bij WCAG pagina succescriterium 3.3.2.

Vraag: Is het bij een formulier duidelijk welke gegevens verwacht worden en welke velden verplicht zijn?

Tekstvergroting

Op de telefoon kun je bij de systeeminstellingen tekstvergroting aanzetten. Dit werkt op alle devices anders maar als je zoekt op “tekst” in de systeeminstellingen zie je de optie testgrootte staan. Als je deze dan op maximaal zet kun je vervolgens zien of jouw app gebruik maakt van groot lettertype en of dit niet tot fouten leidt.

5. Grotere tekst

Voor slechtziende gebruikers is het belangrijk dat tekst vergroot kan worden. Via de systeeminstellingen geven gebruikers hun voorkeur aan voor de lettergrootte. Zorg ervoor dat je app deze instelling gebruikt om tekst automatisch vergroot te weergeven. Lees meer bij WCAG pagina succescriterium 1.4.4 en pagina succescriterium 1.4.10.

Vraag: Wordt tekst groter weergeven wanneer je een groter lettertype hebt ingesteld en is alle tekst te lezen met het grootste lettertype?

Contrast

Je kunt eenvoudig jouw app testen op contrast. Beantwoord de vragen om een beeld te vormen of jouw app voldoende contrast heeft. Zelf gebruiken wij deze contrastchecker. Maar er zijn diverse tooltjes beschikbaar die contrast kunnen meten.

6. Contrast van tekst

Het is voor slechtziende en kleurenblinde gebruikers belangrijk dat tekst goed leesbaar is. De contrastverhouding tussen de tekstkleur en achtergrondkleur moet minimaal 4,5:1 zijn. Voor dikgedrukte tekst en grotere tekst voldoet een verhouding van 3:1. Lees meer bij WCAG pagina succescriterium 1.4.3.

Vraag: Is het contrast van normale tekst minimaal 4,5:1 en voor dikke of grote letters minimaal 3:1?

7. Contrast van inhoud

De inhoud van een scherm moet voor iedereen leesbaar zijn. Dit bereik je door genoeg kleurverschil te gebruiken bij grafische elementen zoals iconen, knoppen en invoervelden. Het contrast moet minimaal 3:1 zijn. Lees meer bij WCAG pagina succescriterium 1.4.11.

Vraag: Is het contrast van de inhoud minimaal 3:1?

Schermlezer

Een schermlezer, ook bekend als screen reader, leest voor wat er op het scherm te zien is. Door middel van gebaren kun je door apps heen navigeren en handelingen uitvoeren. Op deze manier is het mogelijk om zonder zicht gebruik te maken van apps. Meer informatie over de schermlezer vind je op onze kennisbank. Als de schermlezer goed werkt dan zullen toetsenbordbediening, stembediening en schakelbediening meestal ook goed werken. De gebaren van de schermlezer kun je oefenen in de screenreader.app.

8. Inhoud zonder tekst

Mensen die blind zijn maken gebruik van een schermlezer om de informatie op het scherm voor te laten lezen. Zorg ervoor dat er een beschrijving beschikbaar is voor alle inhoud zonder tekst. Denk hierbij aan afbeeldingen, door ze te beschrijven kan de schermlezer voorlezen wat er te zien is. Lees meer bij WCAG pagina succescriterium 1.1.1.

Vraag: Is er alternatieve tekst beschikbaar voor alle inhoud zonder tekst?

9. Duidelijke opbouw

Het is belangrijk dat de opbouw van een scherm niet alleen visueel wordt overgebracht. De opbouw van het scherm moet ook duidelijk zijn voor mensen die hulpmiddelen gebruiken. Zijn koppen gemarkeerd als kop, zijn lijsten los navigeerbaar. Lees meer bij WCAG pagina succescriterium 1.3.1.

Vraag: Is de opbouw van het scherm duidelijk bij het gebruiken van hulpmiddelen?

10. Begrijpelijke volgorde

Als de volgorde van de inhoud belangrijk is voor de betekenis dan moet je zorgen dat hulpmiddelen dezelfde volgorde gebruiken. Gebruikers navigeren normaal gesproken van links naar rechts en van boven naar onder. Controleer of dezelfde volgorde wordt gebruikt door hulpmiddelen. Lees meer bij WCAG pagina succescriterium 1.3.2.

Vraag: Is de volgorde van elementen duidelijk voor hulpmiddelen?

11. Bedienbaar met hulpmiddelen

Voorkom dat mensen die een extern toetsenbord gebruiken vast komen te zitten in je app. Het komt bijvoorbeeld vaak voor dat pop-ups niet gesloten kunnen worden met het toetsenbord. Lees meer bij WCAG pagina succescriterium 2.1.1.

Vraag: “Kan je de app bedienen met hulpmiddelen?

12. Vastzitten met toetsenbord

Voorkom dat mensen die een extern toetsenbord gebruiken vast komen te zitten in je app. Het komt bijvoorbeeld vaak voor dat pop-ups niet gesloten kunnen worden met het toetsenbord. Je kunt dit voor een groot gedeelte testen met de schermlezer. Lees meer bij WCAG pagina succescriterium 2.1.2.

Vraag: Zijn er plekken in de app waar je vast komt te zitten met het toetsenbord?

13. Koppen en labels

Het gebruik van koppen is belangrijk om te snappen hoe de inhoud is opgebouwd. Blinde gebruikers kunnen via een schermlezer een overzicht opvragen van alle koppen op het scherm. Het gebruik van labels is belangrijk bij formulieren om te begrijpen welke invoer gevraagd wordt. Zorg ervoor dat de labels gekoppeld zijn aan de invoervelden. Lees meer bij WCAG pagina succescriterium 2.4.6.

Vraag: “Beschrijven de koppen en labels de content voldoende duidelijk?

14. Naam, rol, waarde

Voor gebruikers met hulpmiddelen moet het duidelijk zijn welke acties ze kunnen uitvoeren. Zorg dat voor alle elementen de naam, rol en waarde bepaald kan worden bepaald. Wanneer je een afbeelding gebruikt als knop, moet je de rol instellen als knop. Lees meer bij WCAG pagina succescriterium 4.1.2.

Vraag: Wordt de juiste naam, rol en waarde gegeven?

Wat na zelftest app toegankelijkheid?

Lees meer over onze toolkit hoe je apps stap voor stap toegankelijk maakt.