Institut zur Evaluation von Web-Auftritten

Texte sollten auf Webseiten leicht lesbar sein. Eine gute Kombination der Farben von Hintergrund & Schrift ist dabei wichtig.

1. Fehlerbeschreibung:
   Es gibt zahlreiche Beispiele, wo die Lesbarkeit unter zu geringen Unterschieden bei den Farben oder den Helligkeiten leidet.
   - So bereitet der Einsatz von Schrift in Orange oder Grau auf weißem Hintergrund (beides auf einer Seite gefunden)  Probleme:
   
   - Das von mir verwendete Oberflächen-Schema (englisch: Theme) kann Probleme erzeugen, wenn die Voreinstellung der Farben im Kopfbereich geändert wird:
    
   - Auch bei staatlichen Einrichtungen tauchen Probleme auf, obwohl sie laut vorgegebenen Richtlinien barrierefrei sein müssen:
   
   Dieses Beispiel hat zusätzlich eine zu kleine Schrift, welches die Lesbarkeit zusätzlich verringert.
2. Theoretische Einordnung:
   - Das Lesen am Monitor ist anstrengender als das Lesen von Büchern und Zeitschriften. Es sollte also so einfach wie möglich gemacht werden.
   - In den Richtlinien für barrierefreie Webinhalte (WCAG) 2.0 des W3C-Konsortiums findet sich folgende Forderung zur Farbwahrnehmung:
   
   Richtlinie 1.4 Unterscheidbar: Machen Sie es Benutzern leichter, Inhalt zu sehen und zu hören einschließlich der Trennung von Vorder- und Hintergrund.
   (Kontrastverhältnis von 3:1; Konformitätsstufe A = minimale Zugänglichkeit)
   Erhöhter Anspruch bietet die Forderung:
   1.4.3 Kontrast (Minimum): Die visuelle Darstellung von Text und Bildern im Text hat ein Kontrastverhältnis von mindestens 4,5:1. (Konformitätsstufe AA)
   Optimal ist ein noch höherer Kontrast:
   1.4.6 Kontrast (erhöht): Kontrastverhältnis von mindestens 7:1. (Konformitätsstufe AAA = maximale Zugänglichkeit)
    
3. Aufdeckung: Wie kann ich die Schwachstelle aufdecken?
   - Rufen Sie eine Webseite auf, wenn Sie übermüdet sind oder zu lange am Computer gearbeitet haben ;-)
   Wenn Sie dann Probleme haben, den Inhalt einer Seite zu entziffern, gibt es dort ein Problem.
   - Systematischer kann man Test mit Software durchführen:
   Der kostenlose Contrast Analyser (wird vom W3C-Konsortium empfohlen) zeigt bei der orangen Schrift auf weißem Hintergrund folgende Ergebnisse:
   
   Da das Verhältnis unter 3:1 liegt, ist nicht mal die geringste Anforderungsstufe zur Lesbarkeit erreicht.
4. Mögliche Ursachen:
   - Firmen wollen ein bestimmtes Erscheinungsbild (Image) nach außen tragen. Dazu werden Richtlinien entwickelt und die Anwendung bestimmter Farben und Logos verbindlich vorgeschrieben. Sie werden im Corporate Design (CD) bzw. der Corporate Identity (CI) schriftlich festgelegt. Häufig werden diese Richtlinien jedoch für Druckerzeugnisse erstellt und die Anforderungen des Internets nicht berücksichtigt. Bei der Anwendung der Richtlinien auf Webseiten kommt es dann zu Problemen.
   - Es werden subjektive Vorlieben des Auftragsgebers durch Webseiten-Erstellende umgesetzt, ohne diese kritisch zu prüfen. Oder die beauftragende Person besteht auf eine Kombination, trotz fachlichen Widerspruchs.
   - Personen ohne grafische Kenntnisse entwickeln Webseiten bzw. ändern vorhandene Designs zum Schlechteren hin ab.
5. Tipps zur Beseitigung:
   - Die zwei Farben solange anpassen bis das Farbverhältnis stimmt und die Seite gut aussieht.
   - Die eigene Agentur für die Webseiten mit einer Verbesserung beauftragen.
   - Externe Hilfe hinzuziehen (Web Designer/-in).
   - Die Farben des Corporate Designs im Hintergrund / bei Rahmenelementen berücksichtigen und den Text schwarz vor hellem Hintergrund erscheinen lassen.
6. Positive Beispiele:
   Beim Spiegel ist der Text gut lesbar. Allerdings werden unwichtigere Zusatzinformationen [Video] und Überschriften grau dargestellt und sind damit schlechter lesbar.
   

Warum ich dies blogge?

Schlecht lesbare Texte ermüden schnell, der Inhalt ist schwerer zu überfliegen und Leser/-innen schwerer auf der Webseite zu halten. Daher teste ich dieses Problem schon in meinem Schnell-Check. Es handelt sich um einen leicht behebbaren Fehler, wenn die Seite mit modernen Mitteln erstellt wurde (zwei Änderungen in den Style Sheets).

Querverweis: Es gibt selten bei Zeitschriften unlesbare Teile. In der DVD-Zeitschrift Widescreen werden im Block "In Arbeit" Überschriften mit weißer Schrift auf gelben Grund veröffentlicht , dies ist sehr mühsam zu lesen.