WCAG-A/AA-Anforderung Priorität: Mittel
Textabstände lassen sich nicht anpassen
Bei einigen Texten sind Zeilen-, Buchstaben- oder Wortabstände per !important im style-Attribut festgelegt. Leser können sie daher nicht mit eigenen Einstellungen ändern.
Dieser Text wurde automatisch übersetzt und noch nicht von Muttersprachlern geprüft.
Warum das für Ihre Kunden wichtig ist
Menschen mit Legasthenie oder Sehschwäche vergrößern Abstände oft mit Browser-Erweiterungen oder eigenen Stilen. Bei diesen Elementen werden ihre Einstellungen ignoriert, sodass Produktbeschreibungen, Preise oder Hinweise schwer lesbar bleiben.
Wen es betrifft
- Menschen mit Legasthenie
- Menschen mit Sehschwäche
- Menschen mit kognitiven Einschränkungen
So beheben Sie es
Entfernen Sie !important bei line-height, letter-spacing und word-spacing in Inline-style-Attributen oder verschieben Sie diese Angaben ins Stylesheet. Prüfen Sie danach, dass nichts abgeschnitten wird oder überlappt, wenn die Zeilenhöhe das 1,5-Fache der Schriftgröße beträgt, der Absatzabstand das 2-Fache, der Buchstabenabstand das 0,12-Fache und der Wortabstand das 0,16-Fache.
Bei Shopify
Meist Inline-Stile aus Page Buildern, Apps oder eigenem HTML im Theme. Entfernen Sie !important im Liquid-Code oder in den Einstellungen der App bzw. des Builders.
Bei Shoptet (CZ)
Meist in Inhalten, die samt Formatierung in den Editor eingefügt wurden. Entfernen Sie die Formatierung im Editor; stammt der Stil aus dem Template, wenden Sie sich an Shoptet oder eine Partneragentur.
Bei PrestaShop
Meist in Inhalten aus dem CMS-Editor oder in Modul-Templates. Entfernen Sie Inline-Abstände mit !important in den .tpl-Dateien oder im bearbeiteten Inhalt.
Bei WooCommerce
Häufig bei Page Buildern und bei Text, der aus Word oder anderen Websites eingefügt wurde. Legen Sie Abstände in den Stil-Einstellungen des Builders oder im Theme-Stylesheet fest statt inline.
Standards
| Standard | Abschnitt |
|---|---|
| WCAG 2.2 | 1.4.12 (AA) Text Spacing |
| WCAG 2.1 | 1.4.12 (AA) Text Spacing |
| EN 301 549 4.1.1 | 9.1.4.12 |
| EN 301 549 3.2.1 | 9.1.4.12 |
| ДСТУ EN 301 549 2022 | 9.1.4.12 |
Automatische Prüfung: axe-core-Regel avoid-inline-spacing.
dequeuniversity.com, github.com, www.w3.org
Ähnliche Prüfungen
-
Buttons und Links sind zu klein zum bequemen Antippen
WCAG 2.5.8 AA
-
Einige Schalter und Kontrollkästchen haben keinen Namen
WCAG 4.1.2 A
-
Links im Fließtext sehen aus wie normaler Text
WCAG 1.4.1 A
-
Die Seite enthält veraltetes Markup für blinkenden Text
WCAG 2.2.2 A