Linkkontrast
Silktide findet Links in Ihrem Text, die sich von den Wörtern um sie herum nur durch Farbe unterscheiden, mit zu geringem Farbunterschied, als dass Menschen mit eingeschränktem Farbsehen sie erkennen könnten. Links müssen als Links erkennbar sein, sonst können Lesende sie nicht nutzen.
Warum das wichtig ist
Etwa 1 von 12 Männern und 1 von 200 Frauen hat eine Farbsehschwäche. Wenn ein Link nur durch eine subtile Farbänderung gekennzeichnet ist, sehen diese Lesenden normalen Text und bemerken nicht, dass ein Link existiert. Das bedeutet verpasste Navigation, verpasste Handlungsaufrufe und ein Verstoß gegen Stufe A – dies gehört zu den grundlegendsten Anforderungen an die Barrierefreiheit.
So beheben Sie das Problem
Es gibt zwei Wege, einen Inline-Link konform zu machen:
- Mehr als nur durch Farbe unterscheiden – die einfachste Lösung ist eine Unterstreichung, die die meisten Lesenden bei Links erwarten. Ein Rahmen, ein Hintergrund oder deutlich höheres Schriftgewicht funktionieren ebenfalls.
/* Links, die sich nur durch Farbe unterscheiden */
a { color: #4a6da7; text-decoration: none; }
/* Behoben: Unterstreichung macht den Link für alle sichtbar */
a { color: #4a6da7; text-decoration: underline; }
- Eine stark unterschiedliche Farbe plus einen sichtbaren Fokus- und Hover-Zustand verwenden – die Linkfarbe muss ein von mindestens 3:1 zum umgebenden Text aufweisen, und der Link muss sich bei Maus-Hover und sichtbar verändern (zum Beispiel eine Unterstreichung erhalten).
Wie Silktide dies testet
- Es werden sichtbare Links gesucht, die innerhalb eines Fließtextes stehen, mit Wörtern unmittelbar davor oder danach. Eigenständige Links wie Menüpunkte und Schaltflächen werden von dieser Prüfung nicht erfasst.
- Links werden übersprungen, wenn Linkfarbe, Farbe des umgebenden Texts oder Hintergrundfarbe nicht zuverlässig ermittelt werden können.
- Als bestanden gelten Links, die ohne Farbe visuell unterscheidbar sind: unterstrichen, mit Rahmen, mit Hintergrund oder mindestens 200 Einheiten höher in der Schriftstärke als der umgebende Text.
- Andernfalls wird das Kontrastverhältnis zwischen Linkfarbe und umgebender Textfarbe gemessen und geprüft, wie sich der Link bei Fokus und Hover verändert. Der Link wird gemeldet, sofern das Verhältnis nicht mindestens 3:1 beträgt und der Fokus- oder Hover-Zustand nicht sichtbar anders ist.
Fehlerbehebung
Meine Links ändern sich beim Hover, warum werden sie trotzdem markiert?
Eine Hover-Änderung allein reicht nicht – der Link muss außerdem einen Farbkontrast von mindestens 3:1 zum umgebenden Text haben. Und selbst zusammen hilft dieser Ansatz nur Menschen, die den Farbunterschied gut genug wahrnehmen, um überhaupt mit der Maus darüberzufahren. Eine Unterstreichung bleibt die verlässlichste Lösung.
Links in Menüs und Schaltflächen werden nicht markiert
Richtig – diese Prüfung gilt nur für Links, die von anderem Text umgeben sind, bei denen Lesende den Link von den Wörtern um ihn herum unterscheiden müssen. Eigenständig stehende Links sind durch ihre Position und ihr Styling visuell erkennbar.