Suggerimenti per l'accessibilità per Adaptive Cards

Gli agenti di Copilot Studio funzionano bene con le utilità per la lettura dello schermo in Windows, ad esempio Accesso desktop nonvisuale (NVDA) e Accesso ai processi con Speech (JAWS). Per ottimizzare l'accessibilità, prendere in considerazione questi suggerimenti.

Utilità per la lettura dello schermo

Ecco cosa conta di più per l'accessibilità al lettore di schermo e alla navigazione tramite tastiera delle carte Adaptive.

  • Includere sempre la proprietà "label": la proprietà "label" è ciò che i lettori di schermo annunciano quando un utente focalizza su un input. Senza di esso, i lettori di schermo potrebbero dire solo il "campo di modifica" senza contesto. I lettori di schermo spesso non leggono i segnaposto, che scompaiono quando l'utente inizia a digitare. Pertanto, evitare di basarsi su di essi per facilitare l'accessibilità.

    {
      "type": "Input.Text",
      "id": "middleName",
      "label": "Middle name (optional)",
      "placeholder": "Enter your middle name"
    }
    
  • Usare "inputStyle" e "style" con attenzione: evitare stili personalizzati che rimuovono gli indicatori di messa a fuoco. L'anello di messa a fuoco predefinito è ciò a cui gli utenti della tastiera si affidano per sapere dove si trovano nella scheda.

  • Usare "isRequired" e "errorMessage" per i lettori: anche per i campi facoltativi, un chiaro "errorMessage" consente ai screen reader di comunicare il feedback di convalida.

    {
      "type": "Input.Text",
      "id": "middleName",
      "label": "Middle name (optional)",
      "isRequired": false,
      "errorMessage": "Please enter a valid middle name"
    }
    
  • Ordine di tabulazioni logiche: le schede adattive seguono l'ordine DOM (Document Object Model) per la navigazione tramite tab, quindi struttura la rappresentazione JSON della scheda nell'ordine in cui desideri che gli utenti effettuino le tabulazioni. Evitare di usare layout "ColumnSet" che creano un ordine logico visivo, ma un ordine di tabulazione confuso per gli utenti della tastiera.

  • I pulsanti di azione sono accessibili tramite tastiera per impostazione predefinita: le proprietà come "Action.Submit" e "Action.OpenUrl" sono focalizzabili nativamente. Assicurati che il titolo sia descrittivo piuttosto che vago come "Clicca qui", perché i lettori di schermo leggono il titolo ad alta voce.

  • Aggiungere "type": "TextBlock" per le istruzioni: se una sezione di campi facoltativi richiede contesto, impostare "type" su "TextBlock" prima di tali campi. Le utilità per la lettura dello schermo leggono i campi in sequenza, offrendo agli utenti il contesto necessario prima di raggiungere gli input.

    {
      "type": "TextBlock",
      "text": "The following fields are optional. You can skip them if not applicable.",
      "wrap": true
    }
    
  • Evitare "isVisible": "false" per gli scenari di accessibilità: i lettori di schermo ignorano completamente gli elementi nascosti. Se l'accessibilità è la priorità, mantenere visibili i campi facoltativi. Se è necessario nasconderli, assicurarsi che l'interruttore abbia un'etichetta chiara e descrittiva.

  • Suggerimento per i professionisti per i test in Microsoft Teams: a causa di lievi differenze nel supporto delle schede adattive, è consigliabile usare l'Assistente vocale di Windows predefinito o NVDA per convalidare l'ordine di tabulazioni e che gli annunci funzionino come previsto.

Proprietà specifiche dello schema

Ecco alcune proprietà specifiche nello schema delle schede adattive che consentono di migliorare l'accessibilità.

Proprietà "label"

La proprietà "label" è fondamentale per i lettori di schermo. Con una connessione tra etichette e input, le librerie del renderer possono impostare le proprietà necessarie per consentire agli utenti di tecnologie assistive, come i lettori di schermo, di interagire correttamente con gli input all'interno delle Adaptive Cards.

Altre informazioni sono disponibili in Input.Text.

Perché "etichetta" è migliore di "segnaposto" per l'accessibilità?

È consigliabile usare la proprietà "label" per contrassegnare i parametri di input delle schede adattive anziché la proprietà "segnaposto". È un modo semplice e conciso di etichettare gli input per gli autori di schede.

L'uso delle proprietà "TextBlock" come etichette impedisce di garantire la prossimità tra input e etichette. Usando la proprietà "etichetta", è possibile assicurarsi che entrambi gli elementi visivi siano resi uno accanto all'altro, il che aiuta gli utenti che necessitano di ingranditori dello schermo.

Per altre informazioni, vedere Convalida input.

Usare "errorMessage" per il feedback di convalida

La proprietà "errorMessage" è disponibile per tutti i tipi di input per specificare il messaggio da visualizzare quando un utente immette un valore non valido.

Per altre informazioni, vedere Convalida input.

TextBlock con "style": "heading" per una struttura accessibile

Utilizzando "style": "heading" si applica lo stile predefinito per le intestazioni e si contrassegna l'elemento TextBlock come intestazione per scopi di accessibilità.

Per altre informazioni, vedere Elemento TextBlock.

Pulsanti di azione: "tooltip" per la narrazione

L'azione "Action.ToggleVisibility" supporta una proprietà "tooltip" che definisce il testo visualizzato quando l'utente passa il mouse sull'azione. Il software di narrazione legge questo testo.

Per altre informazioni, vedere Action.ToggleVisibility.

Attenzione con "isVisible": "false" per gli elementi di input

Mantenere visibili gli elementi di input durante la convalida. Gli elementi di input con convalida in "Action.ToggleVisibility" potrebbero generare confusione quando i parametri di input nascosti non sono validi.

Per altre informazioni, vedere Action.ToggleVisibility.

Proprietà "labelPosition" per Input.ChoiceSet

Per "Input.ChoiceSet", la proprietà "labelPosition" determina la posizione dell'etichetta, inline o superiore (impostazione predefinita).

Altre informazioni sono disponibili in Input.ChoiceSet.