Ha un ruolo di accessibilità valido

Link to Ha un ruolo di accessibilità valido copied to clipboard
Free Trial
Not for use with personal data

ID della regola: has-valid-accessibility-role

WCAG 2.0 (A) 4.1.2

accessibilityRole comunica lo scopo di un componente all'utente della tecnologia assistiva.

accessibilityRole può essere uno dei seguenti:

  • regolabile Utilizzato quando un elemento può essere "regolato" (ad esempio un cursore).
  • avviso Utilizzato quando un elemento contiene testo importante da presentare all'utente.
  • pulsante Utilizzato quando l'elemento deve essere trattato come un pulsante.
  • casella di controllo Utilizzato quando un elemento rappresenta una casella di controllo che può essere selezionata, deselezionata o avere uno stato di selezione misto.
  • casella combinata Utilizzato quando un elemento rappresenta una casella combinata, che consente all'utente di selezionare tra più scelte.
  • intestazione Utilizzato quando un elemento funge da intestazione per una sezione di contenuto (ad esempio il titolo di una barra di navigazione).
  • immagine Utilizzato quando l'elemento deve essere trattato come un'immagine. Può essere combinato con un pulsante o un collegamento.
  • pulsanteimmagine Utilizzato quando l'elemento deve essere trattato come un pulsante ed è anche un'immagine.
  • tastotastiera Utilizzato quando l'elemento funge da tasto della tastiera.
  • link Utilizzato quando l'elemento deve essere trattato come un collegamento.
  • menu Utilizzato quando il componente è un menu di scelte.
  • menubar Utilizzato quando un componente è un contenitore di più menu.
  • menuitem Utilizzato per rappresentare una voce all'interno di un menu.
  • none Utilizzato quando l'elemento non ha alcun ruolo.
  • barra di avanzamento Utilizzato per rappresentare un componente che indica l'avanzamento di un'attività.
  • radio Utilizzato per rappresentare un pulsante radio.
  • radiogroup Utilizzato per rappresentare un gruppo di pulsanti radio.
  • barra di scorrimento Utilizzata per rappresentare una barra di scorrimento.
  • campo di ricerca Utilizzato quando un elemento del campo di testo deve essere trattato anche come campo di ricerca.
  • spinbutton Utilizzato per rappresentare un pulsante che apre un elenco di scelte.
  • riepilogo Utilizzato quando un elemento può essere utilizzato per fornire un rapido riepilogo delle condizioni correnti nell'app quando l'app viene avviata per la prima volta.
  • interruttore Utilizzato per rappresentare un interruttore che può essere acceso e spento.
  • tab Utilizzato per rappresentare un tab.
  • tablist Utilizzato per rappresentare un tablist.
  • testo Utilizzato quando l'elemento deve essere trattato come testo statico che non può cambiare.
  • timer Utilizzato per rappresentare un timer.
  • togglebutton Utilizzato per rappresentare un pulsante di attivazione/disattivazione. Dovrebbe essere utilizzato con accessibilityState verificato per indicare se il pulsante è attivato o disattivato.
  • barra degli strumenti Utilizzata per rappresentare una barra degli strumenti (un contenitore di pulsanti di azione o componenti).
  • griglia Utilizzata con ScrollView, VirtualizedList, FlatList o SectionList per rappresentare una griglia. Aggiunge gli annunci di ingresso/uscita dalla griglia a GridView di Android.

Perché è importante

Gli elementi a cui sono assegnati valori di ruolo non validi non vengono interpretati dalla tecnologia assistiva come previsto dallo sviluppatore.

Se gli screen reader e altre tecnologie assistive non conoscono il ruolo di ciascun elemento, non sono in grado di interagire con esso in modo intelligente né di comunicarne il ruolo all'utente. Le caratteristiche, le proprietà e i metodi di trasmissione delle informazioni da e verso l'utente di un elemento non possono essere comunicati tramite tecnologie assistive quando un valore di ruolo non è valido.

Come risolvere il problema

Assicurarsi che accessibilityRole il valore sia un ruolo valido.

Esempi validi

<TouchableOpacity accessibilityRole="button">
  <Text>Increase Count</Text>
</TouchableOpacity>

Esempi fallimentari

<TouchableOpacity accessibilityRole="secondary-button">
  <Text>Increase Count</Text>
</TouchableOpacity>

Risorse