Succescriterium 2.4.3 – Focus volgorde

Zorg dat hulpmiddelen een logische focus volgorde aanhouden bij het navigeren. De volgorde om door een scherm te navigeren is meestal van links naar rechts, van boven naar onder. Zorg dat de focus van hulpmiddelen gelijk is. Het verschil met succescriterium 1.3.2 is dat het hier alleen gaat over de focus volgorde.

Impact

Mensen die hulpmiddelen zoals schermlezer, toetsenbord en schakelbediening gebruiken hebben baat bij een focus volgorde die logisch is.

Controleren

Gebruiken hulpmiddelen een logische volgorde om door het scherm te navigeren?

Dit kan getest worden met de schermlezer of toetsenbord.

Oplossing

Op Android kun je het android:focusable attribuut gebruiken om focus toe te staan of te weigeren. Met de setTraversalAfter en setTraversalBefore methodes van AccessibilityNodeInfoCompat kun je de volgorde voor hulpmiddelen instellen. De methodes setAccessibilityTraversalAfter en setAccessibilityTraversalBefore maken het gebruik makkelijker.

De methode android:nextFocusForward kan ook handig zijn om het volgende element in te stellen. Je kunt de focus volgorde voor toetsenbord zelfs in meerdere richtingen instellen:

field2.setAccessibilityTraversalAfter(field1.id)
field3.setAccessibilityTraversalBefore(field4.id)
<View
    android:id="@+id/notFocusable"
    android:focusable="false"/>

<EditText
    android:id="@+id/field1"
    android:focusable="true"
    android:nextFocusForward="@+id/field2"
    android:nextFocusDown="@+id/field3"
    android:nextFocusRight="@+id/field2"
</EditText>

<EditText
    android:id="@+id/field2"
    android:focusable="true"
    android:nextFocusForward="@+id/field3"
    android:nextFocusDown="@+id/field4"
</EditText>

<EditText
    android:id="@+id/field3"
    android:focusable="true"
    android:nextFocusForward="@+id/field4"
</EditText>

<EditText
    android:id="@+id/field4"
    android:focusable="true"
</EditText>

Op iOS kun je gebruik maken van het isAccessibilityElement om te zorgen dat hulpmiddelen op elementen kunnen focussen. De volgorde van navigeren kun je aanpassen via het accessibilityElements attribuut. Het accessibilityRespondsToUserInteraction attribuut kan gebruikt worden om navigatie via toetsenbord en schakelbediening te optimaliseren.

field1.isAccessibilityElement = true
field2.isAccessibilityElement = true
field3.isAccessibilityElement = true
field4.isAccessibilityElement = true

imageView.isAccessibilityElement = true
imageView.accessibilityLabel = "Description of image"
imageView.accessibilityRespondsToUserInteraction = false

view.accessibilityElements = [field1, field2, imageView, field3, field4]

Referenties

Meer succescriteria