Standards · WCAG 2.2

SC 2.5.8 Stufe AA WCAG 2.2 Neu in 2.2

Zielgröße (Minimum)

Interaktive Ziele — Schaltflächen, Links, Formularelemente — müssen mindestens 24 × 24 CSS-Pixel groß sein, es sei denn, ein gleichwertiges Ziel auf derselben Seite ist ausreichend groß oder das Ziel befindet sich in einem Fließtext. Neu in WCAG 2.2.

Was gefordert wird

Jedes interaktive Steuerelement auf der Seite muss eine Trefferfläche von mindestens 24 × 24 CSS-Pixeln belegen — oder über ausreichend Abstand verfügen, sodass ein auf das Ziel zentrierter Kreis mit 24 Pixeln Durchmesser kein anderes Ziel schneidet. Ziel ist es, zu verhindern, dass Nutzende mit eingeschränkter Feinmotorik, Tremor oder bei Touchscreen-Nutzung unterwegs das Ziel verfehlen und eine unbeabsichtigte Aktion auslösen.

WCAG 2.2 legt das Minimum auf 24 × 24 Pixel fest; das bereits bestehende AAA-Kriterium 2.5.5 behält das anspruchsvollere 44 × 44-Pixel-Ziel bei.

So wird die Anforderung erfüllt

  • min-width / min-height von 24 Pixeln bei reinen Symbol-Schaltflächen, Schließen-Schaltflächen und allen Tipper-Zielen festlegen, die kleiner als eine typische Schaltfläche sind.
  • Für Inline-Links in Absätzen gilt eine Ausnahme — das Erfolgskriterium lässt Ziele „in einem Satz“ ausdrücklich zu.
  • Bei Symbolreihen (Symbolleisten-Schaltflächen, Tabellenzeilen-Aktionen) Innenabstand (Padding) verwenden, um die Trefferfläche auf 24 × 24 Pixel zu vergrößern, auch wenn das Symbol selbst kleiner ist.
  • Bei Steuerelementen, die visuell klein bleiben müssen (ein kleines „ד auf einem Chip), einen Außenabstand (Margin) oder Abstandspuffer einfügen, sodass benachbarte Ziele mindestens 24 Pixel Abstand von Mittelpunkt zu Mittelpunkt haben.
  • Paginierung, Breadcrumbs, Tabellenzeilen-Aktionen und Symbolleisten-Symbole zuerst prüfen — dort treten die meisten Fehler auf.

Häufige Fehler

  • 16 × 16-Pixel-Symbolschaltflächen (Schließen, Bearbeiten, Löschen) ohne Innenabstand, besonders in Tabellen und Symbolleisten.
  • Enge Paginierungsreihen, bei denen „Zurück“ / 1 / 2 / 3 / „Weiter“ in 18-Pixel-Boxen dicht nebeneinander sitzen.
  • Benutzerdefinierte Checkboxen und Optionsfelder, die aus „minimalistischen“ Gründen kleiner als das native Steuerelement gestaltet werden.
  • Schwebende Aktionsschaltflächen auf Mobilgeräten, die 24 × 24 Pixel überschreiten, aber zu nah an anderen Tipper-Zielen positioniert sind.
  • „ד-Schaltflächen zum Entfernen von Tags mit 10–14 Pixeln Größe — äußerst häufig in Chip-basierten Filter-Oberflächen.

Ausnahmen, die es zu kennen gilt

Das Erfolgskriterium kennt fünf Ausnahmen: gleichwertig (ein größeres Ziel auf derselben Seite erfüllt dieselbe Funktion), inline (im Fließtext), User-Agent-Steuerung (Browser-Standard, z. B. natives <select>), essenziell (die geringe Größe ist zur Informationsvermittlung erforderlich, z. B. ein Kartenmarkierer) und konform (eine allgemeinere Regel schreibt die Größe vor — selten).

Warum es wichtig ist

Fehler bei der Zielgröße treten überproportional häufig bei Mobile-Tests und bei Nutzenden mit Parkinson, essentiellem Tremor, Multipler Sklerose oder bei der einhändigen Touchscreen-Nutzung in der Bahn auf. Die Änderung von „kein Minimum“ in WCAG 2.1 auf einen 24 × 24-Pixel-Mindestwert in WCAG 2.2 hat die meisten Produktionswebsites unvorbereitet getroffen — dieses Erfolgskriterium dürfte in Audits des Jahres 2026 zu den am häufigsten zitierten neuen Kriterien gehören.