Die Zielgröße (englisch Target Size) legt fest, wie groß die klickbare Fläche eines Bedienelements sein muss. Mit WCAG 2.2 kam das Erfolgskriterium 2.5.8 Zielgröße (Minimum) auf Stufe AA hinzu: Interaktive Ziele müssen mindestens 24 mal 24 CSS-Pixel groß sein oder einen ausreichenden Abstand zu Nachbarzielen haben. Das hilft Menschen mit Tremor, motorischen Einschränkungen oder bei der Bedienung auf kleinen Touchscreens.
24 Pixel und die Ausnahmen
Erreicht ein Ziel die 24 Pixel nicht, kann ein Abstand zu anderen Zielen das ausgleichen: Ein Kreis von 24 Pixel Durchmesser um das Element darf keine anderen Ziele berühren. Ausnahmen gelten unter anderem für Links im Fließtext und für Elemente, deren Größe vom Browser vorgegeben ist. Auf Stufe AAA verlangt SC 2.5.5 sogar 44 mal 44 Pixel.
So setzt du es um
- Buttons und Touch-Ziele großzügig dimensionieren, mindestens 24 Pixel.
- Genug Abstand zwischen eng stehenden Icons und Links lassen.
- Klickfläche per Padding vergrößern, nicht nur das Icon.
- Mobile Navigationen und Burger-Menüs prüfen.
Die Zielgröße ist Teil der guten Bedienbarkeit und gehört zur neuen Generation der WCAG 2.2. Ein klar erkennbarer Fokus-Indikator ergänzt große Ziele, und das Thema folgt dem POUR-Prinzip der Bedienbarkeit. Es ist relevant für die Konformität nach dem European Accessibility Act.
In WordPress mit Bricks Builder definierst du Mindestgrößen für Buttons am besten über globale Klassen, damit alle Bedienelemente konsistent groß genug bleiben.