Links und barrierefreies Webdesign für Farbenblinde
Marcus Völkel fragte in seinem Weblog, ob Links Symbole brauchen. Dass es darüber geteilte Meinungen gibt, sieht man in den Kommentaren – allerdings sieht man dort auch, dass niemand bei seiner Antwort an Farbenblinde gedacht hat…
Seit Netscape 1.0 kannte man es: unbesuchte Links sind unterstrichen und blau, besuchte unterstrichen und lila. Mit der Einführung von CSS hat sich diese Konvention radikal geändert – es gibt unzählige Möglichkeiten, Links zu kennzeichnen; sei es über color, über text-decoration, über background-picture etc.pp.
Worüber man sich bei der Gestaltung allerdings selten Gedanken macht – und davon schließe ich mich keineswegs aus – ist die Barrierefreiheit (Accessibility). Immerhin 8% der europäischen und knapp 10% der deutschen männlichen Bevölkerung ist nämlich farbenblind und kann rot und grün oder andere Farben nicht voneinander unterscheiden. Für diese Personen ist eine Farb-Codierung der Links gänzlich ungeeignet, ganz abgesehen von der mangelnden Fähigkeit, einen farbcodierten Visited Status wahrnehmen zu können. Wenn dazu noch die Unterstreichung der Links abgestellt wird, hat ein Farbenblinder meist keinerlei Möglichkeit, Links in einem Fließtext überhaupt als solche zu erkennen.
Das Europäische Institut für Qualitätssicherung und Standardisierung EWIV (EIQUS) schreibt in seiner Broschüre zur Barrierefreiheit (PDF, 1,4 MB) u.a.:
Farb-Informationen
Bedeutungstragende Farb-Unterschiede (z.B. Farbcodierungen und Farbleitsysteme) dürfen Farbenblinde nicht von wichtigen Informationen ausschließen.
Was heißt das aber nun für die Auszeichnung von Links? Idealerweise werden Links zusätzlich zu einem optionalen Farbcode entweder immer unterstrichen dargestellt oder aber mit einem grafischen Symbol gekennzeichnet; hierbei könnte man dann zusätzlich auch zwischen internen und externen Links unterscheiden.
Bei der Kennzeichnung besuchter Links wird es schon etwas schwieriger. Eine Möglichkeit ist es, besuchte Links mithilfe einer Hintergrundgrafik durchgestrichen zu zeigen, eine andere wäre es, Links grundsätzlich mit grafischem Symbol und Unterstreichung zu kennzeichnen und bei besuchten Links die Unterstreichung zu entfernen.
Es gibt sicher noch viele andere Möglichkeiten – sucht man allerdings bei Google nach „barrierefreiheit + farbenblind“, findet man nur 29 echte Treffer, davon sind die meisten irgendwelche Behörden PDFs.
So richtig scheint dieses Thema zur Zeit also noch niemanden zu interessieren.
Ähnliche Beiträge:
Panther und 5-Tasten Maus „Locales“ Phänomen
Kommentare:
Bei den Kommentaren handelt es sich um fremde Inhalte, die sich „esse est percipi“ nicht zueigen macht. Verantwortlich für den Inhalt eines Kommentars ist der jeweilige Verfasser.
Farbenblindheit bedeutet nicht zwangsläufig, dass die beeinträchtigte Person gar keine Farben mehr wahrnehmen bzw. verarbeiten kann. Dennoch sollte man gewisse Farbkombinationen nicht nur vermeiden, sondern auch sicherstellen, dass: »[…] die gesamte mit Farbe dargestellte Information auch ohne Farbe verfügbar ist, z. B. im Kontext oder im Markup.« (BITV Priorität I bzw. WAI 2.1)
Nun kann man vielleicht bei dieser »Zielgruppe« davon ausgehen, dass sie mit einem eigenen User-Stylesheet surft. Nichtsdestotrotz ist es hochinteressant, seine Website mal mit »anderen Augen« betrachten zu können. Wer keine sehbeeinträchtigten Menschen kennt, kann es beispielsweise mit Simulatoren versuchen wie Vischeck (Deuteranope/Protanope/Tritanope-Simulation, testet sowohl Images als auch Webseiten; sehr langsam), das Color Laboratory oder den Colorblind Web Page Filter.
Dein Beitrag hier stellt hingegen einen gänzlichen neuen Aspekt da, ich denke man kann ohnehin nie einen völlige barrierefreien Internetauftritt erreichen sonder immer nur einen barrierefreieren. Welchen Aufwand und Schwerpunkt man setzt (eigene CSS-Datei für farbenblinde Nutzer) entscheidet auch das Budget.
Wichtige finde ich übrigens auch globale Links per Tastaturshort Cut anzugeben (HTML-Attribut „acceskey“) – das stört ja keinesfalls ein Layout und hilft der entsprechenden Nutzergruppe (ich gelobe Besserung bei all unseren neuen Webseiten).
Ansonsten würde ich mich beim Thema Links auf „alte“ HTML Sehgewohnheiten verlassen:
Unbesuchte Links (nur die!) werden unterstrichen dargestellt
Besuchte Links werden farblich anders dargestellt (Unterstreichung fällt weg).
Dadurch unterscheiden Sie sich weniger vom übrigen Schriftbild und stören den Lesefluss weniger.
Es wird kenntlich welche Seiten man schon besucht hat und welche noch nicht.
Das ganze natürlich immer unter Berücksichtigung eines entsprechenden Layout-Konzeptes.
Besuchte Links werden farblich anders dargestellt (Unterstreichung fällt weg).
aber bereits besuchte Links sollte man doch trotzdem noch ein zweites Mal leicht finden können, oder?
Grüße, Linda
Ideal ist das sicher nicht, aber als noch weniger ideal empfinde ich es, auf jeder Website einen neuen Farbcode „lernen“ zu müssen: mal ist blau unbesucht und rot besucht, mal ist es wieder umgekehrt.
Deswegen bleibe ich, bis mir etwas besseres einfällt, erstmal bei unterstrichen/nicht unterstrichen – über die farbliche Kennzeichnung kann man ja auch die besuchten Links noch als solche erkennen. Auch Farbenblinde, die i.d.R. Kontraste besser wahrnehmen als Normalsichtige, können das.
Also wenn jemand die Signalfarbe Rot für bereits besuchte Links benutzt und das dezentere Blau für noch nicht besuchte, dann hat er irgendwie eine seltsame Wahrnehmung der Dinge…
Ich gebe Dir recht, dass es blöd ist, wenn man ständig neue Farbcodes lernen muss. Deswegen bin ich ja auch nicht für eine intern/extern Unterscheidung durch Farben.
Ich denke einfach, dass bereits besuchte Links (wenn man sie denn als solche kennzeichnet) etwas zurückhaltender / dezenter aussehen sollten. Dem entspricht es ja, wenn man die Unterstreichung weglässt (nur sollte die Linkfarbe dann natürlich deutlich eine andere als die Textfarbe sein), aber auch, wenn man eine dezentere Farbe nimmt. Dezentere Farben sind ja auch ein Kontrastunterschied, den Farbenblinde sehen könnten.
Mhm, den Kontrast zwischen dunkelgrün und schwarz empfinde ich jetzt nicht als so groß… Aber ich finde Deine Links trotzdem noch, wenn ich danach suche ;-)
Schöne Grüße,
Linda
Was mich zu der Überlegung bringt, ob man zur Kennzeichnung externer und interner bzw. Verweisen auf andere Formate (.pdf etc.) eventuell diese kleinen Icons per CSS reinschreibt und dann im besuchten Zusatnd wieder entfernt? Ok, generated Content tut’s zwar in allen Browsern ausser diesem einen, aber wenn’s schee macht?
/T
Kommentar schreiben:
FAQ (Häufig gestellte Fragen)
Kommentare:
- SmartFehler-Redaktion zu Xiaomi Mi Smart Fan Ventilator in Home Assistant einbinden
- Michael Preidel zu BBEdit-Tipp: Einrücken mit Tab-Taste
- Dirk zu BBEdit-Tipp: Einrücken mit Tab-Taste
- Michael Preidel zu Pop-up Fenster sind zurück – ein bisschen
- Bock zu Pop-up Fenster sind zurück – ein bisschen
- Michael Preidel zu Pasta dell’Orto
Schlagwörter
