2.1.1 Toetsenbord

Succescriterium 2.1.1 Toetsenbord

Alle functionaliteit van de content is bedienbaar via een toetsenbordinterface zonder dat afzonderlijke toetsaanslagen aan tijd gebonden zijn, behalve als de onderliggende functie een invoer vereist die afhangt van het pad dat de gebruiker aflegt en niet alleen van de eindpunten.

Noot 1

Deze uitzondering is gerelateerd aan de onderliggende functie, niet aan de invoertechniek. Als we bijvoorbeeld met de hand geschreven tekst invoeren, vereist de invoertechniek (met de hand geschreven tekst) pad-afhankelijke invoer, maar de onderliggende functie (tekstinvoer) vereist dat niet.

Noot 2

Dit succescriterium verbiedt geen muisinvoer of andere invoermethoden naast de toetsenbordinvoer en wil dit ook niet ontmoedigen.

Toetsenbord begrijpen (Engelstalig)

Niet iedereen kan een muis gebruiken. Mensen met een visuele beperking zien de muisaanwijzer bijvoorbeeld niet (of niet goed). Anderen kunnen door een fysieke of motorische beperking moeite hebben met nauwkeurige bewegingen. Zij bedienen de computer met het toetsenbord, of met software die werkt als een toetsenbord. Denk aan spraakbesturing, een schermtoetsenbord of een schakelaar.

Zorg daarom dat alle functionaliteit van je website (ook) te bedienen is met een toetsenbord. Hieronder vallen onder andere links, knoppen en formulierelementen.

Let op: Het succescriterium vereist niet dat elk bedieningselement afzonderlijk met het toetsenbord te bedienen is. Het gaat erom dat toetsenbordgebruikers dezelfde acties kunnen uitvoeren.

Er is een uitzondering voor functionaliteit die afhangt van het pad dat de gebruiker aflegt. Denk aan tekenen uit de vrije hand of schilderen met een penseel. Het gaat om de functie, niet om de manier van invoeren.

Hoe pas je dit toe?

  • Zorg dat alle functionaliteit te bereiken en te bedienen is met alleen het toetsenbord.
  • Zorg dat bediening met het toetsenbord niet aan tijd gebonden is.
Navigeren met het toetsenbord
TaakToets
Naar het volgende bedieningselementTab
Naar het vorige bedieningselementShift + Tab
Link activerenEnter
Knop activerenEnter of Spatie
Selectievakje selecterenSpatie
Navigeren tussen keuzerondjes↑ (pijltje naar boven) en ↓ (pijltje naar beneden)
Keuzerondje selecterenSpatie
Keuzelijst openenSpatie
Navigeren in een keuzelijst↑ (pijltje naar boven) en ↓ (pijltje naar beneden)
Element sluitenEscape
Taak met bijbehorende toets of toetsen

Lees het artikel over toetsenbordtoegankelijkheid

Voor wie is dit belangrijk?

  • Mensen die alleen het toetsenbord gebruiken.
  • Mensen die een fysieke of motorische beperking hebben.
  • Mensen die een schermlezer gebruiken.
  • Mensen die blind of slechtziend zijn.

Wie is verantwoordelijk?

Hoe toets je dit?

Benodigdheden
  • Minimaal twee verschillende browsers (bijvoorbeeld Chrome en Firefox)
  • Minimaal twee verschillende schermlezers (bijvoorbeeld NVDA en VoiceOver)
  • Optioneel: Stylus browser-extensie
    • In combinatie met mijn CSS-stijl: Maak focus zichtbaar
    • Als de standaard focusindicator niet duidelijk zichtbaar is
Uitzonderingen

Uitzonderingen zijn:

  • functies die invoer nodig hebben die afhangt van het pad van de beweging, zoals tekenen uit de vrije hand
Testprocedure

Test 1: Toetsenbord

  1. Verken de pagina met muis en toetsenbord
    • Bepaal welke functionaliteiten en bedieningselementen er zijn:
      • Links
      • Knoppen
      • Formulierelementen (invoervelden, keuzelijsten, selectievakjes, keuzerondjes, schuifregelaars)
      • Navigaties en subnavigaties
      • Accordeons of andere elementen die kunnen uitvouwen en samenvouwen
      • Dialoogvensters
      • Carrousels
      • Tabbladen
      • Mediaspelers
      • Functies die werken met slepen (sorteren, verplaatsen, uploaden)
      • Elementen met scrollbare inhoud
      • Maatwerk bedieningselementen
  2. Herlaad de pagina
  3. Navigeer met alleen het toetsenbord en controleer
    • Of elke functie te bereiken is met Tab, Shift + Tab en/of pijltoetsen
    • Of elke functie uit te voeren is met het toetsenbord
    • Of de content in elk scrollbaar element te scrollen is met de pijltoetsen
    • Of geen enkele functie vraagt om een toets snel achter elkaar of lang in te drukken
  4. Herlaad de pagina
  5. Schakel een schermlezer in
  6. Navigeer met alleen het toetsenbord en controleer:
    • Of elke functie ook met de schermlezer uit te voeren is
  7. Herhaal stap 3 tot en met 6 in een andere browser

Belangrijk om te weten

  • Toetsenbordbediening hoeft niet precies hetzelfde te zijn als muisbediening. Het gaat erom dat dezelfde functionaliteit beschikbaar is, ook al zijn er meer stappen nodig of zijn de stappen anders.
  • Niet elk bedieningselement hoeft zelf de focus te krijgen. Een verzendknop zonder focus is geen fout als Enter in het invoerveld het formulier verstuurt.
  • Enter voor links en Enter of de spatiebalk voor knoppen zijn afspraken, geen eisen. Werkt een knop alleen met Enter, of met een andere toets? Dan voldoet hij aan dit criterium.
Beoordeling
  • Alle functionaliteit moet bereikbaar zijn met alleen het toetsenbord
  • Alle functionaliteit moet bedienbaar zijn met alleen het toetsenbord
  • Bediening met het toetsenbord moet geen specifieke timing van toetsaanslagen vereisen

Bronnen

Andere richtlijnen

Lees verder

Laatst gewijzigd op