Tipps zur Barrierefreiheit für adaptive Karten

Copilot Studio-Agents arbeiten gut mit Bildschirmleseprogrammen unter Windows, wie zum Beispiel NonVisual Desktop Access (NVDA) und Job Access with Speech (JAWS). Berücksichtigen Sie diese Tipps, um die Barrierefreiheit zu optimieren.

Bildschirmlesegeräte

Für die Barrierefreiheit von Bildschirmlesern und Tastaturnavigation bei adaptiven Karten sind die folgenden Aspekte am wichtigsten.

• Geben Sie immer die Eigenschaft "label" an: Die Eigenschaft "label" ist das, was Bildschirmleseprogramme ansagen, wenn ein Benutzer sich auf eine Eingabe fokussiert. Ohne diese Information sagen Screenreader möglicherweise einfach "Feld bearbeiten" ohne weiteren Kontext. Screenreader lesen häufig keine Platzhalter, und sie verschwinden bei der Eingabe. Vermeiden Sie daher, sich auf sie zu verlassen, um die Barrierefreiheit zu unterstützen.

  {
    "type": "Input.Text",
    "id": "middleName",
    "label": "Middle name (optional)",
    "placeholder": "Enter your middle name"
  }
  

• Verwenden Sie "inputStyle" und "style" nachdenklich: Vermeiden Sie benutzerdefinierte Formatierungen, die Fokusindikatoren entfernen. Tastaturbenutzer benutzen den Standardfokusring, um zu wissen, wo sie sich auf dem Bildschirm befinden.

• Verwenden Sie "isRequired" und "errorMessage" für Leser: Selbst bei optionalen Feldern hilft eine klare "errorMessage" Bildschirmlesegeräten bei der Kommunikation von Validierungsfeedback.

  {
    "type": "Input.Text",
    "id": "middleName",
    "label": "Middle name (optional)",
    "isRequired": false,
    "errorMessage": "Please enter a valid middle name"
  }
  

• Logische Tab-Reihenfolge: Adaptive Karten folgen der DOM-Reihenfolge (Document Object Model) für die Tab-Navigation. Strukturieren Sie daher die JSON-Darstellung Ihrer Karte in der Reihenfolge, in der Benutzer durch die Karte tabben sollen. Vermeiden Sie die Verwendung von "ColumnSet"-Layouts, die eine visuell logische Reihenfolge erstellen, aber eine verwirrende Tab-Reihenfolge für Tastaturbenutzer.

• Aktionsschaltflächen sind standardmäßig über die Tastatur zugänglich: Eigenschaften wie "Action.Submit" und "Action.OpenUrl" können nativ fokussiert werden. Stellen Sie sicher, dass Ihr Titel beschreibend ist, anstatt etwas Vages wie "Hier klicken", da Screenreader den Titel laut vorlesen.

• Fügen Sie "type": "TextBlock" für Anweisungen hinzu: Wenn ein Abschnitt optionaler Felder Kontext benötigt, legen Sie "type" als "TextBlock" vor diesen Feldern fest. Sprachausgaben lesen Felder der Reihe nach, sodass Benutzer den Kontext erhalten, den sie brachen, bevor sie die Eingaben erreichen.

  {
    "type": "TextBlock",
    "text": "The following fields are optional. You can skip them if not applicable.",
    "wrap": true
  }
  

• Vermeiden Sie "isVisible": "false" für Barrierefreiheitsszenarien: Bildschirmleseprogramme überspringen vollständig ausgeblendete Elemente. Wenn Barrierefreiheit die Priorität hat, lassen Sie optionale Felder sichtbar. Wenn Sie sie ausblenden müssen, stellen Sie sicher, dass der Umschalter über eine klare, beschreibende Bezeichnung verfügt.

• Pro-Tipp für Tests in Microsoft Teams: Aufgrund geringfügiger Unterschiede bei der Unterstützung von Adaptive Cards in Microsoft Teams empfehlen wir, dass Sie die integrierte Windows-Sprachausgabe oder NVDA verwenden, um die Tab-Reihenfolge zu validieren und sicherzustellen, dass Ihre Ankündigungen erwartungsgemäß funktionieren.

Spezifische Schemaeigenschaften

Im Folgenden finden Sie einige spezifische Eigenschaften im Schema für adaptive Karten, die zur Verbesserung der Barrierefreiheit beitragen können.

Die Eigenschaft "label"

Die Eigenschaft "label" ist entscheidend für Bildschirmleseprogramme. Durch die Verbindung zwischen Labels und Eingaben können Renderer-Bibliotheken die notwendigen Eigenschaften festlegen, damit Benutzer von Assistenztechnologien, wie etwa Screenreadern, korrekt mit den Eingaben in adaptiven Karten interagieren können.

Weitere Informationen finden Sie in Input.Text.

Warum schlägt "Label" den Platzhalter für die Barrierefreiheit?

Wir empfehlen die Verwendung der Eigenschaft "label" zum Tagging von Eingabeparametern für Adaptive Cards anstelle der Eigenschaft "placeholder". Es ist eine einfache und prägnante Möglichkeit zur Bezeichnung von Eingaben für Kartenautoren.

Die Verwendung von "TextBlock"-Eigenschaften als Bezeichnungen verhindert, dass Sie die Nähe zwischen Eingaben und Bezeichnungen erzwingen. Mithilfe der Eigenschaft "label" können Sie sicherstellen, dass beide visuellen Elemente nebeneinander gerendert werden, wodurch Benutzer, die Bildschirmlupe benötigen, unterstützt werden.

Weitere Informationen finden Sie in der Eingabeüberprüfung.

Verwenden von "errorMessage" für Validierungsfeedback

Die Eigenschaft "errorMessage" ist für alle Eingabetypen verfügbar, um die Meldung anzugeben, die angezeigt werden soll, wenn ein Benutzer einen ungültigen Wert eingibt.

Weitere Informationen finden Sie in der Eingabeüberprüfung.

TextBlock mit dem Stil "Überschrift" für die Zugänglichkeitsstruktur.

Die Verwendung von "style": "heading" wendet die Standardformatvorlage für Überschriften an und kennzeichnet das TextBlock-Element als Überschrift für Barrierefreiheit.

Weitere Informationen finden Sie im TextBlock-Element.

Aktionsschaltflächen – "QuickInfo" für Erläuterungen

Die Aktion "Action.ToggleVisibility" unterstützt eine "Tooltip"-Eigenschaft, die Text definiert, der angezeigt wird, wenn der Benutzer mit der Maus über die Aktion fährt. Die Erzählsoftware liest diesen Text vor.

Weitere Informationen finden Sie unter Action.ToggleVisibility.

Vorsicht bei "isVisible": "false" für Eingabeelemente

Lassen Sie Eingabeelemente mit Validierung sichtbar. Eingabeelemente mit Überprüfung unter "Action.ToggleVisibility" können Verwirrung verursachen, wenn ausgeblendete Eingabeparameter ungültig sind.

Weitere Informationen finden Sie unter Action.ToggleVisibility.

Die Eigenschaft "labelPosition" für Input.ChoiceSet

Bei "Input.ChoiceSet" bestimmt die Eigenschaft "labelPosition" die Position der Bezeichnung, entweder inline oder höher (Standard).

Weitere Informationen finden Sie unter Input.ChoiceSet.