Nom des éléments imbriqués

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
Not for use with personal data

WCAG 2.0 - 1.3.2 A Impact – Critique

Une vue focalisable doit avoir tout le texte visible dans son nom accessible disponible pour les technologies d'assistance telles que VoiceOver et Voice Control.

Impact

Les personnes utilisant VoiceOver sont les plus touchées. Les développeurs peuvent ajouter des paragraphes de texte à un élément d'accessibilité de conteneur, mais VoiceOver peut ne pas lire tout le texte dans le conteneur. Par conséquent, les personnes utilisant VoiceOver peuvent ne pas être conscientes de tout le texte à l’écran.

Confirmation

  1. Activer VoiceOver
  2. Concentrez-vous sur l'élément d'accessibilité contenant le texte
  3. L’une des situations suivantes se produira :
    • Inaccessible : VoiceOver ne lira pas le texte.
    • Accessible : VoiceOver lira tout le texte contenu dans la zone de focus.

Comment corriger

UIKit

Un problème détecté par cette règle est causé par l'utilisation de la valeur par défaut accessibilityLabel pour un élément d'accessibilité contenant plusieurs éléments de texte.

Pour résoudre ce problème, imposez que tout élément d'accessibilité contenant plusieurs éléments de texte ait tout le texte visible dans son accessibilityLabel :

let paragraphOne = UILabel()
let paragraphTwo = UILabel()
let accessibilityElement = UIView()

paragraphOne.text = "One paragraph of text about something."
paragraphTwo.text = "A second paragraph of text about something."

accessibilityElement.addSubviews([paragraphOne, paragraphTwo])

// Update the accessibility element's accessibilityLabel, so both paragraphs are read by VoiceOver.
view.accessibilityLabel = "\(paragraphOne.text) \(paragraphTwo.text)"

SwiftUI

Un problème détecté par cette règle dans SwiftUI indique une mauvaise utilisation du modificateur accessibilityElement en plus du modificateur accessibilityElement(children:..) .

Il est recommandé d'utiliser ces modificateurs sur une vue de regroupement plutôt que sur des éléments individuels. Notez l'ordre et le AccessibilityChildBehavior spécifié ci-dessous.

VStack(alignment: .leading) {
    HStack {
      Text("Title:")
      book.title.map({ title in
        Text(title)
      })
    }
    HStack {
      Text("Author:")
      book.author.map({ author in
        Text(author)
      })
    }

    HStack {
      Text("Genre:")
      book.genre.map({ genre in
        Text(genre)
      })
    }
}
.accessibilityElement()
.accessibilityElement(children: .combine)

React Native

Un problème détecté par cette règle dans les vues React Native indique une mauvaise utilisation de la propriété accessible et/ou accessibilityElementsHidden propriété.

Si vous ajoutez explicitement ces propriétés, assurez-vous qu'elles le sont bien true afin que le texte visible reste disponible pour les utilisateurs de technologies d'assistance.