Linkfarben
Problem
Die bisherigen Links sind im Fliesstext nicht gut zu erkennen. Wir verwendeten derzeit das dunkle Blau aus Brahms (@b-petrol).
#3C5968
Kontrast zum Text: nicht barrierefrei
Kontrast zum Hintergrund: AA
Kontrasttest
Beispiel:
Als frei zugängliche Internet-Datenbank verzeichnet das Brahms-Briefwechsel-Verzeichnis sämtliche Briefe von und an Johannes Brahms . Neben kulturhistorisch-biografischen Aspekten bietet die hierin erschlossene Brahms-Korrespondenz zentrale Angaben über Veröffentlichung, Quellenfiliation und Rezeption der Brahms-Werke.
Anforderungen
Die Anforderungen an die Barrierefreiheit sieht dazu folgendes vor:
Links im Fließtext sind nicht nur farblich abgesetzt, sondern durch ein weiteres visuelles Merkmal unterschieden: z.B. zusätzlich unterstrichen, gefettet oder kursiv, invertiert oder mit einer Markierung versehen. Ausnahme: Das Kontrastverhältnis zwischen Linkfarbe und umgebender Textfarbe ist 3:1 oder besser. In diesem Fall kann im Ausgangszustand auf die zusätzliche Hervorhebung verzichtet werden. Die Links müssen dann aber bei Fokuserhalt zusätzlich hervorgehoben werden.
Lösungsansatz
Theorie
- Kontrast von Linkfarbe und umgebender Textfarbe ist 3:1 oder besser
- Links erhalten bei Fokuserhalt Unterstreichung
Praxis
Kontrastmessung für Links mit: https://webaim.org/resources/linkcontrastchecker
Der Link zum Hintergrund im Fliesstext sollte AAA erreichen.
Der Link zum umgebenen Text ... 3 oder mehr.
BI Blau
#4a8c91
Kontrast zum Text: A
Kontrast zum Hintergrund: nicht barrierefrei
Kontrasttest
Beispiel:
Als frei zugängliche Internet-Datenbank verzeichnet das Brahms-Briefwechsel-Verzeichnis sämtliche Briefe von und an Johannes Brahms . Neben kulturhistorisch-biografischen Aspekten bietet die hierin erschlossene Brahms-Korrespondenz zentrale Angaben über Veröffentlichung, Quellenfiliation und Rezeption der Brahms-Werke.
MHL Pink
#9e38c8
Kontrast zum Text: nicht barrierefrei
Kontrast zum Hintergrund: AA
Kontrasttest
Beispiel:
Als frei zugängliche Internet-Datenbank verzeichnet das Brahms-Briefwechsel-Verzeichnis sämtliche Briefe von und an Johannes Brahms . Neben kulturhistorisch-biografischen Aspekten bietet die hierin erschlossene Brahms-Korrespondenz zentrale Angaben über Veröffentlichung, Quellenfiliation und Rezeption der Brahms-Werke.
WebAIM erstellte Farben
#50798B
Kontrast zum Text: A
Kontrast zum Hintergrund: AA
Kontrasttest
Beispiel:
Als frei zugängliche Internet-Datenbank verzeichnet das Brahms-Briefwechsel-Verzeichnis sämtliche Briefe von und an Johannes Brahms . Neben kulturhistorisch-biografischen Aspekten bietet die hierin erschlossene Brahms-Korrespondenz zentrale Angaben über Veröffentlichung, Quellenfiliation und Rezeption der Brahms-Werke.
#2777B4
Kontrast zum Text: A
Kontrast zum Hintergrund: AA
Kontrasttest
Beispiel:
Als frei zugängliche Internet-Datenbank verzeichnet das Brahms-Briefwechsel-Verzeichnis sämtliche Briefe von und an Johannes Brahms . Neben kulturhistorisch-biografischen Aspekten bietet die hierin erschlossene Brahms-Korrespondenz zentrale Angaben über Veröffentlichung, Quellenfiliation und Rezeption der Brahms-Werke.
#537f34
Kontrast zum Text: A
Kontrast zum Hintergrund: AA
Kontrasttest
Beispiel:
Als frei zugängliche Internet-Datenbank verzeichnet das Brahms-Briefwechsel-Verzeichnis sämtliche Briefe von und an Johannes Brahms . Neben kulturhistorisch-biografischen Aspekten bietet die hierin erschlossene Brahms-Korrespondenz zentrale Angaben über Veröffentlichung, Quellenfiliation und Rezeption der Brahms-Werke.
Aktueller Stand/Entscheidung
Linkfarbe #50798B
Link-Hover: #3C5968 und unterstrichen (underline)
Im Fliesstext und an gesonderten Stellen wird der Link gepunktet unterstrichen (underline dotted).
Der Hovereffekt bleibt gleich (undereline solid).
Alle anderen interaktiven Elemente sind in der Linkfarbe zu halten.
Ausnahmen sind besondere Elemente/Gesatltungen wie zum Beispiel Menüs oder Knöpfe.
