Campus Design System

Appearance

2.5.4 Bewegings-activering niveau A ​

Uitleg ​

Het WCAG-criterium 2.5.4 Bewegings-activering gaat over het voorkomen van onbedoelde acties die worden veroorzaakt door bewegingen van een apparaat, zoals het kantelen of schudden van een mobiel apparaat. Het doel is om ervoor te zorgen dat de gebruiker geen acties kan uitvoeren door een onverwachte beweging van het apparaat, bijvoorbeeld het bewegen van de telefoon of het gebruiken van bepaalde gebaren die onverwachte interacties activeren.

Voor mensen met motorische beperkingen of onbedoelde bewegingen kan het mogelijk zijn dat een ongecontroleerde beweging van hun apparaat (zoals schudden of kantelen) leidt tot een onbedoelde actie. Dit criterium vereist dat de gebruiker de mogelijkheid heeft om dergelijke acties uit te schakelen of te vermijden.

Wat betekent dit in de praktijk? ​

Dit betekent dat gebruikers geen ongewenste acties mogen uitvoeren door een beweging of gebaar die toevallig of onbedoeld wordt uitgevoerd. Het kan bijvoorbeeld gaan om het schudden van een mobiel apparaat, het draaien van een apparaat van liggend naar staand, of het gebruik van bewegingen om knoppen in te schakelen.

Het is belangrijk om ervoor te zorgen dat bewegingen die als interactie dienen, alleen actief kunnen zijn als de gebruiker dit expliciet heeft geïnitieerd. Daarnaast moeten er altijd alternatieve manieren zijn om dezelfde actie uit te voeren zonder gebruik te maken van bewegingen.

Voorbeeld van het probleem ​

Een veelvoorkomend voorbeeld van motion actuation is de functie waarbij een apparaat automatisch een actie uitvoert als het wordt geschud, bijvoorbeeld het annuleren van een actie of het terugkeren naar een vorige pagina wanneer het apparaat wordt geschud.

html
<!-- Onjuiste implementatie -->
<script>
  window.addEventListener('devicemotion', function (event) {
    // Schudden van het apparaat wordt gebruikt om een actie uit te voeren
    if (event.acceleration.x > 10) {
      alert('Actie geannuleerd');
    }
  });
</script>

In dit voorbeeld is er geen manier om te voorkomen dat het schudden van het apparaat leidt tot een onbedoelde actie, zoals het annuleren van een actie.

Oplossing voor dit probleem ​

Om te voldoen aan dit criterium moet je ervoor zorgen dat bewegingen geen acties triggeren, tenzij dit expliciet door de gebruiker is aangevraagd. Je kunt bijvoorbeeld gebruikersinstellingen bieden waarmee ze bewegingsactivering kunnen in- of uitschakelen. Bovendien moeten alternatieve methoden voor interactie beschikbaar zijn, zodat de gebruiker dezelfde acties kan uitvoeren zonder gebruik van bewegingen.

html
<!-- Correcte implementatie -->
<script>
  // Zorg ervoor dat de actie alleen via een knop wordt geactiveerd
  document.getElementById('cancelButton').addEventListener('click', function () {
    alert('Actie geannuleerd');
  });
</script>

<button id="cancelButton">Annuleer actie</button>

In dit geval wordt de actie alleen geactiveerd wanneer de gebruiker op de "Annuleer actie"-knop klikt, in plaats van automatisch via een beweging.

Belangrijke overwegingen ​

  • Bewegingen uitschakelen: Zorg ervoor dat gebruikers de mogelijkheid hebben om de motion actuation (zoals schudbewegingen of kantelen) uit te schakelen, bijvoorbeeld via de instellingen van de applicatie of het systeem.
  • Alternatieven aanbieden: Als een actie via beweging kan worden geactiveerd (zoals het schudden van een apparaat), bied dan altijd een alternatieve manier van interactie via knoppen of andere bedieningsopties.
  • Consistentie: Zorg ervoor dat wanneer een functie zoals motion actuation is geïmplementeerd, deze consistent werkt op alle apparaten en platformen waar de app of website beschikbaar is.

Tools en Hulpmiddelen ​

  • WAVE Accessibility Tool: Met WAVE kun je snel controleren of bewegingen correct worden gebruikt en of er alternatieve interacties worden aangeboden. WAVE Tool.
  • aXe Accessibility Tool: Deze tool helpt bij het controleren van de toegankelijkheid van apps en websites, en kan helpen bij het detecteren van ongewenste motion actuation. aXe Tool.

Referenties ​