Correzione per lo scanner di accessibilità

Il tuo team utilizza Android Accessibility Scanner di Google?

In questa sezione verranno forniti suggerimenti per correggere le regole verificate dallo scanner. Per saperne di più su come sfruttare Accessibility Scanner e axe DevTools Mobile.

Per un elenco completo dei controlli, delle descrizioni e degli aggiornamenti correnti, visita le Linee guida di Google Accessibility Scanner .

Etichettatura dei contenuti

Etichetta dell'articolo mancante

Il contenuto dell'elemento dell'interfaccia utente potrebbe non contenere informazioni contestuali.

Per qualsiasi elemento dell'interfaccia utente che fornisca informazioni all'utente, fornire una delle seguenti opzioni per risolvere questo problema di accessibilità:

• android:contentDescription: Nella maggior parte dei casi, è sufficiente aggiungere una descrizione del contenuto.
• android:hint: È possibile aggiungere suggerimenti per descrivere il tipo di dati che l'utente deve immettere per le visualizzazioni di testo modificabili.
• android:labelFor: Questo tag consente di assegnare una vista come etichetta per un'altra vista.

Immagini decorative

Le immagini decorative che non forniscono informazioni importanti possono essere contrassegnate come non importanti ai fini dell'accessibilità.

Per XML: android:importantForAccessibility="no"

Oppure per Componi:

Image(
      imageVector = Icons.Filled.AccountCircle,
      contentDescription = null // decorative
    )

Elemento etichettato con tipo o stato

Una delle tue viste potrebbe avere uno stato ridondante. Android fornisce visualizzazioni predefinite con stati quali acceso, spento, selezionato o deselezionato. Aggiungere uno stato al feedback audio può dare origine a un'esperienza confusa.

Per risolvere questo problema di accessibilità, assicurati che:

• Le caselle di controllo hanno un'etichetta associata per il contesto
• Le descrizioni degli stati non vengono aggiunte alla descrizione della vista

<TextView
      android:id="@+id/edit_text_label"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:labelFor="@+id/example"
      android:text="Check Label" />

<androidx.appcompat.widget.AppCompatCheckBox
      android:id="@+id/example"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="@string/with_text"/>

Descrizioni degli articoli duplicati

Si è scoperto che più visualizzazioni all'interno della gerarchia presentavano descrizioni identiche.

Non si tratta di una violazione delle norme WCAG e potrebbero esserci casi in cui è un requisito. Se le descrizioni dei contenuti sono duplicate, assicurati che ciascuna fornisca un contesto sufficiente per far sapere all'utente quale sarebbe il risultato dell'interazione con la vista.

Scopo del collegamento non chiaro

Ogni collegamento dovrebbe contenere testo sufficiente a comunicarne lo scopo. Quando si utilizzano descrizioni come "Clicca qui", è necessario assicurarsi che il testo circostante contenga informazioni sufficienti a decifrare lo scopo del collegamento.

Implementazione - Elementi cliccabili

Link cliccabili

I link devono essere visualizzati in modo chiaro e facilmente accessibili dal menu contestuale locale. Google suggerisce di utilizzare URLSpan o la classe di convenienza Linkify per visualizzare i collegamenti ipertestuali nell'interfaccia utente di un'app per aumentare la probabilità che vengano rilevati e attivati.

Visualizzazioni cliccabili duplicate

Uno degli elementi cliccabili nella tua vista si sovrappone a un altro elemento cliccabile. Puoi risolvere questo problema di accessibilità in uno dei seguenti modi:

• Spostare gli elementi cliccabili in modo che non entrino in collisione o si sovrappongano.
• Se le viste non possono essere spostate, assicurati che entrambe le viste abbiano un'area di tocco di dimensioni adeguate e che chiunque possa interagire con gli elementi senza problemi.

Etichetta elemento modificabile

I campi modificabili devono avere un'etichetta che descrive lo scopo del campo.

Un esempio con EditText:

<TextView
      android:id="@+id/edit_text_label"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:labelFor="@+id/edit_text"
      android:text="Enter your username" />

<EditText
      android:id="@+id/edit_text"
      android:layout_width="0dp"
      android:layout_height="wrap_content"
      android:hint="Hint" />

Un esempio con CheckBox:

Utilizzare un TextView e associarlo all'elemento CheckBox:

val checkBox: CheckBox = ....... // Role: CheckBox
val label: TextView = ....... // Role: Label
label.setLabelFor(checkBox.getId()) // Associate the Checkbox with its Name

Tipo di elemento non supportato

Sembra che tu abbia una vista personalizzata. Modificare il AccessibilityNodeInfo per fornire al className uno scopo appropriato per la visualizzazione.

val frameLayout = findViewById<FrameLayout>(R.id.custom_view)
frameLayout.setAccessibilityDelegate(object : View.AccessibilityDelegate() {
      override fun onInitializeAccessibilityNodeInfo(
          host: View,
          info: AccessibilityNodeInfo
      ) {
            info.className = "ClassName"
            info.contentDescription = "ContentDescription"
            super.onInitializeAccessibilityNodeInfo(host, info)           
      }
})

Ordine di attraversamento

Se riesci a gestire le tue visualizzazioni utilizzando TalkBack in un modo che abbia senso in base al contesto, questo potrebbe essere un falso positivo e non deve essere affrontato.

Se TalkBack non fornisce le stesse informazioni della lettura dell'app senza tecnologia assistiva, potresti prendere in considerazione la possibilità di modificare l'ordine delle viste. Poiché può essere difficile farlo correttamente e potrebbe anche comportare l'aggiunta accidentale di un ciclo infinito, sconsigliamo di modificare l'ordine di attraversamento. Per modificare l'ordine di attraversamento, usa android:accessibilityTraversalBefore e android:accessibilityTraversalAfter.

Ridimensionamento del testo

Tutti gli elementi di testo dovrebbero utilizzare pixel scalabili (sp) anziché pixel indipendenti dalla densità (dp) per consentire al testo di ridimensionarsi in base alle impostazioni di accessibilità della dimensione del carattere del dispositivo.

Dimensione del target touch

Per suggerimenti e soluzioni per le aree visive e toccabili dei controlli attivi, fare riferimento alla Regola sulle dimensioni del bersaglio touch per la nostra libreria Android.

Basso contrasto

Il contrasto di colore tra il testo e lo sfondo deve rispettare le soglie minime WCAG 2 AA. Scopri di più su questo rapporto e trova suggerimenti per correggere il Contrasto Basso nella Regola Contrasto Colore della nostra libreria Android.