Fokussierbarer Text

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

Stellen Sie sicher, dass Textelemente mit TalkBack erreichbar sind

Not for use with personal data

WCAG 2.0 - 1.3.2 A Impact - Critical

Erfahren Sie, wie wir künstliche Intelligenz für diese Regel nutzen!

Was wir überprüfen

Alle Elemente, die Text enthalten, sollten für unterstützende Technologien wie TalkBack fokussierbar sein. Textelemente sollten nicht vor unterstützender Technologie versteckt werden, damit Benutzer auf Bildschirmtexte navigieren und sie lesen können.

Fehlerhaftes Beispiel ❌

An Android product page where TalkBack only reaches two elements — 'Premium Headphones' and 'Add to Cart' — while the '$299.99' price and description text are outlined in red dashes, indicating TalkBack skips them

Das price and description text are hidden from assistive technology

TalkBack überspringt von „Premium-Kopfhörer“ direkt zu „In den Warenkorb legen“ – der Preis und die Beschreibung werden nie angesagt

Benutzer von Screenreadern verpassen wichtige Produktinformationen, die auf dem Bildschirm angezeigt werden

Richtiges Beispiel ✅

An Android product page where all four elements are numbered and outlined in blue: 'Premium Headphones' (1), '$299.99' (2), the description text (3), and 'Add to Cart' (4), indicating all are reachable by TalkBack

Alle Textelemente sind available to assistive technology und für TalkBack erreichbar

TalkBack navigiert in der Reihenfolge durch alle vier Elemente: Überschrift, Preis, Beschreibung und Schaltfläche

Benutzer von Screenreadern erhalten die vollständigen Produktinformationen in einer logischen Lesereihenfolge

Auf einen Blick

  • Diese Regel hat einen kritischen Einfluss auf die Benutzer
  • Textelemente dürfen nicht vor assistiver Technologie versteckt werden, damit TalkBack sie lesen kann
  • In XML, setzen Sie nicht importantForAccessibility="no" bei Textelementen
  • In Compose markieren Sie Textelemente nicht als invisibleToUser()
  • In React Native sind Textelemente standardmäßig zugänglich; verstecken Sie sie daher nicht vor assistiver Technologie

Auswirkung auf Benutzer

Menschen mit Blindheit oder Sehbehinderungen sind am meisten betroffen. Wenn ein Textelement vor der Zugänglichkeit verborgen ist, kann TalkBack es nicht fokussieren. Infolgedessen werden Benutzer von Screenreadern Informationen auf dem Bildschirm vollständig verpassen, was zu Verwirrung führen oder verhindern kann, dass Benutzer auf wichtige Inhalte zugreifen.

Problem mit fokussierbarem Text bestätigen

  1. Aktivieren Sie TalkBack
  2. Versuchen Sie, das Textelement zu fokussieren
  3. Eines der folgenden Dinge wird eintreten:
    • Nicht zugänglich: Textelement kann von TalkBack nicht fokussiert werden
    • Zugänglich: Textelement wird von TalkBack fokussiert und vorgelesen

Probleme beheben

Um ein Problem mit fokussierbarem Text zu lösen, stellen Sie sicher, dass das Textelement nicht ausdrücklich vor assistiver Technologie verborgen ist. Wenn der Text Teil eines fokussierbaren Übergeordnetelements (wie einer Schaltfläche oder eines beschrifteten Steuerelements) ist, sollte der zugängliche Name des übergeordneten Elements den Text enthalten. In diesem Fall muss das Textelement selbst nicht einzeln fokussierbar sein.

XML

Setzen Sie nicht die Eigenschaft importantForAccessibility auf "no" bei Textelementen. Wenn dieses Attribut vorhanden ist, entfernen Sie es oder setzen Sie es auf "yes" oder "auto".

Compose

Markieren Sie Compose-Textelemente nicht als invisibleToUser(). Entfernen Sie diesen Modifikator, um sicherzustellen, dass das Element für TalkBack verfügbar ist.

Text("Digital equality for all.", modifier = Modifier.semantics {
    // Remove invisibleToUser() to make this element accessible to TalkBack
    invisibleToUser()
})

React Native

In React Native sind Textelemente standardmäßig zugänglich. Bestätigen Sie, dass der Text sinnvoll ist und Kontext bietet. Deaktivieren Sie die Zugänglichkeit nicht, indem Sie die Eigenschaft accessible={false} direkt am Textelement oder die Eigenschaft importantForAccessibility='no-hide-descendants' an einem übergeordneten Element verwenden.

Flutter

In Flutter sind Text-Elemente standardmäßig im Zugänglichkeitsbaum enthalten. Bestätigen Sie, dass der Text sinnvoll ist und Kontext bietet. Schließen Sie sichtbaren Text nicht aus dem Zugänglichkeitsbaum aus, indem Sie ihn in ExcludeSemantics oder Semantics(excludeSemantics: true) einbetten.

Kann ich diese Regel ignorieren?

Fokussierbarer Text hat einen kritischer Einfluss für Benutzer, und wir empfehlen dringend, diese Probleme zu beheben. In Fällen, in denen sich der Text in einem übergeordneten Element befindet, das bereits von TalkBack fokussierbar ist und bereits den Text in seinem zugänglichen Namen enthält - wie z. B. einer Schaltflächenbeschriftung oder einem beschreibenden Text eines Steuerelements -, kann es akzeptabel sein, das Textelement selbst nicht fokussierbar zu lassen. Erfahren Sie mehr über Regeln ignorieren.

Ressourcen

Deque University Kursseiten

Hinweis: Voller Zugriff auf Deque University Ressourcen erfordert ein Abonnement.

Andere Ressourcen