Campus Design System

Appearance

2.2.1 Voldoende tijd niveau A ​

Uitleg ​

Het WCAG-criterium 2.2.1 Voldoende tijd vereist dat gebruikers voldoende tijd krijgen om inhoud op een website te lezen en ermee te interageren. Dit criterium is bedoeld om ervoor te zorgen dat gebruikers met verschillende snelheden (bijvoorbeeld mensen met motorische of cognitieve beperkingen) niet gedwongen worden om snel te handelen bij het lezen of gebruiken van de inhoud.

Als de website functies heeft die tijdsdruk met zich meebrengen (zoals tijdslimieten voor het invullen van formulieren, of activiteiten waarbij de gebruiker binnen een bepaalde tijd moet reageren), moet er een mogelijkheid zijn om die tijdsdruk te verlengen of uit te schakelen. Dit garandeert dat gebruikers genoeg tijd hebben om de inhoud te begrijpen en te reageren zonder onder onredelijke druk te staan.

Wat betekent dit in de praktijk? ​

  • Geen onredelijke tijdslimieten: Als een gebruiker tijd heeft om een taak te voltooien, moet die tijd voldoende zijn voor de gemiddelde gebruiker om de taak af te ronden. Dit is vooral belangrijk voor taken zoals het invullen van formulieren, het uitvoeren van berekeningen, of het navigeren door complexe inhoud.

  • Mogelijkheid om tijdslimieten te verlengen: Als er een tijdslimiet is, moet de gebruiker de mogelijkheid hebben om die limiet te verlengen of de tijdslimiet helemaal uit te schakelen.

  • Geen automatische acties: Er mogen geen automatische acties plaatsvinden (zoals automatisch invullen of indienen van formulieren) die de gebruiker niet kan stoppen of vertragen, tenzij de gebruiker daar expliciet om heeft gevraagd.

Waarom is dit belangrijk? ​

Dit criterium zorgt ervoor dat gebruikers niet gedwongen worden om snel te reageren, wat kan leiden tot fouten of frustratie. Dit is vooral van belang voor gebruikers die beperkte motorische vaardigheden hebben, cognitieve uitdagingen ondervinden, of andere beperkingen die hun reactiesnelheid kunnen beïnvloeden. Het biedt een vangnet voor hen om hun taken op hun eigen tempo uit te voeren zonder tijdsdruk.

Voorbeeld van het probleem ​

Stel je voor dat een online formulier een tijdslimiet van 3 minuten heeft om in te vullen. Als de gebruiker te lang nadenkt of zich niet bewust is van de tijdslimiet, kan het formulier automatisch worden ingediend of opnieuw geladen, wat leidt tot verlies van gegevens of een onvolledig formulier.

Oplossing voor dit probleem ​

Als er een tijdslimiet is, moet er een optie zijn voor de gebruiker om de limiet te verlengen of de tijdslimiet helemaal uit te schakelen. Dit kan een duidelijke knop zijn die de gebruiker in staat stelt om de timer te verlengen of opnieuw in te stellen.

Goed voorbeeld:

html
<!-- Formulier met mogelijkheid om tijdslimiet te verlengen -->
<form id="formulier" action="/submit">
  <label for="naam">Naam:</label>
  <input type="text" id="naam" name="naam" required />

  <label for="email">Email:</label>
  <input type="email" id="email" name="email" required />

  <button type="submit">Verstuur</button>
</form>

<!-- Timer met mogelijkheid om uit te schakelen -->
<div id="timer">
  <p>De tijd is bijna om! Je hebt nog <span id="time">300</span> seconden.</p>
  <button id="extend-timer">Verleng de tijd</button>
</div>

<script>
  let timer = 300; // 300 seconden = 5 minuten
  let timerInterval = setInterval(function () {
    timer--;
    document.getElementById('time').textContent = timer;
    if (timer <= 0) {
      clearInterval(timerInterval);
      alert('Tijd is om!');
      // Stop of submit formulier hier
    }
  }, 1000);

  document.getElementById('extend-timer').addEventListener('click', function () {
    timer = 300; // Herstel de timer naar 5 minuten
  });
</script>

In dit voorbeeld is er een timer die telt en de gebruiker informeert over de resterende tijd. De gebruiker kan de timer verlengen door op een knop te drukken, waardoor ze extra tijd krijgen om het formulier in te vullen zonder druk.

Slecht voorbeeld:

html
<!-- Formulier met automatische time-out zonder verlengingsmogelijkheid -->
<form id="formulier" action="/submit">
  <label for="naam">Naam:</label>
  <input type="text" id="naam" name="naam" required />

  <label for="email">Email:</label>
  <input type="email" id="email" name="email" required />

  <button type="submit">Verstuur</button>
</form>

<!-- Timer zonder verlengingsoptie -->
<div id="timer">
  <p>Je hebt maar 3 minuten om dit formulier in te vullen!</p>
</div>

<script>
  setTimeout(function () {
    alert('Tijd is om! Het formulier wordt nu automatisch verzonden.');
    // Auto-submit formulier
    document.getElementById('formulier').submit();
  }, 180000); // 180.000 ms = 3 minuten
</script>

In dit slechte voorbeeld wordt de gebruiker gedwongen om het formulier binnen drie minuten in te vullen zonder dat er een mogelijkheid is om de tijdslimiet te verlengen of de timer te stoppen. Dit kan frustrerend zijn voor gebruikers die meer tijd nodig hebben om het formulier in te vullen.

Belangrijke overwegingen ​

  • Duidelijke meldingen over tijdslimieten: Als er een tijdslimiet is, moet de gebruiker duidelijk worden geïnformeerd over de tijdsbeperkingen en moet de resterende tijd regelmatig worden weergegeven.
  • Mogelijkheid om de tijdslimiet aan te passen: Geef gebruikers de mogelijkheid om de tijdslimiet te verlengen of helemaal uit te schakelen, afhankelijk van hun behoeften.
  • Geen automatische acties zonder toestemming: Zorg ervoor dat er geen automatische acties plaatsvinden (zoals het automatisch indienen van een formulier) zonder dat de gebruiker de mogelijkheid heeft om de actie te stoppen of uit te stellen.

Alternatieve benaderingen ​

  • Gebruik van timers die gebruikers kunnen pauzeren: Naast de mogelijkheid om de tijdslimiet te verlengen, kan de timer ook worden gepauzeerd door de gebruiker. Dit zou vooral handig zijn voor lange formulieren of complexe taken.
  • Instellingen voor tijdslimieten in toegankelijkheidsmenu: Bied een toegankelijkheidsinstelling aan waarin gebruikers kunnen kiezen of ze tijdslimieten willen gebruiken of uitschakelen.

Belangrijkste punten ​

  • Gebruikers moeten voldoende tijd hebben om inhoud te lezen, te begrijpen en ermee te interageren zonder dat er tijdsdruk is.
  • Mogelijkheid om de tijdslimiet te verlengen of uit te schakelen, vooral in gevallen waar de gebruiker beperkte tijd heeft om te reageren.
  • Geen automatische acties die de gebruiker niet kan stoppen, tenzij ze er expliciet om hebben gevraagd.

Tools en Hulpmiddelen ​

  • aXe Accessibility Tool: Controleer op tijdslimieten en informeer gebruikers over de tijdsdruk en of ze de limiet kunnen aanpassen. aXe Tool.
  • WAVE (Web Accessibility Evaluation Tool): Deze tool helpt bij het testen van tijdsbeperkingen en biedt gedetailleerde feedback. WAVE Tool.

Referenties ​