Conflicterende Eigenschappen

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard

Ken geen tegenstrijdige toegankelijkheidseigenschappen toe aan hetzelfde element

Not for use with personal data
Best Practice Impact - Critical

Wat We Controleren

Elk weergave - een interactief element zoals een knop, label of aangepaste controle - kan worden toegewezen toegankelijkheidseigenschappen. Deze metadata vertelt VoiceOver wat voor soort element het is en hoe ermee te interactie te hebben. Deze regel controleert of geen enkel onderdeel eigenschappen toegewezen krijgt die elkaar tegenspreken of de VoiceOver-navigatie verstoren.

Deze regel handhaaft een best practice die is gedefinieerd onder Apple's UIKit Accessibility Traits. U kunt deze regel uitschakelen vanuit de mobiele dashboard of door de regel te negeren in tests geschreven voor iOS.

Foutief voorbeeld ❌

An iOS phone screen showing a 'Read article' button. A VoiceOver bar at the bottom reads 'Read article, Button, Link' — two conflicting roles announced for a single element

Aan een knop is both the button and link traits

VoiceOver kondigt two conflicting roles gelijktijdig aan:
„Lees artikel, Knop, Link“

Dit is verwarrend en misleidend — een enkel element mag nooit twee tegenstrijdige rollen hebben

Goed voorbeeld ✅

An iOS phone screen showing a 'Read article' button. A VoiceOver bar at the bottom reads 'Read article, Link' — a single correct role for the element

Het element is only the link trait

VoiceOver kondigt een enkele, duidelijke rol aan:
„Lees artikel, Link“

Navigatiegebaren werken zoals verwacht voor de toegewezen rol

In Een Oogopslag

  • Deze regel heeft een kritieke impact voor gebruikers
  • Toegankelijkheidseigenschappen vertellen VoiceOver wat een element is en hoe ermee om te gaan - tegenstrijdige eigenschappen zorgen voor verwarrend of defect gedrag
  • Veelvoorkomende conflicten: rolkenmerken zoals „knop“ + „link“, of navigatie-eigenschappen zoals „header“ + „aanpasbaar“

Impact op Gebruikers

Mensen die VoiceOver en Switch Control gebruiken, worden het meest beïnvloed. Wanneer een element tegenstrijdige eigenschappen heeft, kan VoiceOver twee rollen tegelijkertijd aankondigen (bijvoorbeeld „Knop, Link“), wat verwarrend en misleidend is. Bepaalde eigenschapcombinaties - zoals „header“ en „aanpasbaar“ - kunnen ook VoiceOver-navigatiegebaren verstoren, waardoor delen van het scherm onbereikbaar worden.

Bevestig Probleem met Conflicterende Eigenschappen

  1. Schakel VoiceOver in
  2. Focus op het element
  3. Een van de volgende dingen gebeurt:
    • Onbereikbaar: VoiceOver kondigt twee conflicterende rollen aan (zoals „Knop“ en „Link“)
    • Onbereikbaar: Een VoiceOver-navigatiegebaar stopt met werken (bijvoorbeeld door zowel „header“ als „aanpasbaar“ samen te gebruiken)
    • Bereikbaar: Alle rollen zijn onderscheidend en navigatiegebaren werken zoals bedoeld

Los Problemen op

Om een probleem met Conflicterende Eigenschappen op te lossen, zorg ervoor dat elk element slechts één rolkenmerk heeft en dat alle toegewezen eigenschappen compatibel zijn met elkaar.

UIKit

Om op te lossen in het Storyboard:

  1. Selecteer het element met conflicterende toegankelijkheidseigenschappen.
  2. Zorg ervoor dat het Inspector-paneel zichtbaar is.
  3. Selecteer de Identity Inspector.
  4. Onder Toegankelijkheid, vind de Eigenschappen categorie en vink de conflicterende eigenschap uit.

Om het in de code op te lossen, verwijdert u de conflicterende eigenschap. Bijvoorbeeld, als een knop ten onrechte zowel .button als .link toegewezen krijgt:

button.accessibilityTraits = [.button, .link]

Houd alleen de eigenschap die het werkelijke gedrag van het element weerspiegelt. Als het element zich als een link gedraagt, verwijder dan de knop-eigenschap:

button.accessibilityTraits = .link

SwiftUI

Gebruik .accessibility(addTraits:) en .accessibility(removeTraits:) samen om ervoor te zorgen dat het element alleen de eigenschappen heeft die zijn gedrag nauwkeurig weerspiegelen. Bijvoorbeeld, als een knop een link nabootst, verwijder dan de standaard knopeigenschap en voeg de keuzenlink-eigenschap toe:

var body: some View {
    Button(action: { openLink() },
           label: {
        Text("Visit the website").padding()
    })
    .accessibility(addTraits: .isLink)
    .accessibility(removeTraits: .isButton)
}

React Native

Deze regel wordt waarschijnlijk niet geactiveerd op React Native-elementen, omdat accessibilityRole slechts één waarde accepteert. Gebruik de accessibilityRole waarde die het verwachte gedrag van het element het nauwkeurigst beschrijft:

<Button
  title={'Learn more about axeDevTools'}
  accessible={true}
  accessibilityRole='link'
  onPress={goToLink}
/>

Kan ik deze regel negeren?

Conflicterende Eigenschappen heeft een kritische impact voor gebruikers, en we raden aan stappen te ondernemen om dit probleem te verhelpen. Hoewel deze regel een Apple best practice afdwingt, is het zeer impactvol. Als een bedieningselement conflicterende eigenschappen heeft, kunnen VoiceOver-gebruikers er mogelijk helemaal niet mee interageren. Het is echter mogelijk om deze regel uit te schakelen vanuit de mobiele dashboard of individuele bevindingen in uw iOS-tests te negeren. Lees meer over regels negeren.

Bronnen