Titel des Bildschirms

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 – 2.4.2 Mittel Auswirkung – Mäßig

Jeder Bildschirm innerhalb einer Anwendung sollte einen Titel enthalten, der von der assistiven Technologie angesagt wird.

Auswirkung

Bildschirmtitel ermöglichen es Benutzern mit visuellen, kognitiven und motorischen Behinderungen und eingeschränktem Kurzzeitgedächtnis, zu bestimmen, wo sie sich in der Anwendung befinden, Inhalte auf einem Bildschirm anhand ihres Titels zu identifizieren und zwischen Bildschirmen zu navigieren, wenn die Art und Weise der Bedienung eines Benutzers vom Audio abhängt.

Bestätigung

  1. Gehen Sie in der App zu einem neuen Bildschirm
  2. Eines der folgenden Ereignisse wird eintreten:
    • Nicht barrierefrei: VoiceOver gibt keinen Bildschirmtitel aus
    • Barrierefrei: VoiceOver gibt den Bildschirmtitel bekannt

So beheben Sie das Problem

Dieses Problem tritt auf, wenn einem Bildschirm kein Titel zugewiesen wird.

UIKit

Im Code:

Suchen Sie den ViewController, der die Regel verletzt, und setzen Sie die Titeleigenschaft des Navigationscontrollers.

navigationController?.title = "Screen Title Here"

Alternativ können Sie die Eigenschaft title direkt im ViewController festlegen.

title = "Screen Title Here"

SwiftUI

Fügen Sie am Ende des letzten Elements innerhalb der body-Eigenschaft der Ansicht einen Ansichtsmodifikator .navigationTitle hinzu.

 var body: some View {
        VStack {
            Text("Below is a stepper in SwiftUI")
            StepperView()
        }.navigationTitle("Screen Title")
    }

React Native

Stellen Sie sicher, dass jede Stack.Screen Komponente einen beschreibenden Namen hat. Fügen Sie bei Bedarf options={{title: 'New Screen Title'}} hinzu, um einen besseren Bildschirmtitel zu definieren.

<Stack.Screen
    name="ScreenTitleExample"
    component={ScreenTitleExample}
    options={{title: 'Screen Title'}}
/>

Benutzerdefinierte Navigationsleisten

Was wir bei mit React Native erstellten Anwendungen festgestellt haben, ist, dass für ein wirklich barrierefreies Erlebnis der Navigationsheader mit <Stack.Navigator> Titeloptionen festgelegt werden muss. Es gibt keine Möglichkeit, einer benutzerdefinierten Navigationsleiste programmatisch anzugeben, dass es sich um ein richtiges Navigationselement und nicht nur um eine normale Ansicht handelt. Dadurch ändert sich die Art und Weise, wie die unterstützende Technologie das Element ankündigt und mit ihm interagiert. Beachten Sie, dass das Festlegen eines Header-Attributs, wie oft empfohlen, die Kriterien für den Bildschirmtitel nicht erfüllt.