Geneste Actieve Besturing

Lees hoe we kunstmatige intelligentie gebruiken voor deze regel!

Wat We Controleren

Een toegankelijkheidselement mag niet meerdere actieve besturingselementen bevatten. TalkBack kan niet meer dan één besturingselement binnen een enkel toegankelijkheidselement activeren, dus de gebruiker moet elk actief besturingselement individueel kunnen focussen en ermee kunnen interactieren.

Foutief Voorbeeld ❌

TalkBack focuses each entire card as a single unit

De knoppen "Toevoegen aan winkelwagen", verlanglijst en delen die in elke kaart zijn genesteld, zijn onbereikbaar

TalkBack-gebruikers kunnen geen individuele bedieningen binnen de kaart activeren

Correct Voorbeeld ✅

Elke bediening binnen een kaart is individually focusable door TalkBack

TalkBack navigeert naar de afbeelding, productnaam, "Toevoegen aan winkelwagen", verlanglijst en deelknop als afzonderlijke elementen

Gebruikers kunnen elke actie onafhankelijk activeren

In Een Oogopslag

• Deze regel heeft een kritische impact voor gebruikers
• Een toegankelijkheidselement mag geen meerdere interactieve besturingselementen bevatten die individueel klikbaar zijn maar verborgen zijn voor ondersteunende technologie
• TalkBack kan slechts één actie per gefocust element activeren - als meerdere besturingselementen genest en verborgen zijn, kunnen gebruikers er niet onafhankelijk bij komen

Impact op Gebruikers

Mensen die TalkBack gebruiken, worden het meest getroffen. Wanneer meerdere actieve besturingselementen zijn genest binnen een enkel toegankelijkheidselement, kan TalkBack slechts één van hen activeren of mogelijk een geheel verkeerde activeren. Dit betekent dat gebruikers mogelijk een onbedoelde actie activeren, helemaal geen reactie krijgen, of volledig niet in staat zijn om bepaalde besturingselementen te bereiken.

Bevestig Probleem met Geneste Actieve Besturing

1. Schakel TalkBack in
2. Probeer op de besturing te focussen
3. Probeer de besturing te activeren
4. Een van de volgende dingen zal gebeuren:
   • Onaantoegankelijk: Er gebeurt niets
   • Onaantoegankelijk: De besturing wordt geactiveerd, maar het focusvak bevat een andere besturing
   • Onaantoegankelijk: Een andere besturing wordt geactiveerd
   • Toegankelijk: De besturing wordt geactiveerd en is de enige besturing in het focusvak

Los Problemen Op

Vermijd geneste klikbare elementen. Zorg ervoor dat elk klikbaar item individueel kan worden gefocust door ondersteunende technologie. Als een bovenliggend element een algemene actie moet afhandelen, moeten onderliggende besturingselementen verborgen zijn voor ondersteunende technologie, zodat gebruikers niet worden geconfronteerd met conflicterende of onbereikbare interacties.

XML

Do not set the importantForAccessibility property to "no" on clickable elements nested inside a layout. If child controls should not be individually accessible, ensure the parent handles the action and is the only focusable element.

Compose

Vermijd het onderstaande patroon, waarbij er een klikbare ouder is met verborgen kinderen met invisibleToUser() — TalkBack-gebruikers kunnen de verborgen kinderen niet bereiken:

Row(modifier = Modifier.clickable { ... }) {
    Text("Settings", 
        modifier = Modifier.clickable { ... }
            .semantics { 
        invisibleToUser() 
    })
    Text("Information", 
        modifier = Modifier.clickable { ... }
            .semantics { 
        invisibleToUser() 
    })
}

Als de kinderen individuele acties hebben, zorg ervoor dat het bovenliggend element niet ook klikbaar is. Het voorbeeld hieronder toont elk kind als onafhankelijk klikbaar, met een niet-klikbaar bovenliggend element:

Row {
    Text("Settings", 
        modifier = Modifier.clickable { ... })
    Text("Information", 
        modifier = Modifier.clickable { ... })
}

React Native

Als een onderliggend controle-element niet individueel gefocust mag worden, zorg ervoor dat het bovenliggende element toegankelijk is en de actie afhandelt. Stel importantForAccessibility='no-hide-descendants' in op het kind zodat het verborgen is voor assistieve technologie:

<TouchableOpacity
   style={{flexDirection:'row', alignItems: 'center',}}
   onPress={() => props.navigation.navigate('FocusableTextExample')}
   accessible={true}
   accessibilityLabel={"Purchase items in your shopping cart"}>
     <Button title="Buy"
       importantForAccessibility='no-hide-descendants'
       accessibilityElementsHidden='true'
       adjustsFontSizeToFit={true}
       marginBottom={20}
       titleStyle={{
         color: "white",
         fontSize: 20,
        }}
        buttonStyle={{
          height: 50,
          width: 200
        }}
     />
</TouchableOpacity>

Kan Ik Deze Regel Negeren?

Genest Actieve Controle heeft een Kritische impact voor gebruikers, en we raden sterk aan om deze problemen te corrigeren. Omdat dit een experimentele regel is, moet je de resultaten handmatig verifiëren. Als je hebt bevestigd dat alle actieve controles binnen het element individueel bereikbaar en activeerbaar zijn door TalkBack, kan het acceptabel zijn om de bevinding te negeren. Lees meer over regels negeren.

Middelen

Deque University Cursuspagina's

• 2.1.1 Toetsenbord (A)

Opmerking: Volledige toegang tot Deque University-bronnen vereist een abonnement.

Overige Bronnen

• Web Content Accessibility Guidelines (WCAG) 2.1, W3C Aanbeveling
  • Succescriterium 2.1.1 - Toetsenbord
• WCAG 2.1 Begrip Documenten
  • Inzicht in 2.1.1 A - Toetsenbord