Definition: Die Zielgröße ist die Fläche, die man mit Maus, Finger oder Stift treffen muss, um ein Bedienelement auszulösen. Nach WCAG 2.5.8 (Stufe AA, neu in WCAG 2.2) muss sie mindestens 24 × 24 CSS-Pixel groß sein – oder das Ziel braucht genug Abstand zu seinen Nachbarn [1].
Englisch: Target size · Auch: Klickfläche, Tippfläche · Zuletzt geprüft: 27. September 2026
Wer davon profitiert
Kleine Ziele treffen viele Menschen schlecht: Menschen mit Tremor oder eingeschränkter Feinmotorik, Menschen, die eine Mundmaus oder einen Kopfzeiger nutzen, ältere Menschen und alle, die das Smartphone mit einer Hand im Bus bedienen. Wer daneben tippt, löst im schlimmsten Fall das falsche Element aus – etwa „Löschen“ statt „Bearbeiten“.
Was WCAG 2.5.8 genau verlangt
Ein Ziel erfüllt das Kriterium, wenn es mindestens 24 × 24 CSS-Pixel groß ist. Ist es kleiner, reicht der Abstand: Legt man um die Mitte jedes zu kleinen Ziels einen Kreis mit 24 Pixel Durchmesser, dürfen sich diese Kreise nicht mit anderen Zielen oder deren Kreisen überschneiden [1][2].
Ausgenommen sind:
- Gleichwertige Alternative: Dieselbe Funktion ist auf der Seite über ein ausreichend großes Ziel erreichbar.
- Links im Fließtext, deren Größe durch die Zeilenhöhe bestimmt ist.
- Vom Browser gestaltete Elemente, die die Seite nicht verändert hat.
- Wesentliche Darstellung: Die Größe ist rechtlich vorgeschrieben oder für die Information entscheidend, etwa Punkte auf einer Karte.
Die strengere Stufe AAA (2.5.5) verlangt 44 × 44 CSS-Pixel. Viele Designsysteme nehmen ohnehin 44 Pixel als Richtwert.
Häufige Fehler
- Icon-Buttons mit 16-Pixel-Symbol ohne Innenabstand: Die Klickfläche ist nur so groß wie das Symbol.
- Eng gesetzte Paginierung („1 2 3 … 10“) oder Sterne-Bewertungen.
- Schließen-Kreuze in Bannern und Dialogen.
- Mobile Ansicht vergessen: Auf dem Desktop groß genug, auf 360 Pixel Breite zusammengeschoben.
Im Code
/* Klickfläche = Symbol: 16 × 16 px */
.icon-button { padding: 0; }/* Klickfläche wächst, Symbol bleibt klein */
.icon-button {
min-width: 44px;
min-height: 44px;
display: inline-grid;
place-items: center;
}Wie Reviseberg damit umgeht
Reviseberg prüft die Zielgröße mit der axe-core-Regel target-size auf jeder Seite – bei 1280 Pixel Breite und noch einmal bei 360 Pixel, weil Ziele auf schmalen Bildschirmen oft enger zusammenrücken. Die Ausnahmen, vor allem die gleichwertige Alternative, kann die Regel nicht immer beurteilen. Deshalb steht 2.5.8 in der Übersicht als „teilweise“ automatisch prüfbar.
Verwandte Begriffe
Sprachsteuerung · Reflow · Bildschirmlupe · Assistive Technologie