Touch-Zielgröße

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.1 – 2.5.5 AAA Auswirkung – Mäßig

Alle aktiven Steuerelemente sollten eine sichtbare und tippbare Fläche von mindestens 44 dp x 44 dp haben.

Auswirkung

Auf einem Touch-Gerät stellen kleine Bedienelemente für jeden ein Usability-Problem dar. Darüber hinaus haben Menschen mit motorischen Einschränkungen größere Schwierigkeiten, mit kleinen Zielen zu interagieren und auf sie zu zielen.

Erwartungen

Interaktive Elemente haben das Potenzial, die Berührungsfläche eines Ziels zu erweitern, ohne die visuellen Grenzen des Ziels zu vergrößern. Nach sorgfältiger Überlegung beharrt Deque darauf, dass es die beste Vorgehensweise ist, die visuellen und interaktiven Grenzen des Ziels auszurichten. Dadurch steht dem Endbenutzer ein klarer Bereich zur Verfügung, mit dem er interagieren kann, um die besten Erfolgschancen zu haben. Daher testet diese Regel auch, ob die visuellen Grenzen interaktiver Elemente die Mindestanforderungen von 44 dp erfüllen.

Bestätigung

  1. Ermitteln Sie die Pixeldichte Ihres Android-Geräts.
  2. Verwenden Sie den Ansichtshierarchieinspektor, um zu bestätigen, wie groß das Steuerelement in Pixeln ist.
  3. Eines der folgenden Ereignisse wird eintreten:
    • Zugänglich: Stellen Sie sicher, dass das Bedienelement die korrekte Anzahl an dichteunabhängigen Pixeln (dp) aufweist.
    • Nicht zugänglich: Das Bedienelement ist weder 44 dp breit noch 44 dp hoch.

So beheben Sie das Problem

Ein durch diese Regel festgestelltes Problem tritt auf, wenn die Werte für „Höhe“ und/oder „Breite“ nicht 44 dp oder mehr betragen.

XML

Button button = findViewById(R.id.my_button);
button.setMinimumHeight(44);
button.setMinimumWidth(44);
<Button
     android:id="@+id/an_accessible_button_yay"
     android:minimumHeight="44dp"
     android:minimumWidth="44dp"
     android:text="@string/batman_likes_accessible_buttons" />

Compose

Button(
     onClick = { },
     modifier = Modifier.size(width = 44.dp, height = 44.dp)
) {
     Text(text = "My Button")
}

React Native

Bei einigen Komponenten von React Native sind keine Größenanpassungen möglich, wie beispielsweise bei der Button Komponente. Stellen Sie nach Möglichkeit sicher, dass alle Steuerelemente mindestens 44 dp x 44 dp groß sind. Wenn dies nicht möglich ist, erkunden Sie alternative Komponenten, mit denen Sie die Größe anpassen können. Tipp: Achten Sie bei der Verwendung benutzerdefinierter Steuerelemente darauf, dass die Zugänglichkeitsrolle richtig eingestellt ist!