von

Warum das visuelle Farbkonzept im E-Book anders funktioniert (und wie es barrierefrei gelingt)

Das Problem mit der Farbe als Orientierung im E-Book

In gedruckten Fach- und Sachbüchern ist Farbe ein mächtiges Werkzeug. Lektorate und Gestaltungsabteilungen nutzen sie, um Inhalte zu strukturieren, Corporate Designs durchzusetzen oder die Aufmerksamkeit zu lenken. Eine rote Infobox für Warnungen, grüne Schrift für Beispiele, blaue Marginalien für Definitionen. Im Print funktioniert das hervorragend, weil das Kontrastverhältnis fix bleibt.

1:1 in ein EPUB exportiert, funktioniert diese Herangehensweise nicht mehr in der digitalen Realität.

Die digitale Leseumgebung ist kein statisches Blatt Papier. Sie ist ein fluides System, das von unterschiedlichster Hardware, individuellen Systemeinstellungen und der Biologie des menschlichen Auges dominiert wird. Barrierefreiheit beim digitalen Lesen bedeutet nicht nur, Screenreader zu unterstützen. Es bedeutet, die Lesbarkeit für ermüdete Augen, die ältere Leserschaft und spezifische Hardware zu garantieren.

Schauen wir uns an, wo etablierte Print-Reflexe im E-Book an Grenzen stoßen und welche Lösungen für E-Books funktionieren.

Das Hardware-Debakel: Graustufen und System-Kollaps

Die E-Ink-Realität

Die energieeffizienteste und beliebteste Art, digital zu lesen, ist das E-Ink-Display (Kindle, Tolino, PocketBook, Raspberry-Pi-DIY-Geräte). Der Haken: Die meisten dieser Geräte rendern exakt 16 Graustufen. Ein zartes Rosa als Hintergrund für eine Infobox wird zu einem matschigen Hellgrau. Eine durchgehende Hintergrundfläche vermindert das Kontrastverhältnis. Ein Dunkelblau auf schwarzem Grund wird unlesbar. Wer Information nur über Farbe vermittelt (z. B. „Wichtige Hinweise sind rot markiert“), schließt Lesende auf E-Ink-Geräten komplett von dieser Semantik aus.

Der Dark-Mode-Fehler durch harte Hex-Codes

Entwickler oder Exporter schreiben oft feste Farbcodes ins CSS (color: #0000FF; background-color: #FFC0CB;). Schalten Lesende auf Tablets nun in den Nachtmodus (schwarzer Hintergrund, weiße Schrift), bleibt der Text dank des fixen Hex-Codes dunkelblau – und ist auf dem schwarzen Grund unlesbar.

Noch schlimmer ist der Versuch, Farbschemata über CSS-Media-Queries (@media (prefers-color-scheme: dark)) hart im E-Book zu erzwingen. E-Reader verwalten ihre Modi auf Systemebene. Greift das EPUB hier ein, hebelt es die Systemeinstellungen der Lesenden aus. Zudem versuchen manche Reader-Hersteller, bekannte Darstellungsprobleme durch eigene System-Regeln zu korrigieren. Kollidieren harte Farbangaben im EPUB mit diesen Regeln, führt das im schlimmsten Fall zu unsichtbaren Überschriften und Textabschnitten.

Die saubere Praxis-Lösung

Die Nutzung des CSS-Wertes currentColor oder das bewusste Weglassen fester Textfarben. So passt sich ein Element dynamisch an das Farbschema (Tag, Nacht, Sepia) der Reader-Engine an. Für Infoboxen oder Schmuckelemente empfiehlt es sich, Farben zu wählen, die keine Informationsvermittlung übernehmen und auch bei Nicht-Sichtbarkeit weder Text noch Grafiken unsichtbar werden lassen. Ein Icon hilft hier, Infoboxen und Hinweise zusätzlich semantisch auszuzeichnen. Notiz für mich: Hier später auf einen weiteren Artikel verlinken, der über barrierefreie Grafiken und Icons informiert.

Die Biologie des digitalen Lesens (Blinde Flecken der Gestaltung)

Barrierefreiheit betrifft nicht nur Nutzende assistiver Technologien. Alterungsprozesse und visuelle Erschöpfung durch Bildschirme betreffen jeden.

Warum Blau der Rettungsanker ist

Menschen mit Rot-Grün-Sehschwäche (über 99 % aller Fälle von Farbfehlsichtigkeit) fehlt die Wahrnehmung für langwelliges (Rot) oder mittelwelliges (Grün) Licht. Die Rezeptoren für kurzwelliges Licht – also Blau – bleiben intakt. Farben mit einem soliden Blau-Anteil (Cyan, kühles Violett) werden deutlich differenzierter wahrgenommen als Rot-, Orange- oder Gelb-Grün-Mischungen, die bei Fehlsichtigkeit zu einem homogenen Braun-Grau verschmelzen. Aber auch hier zählt die Sättigung der Blautöne.

Der Gelbfilter des Alters

Mit zunehmendem Alter vergilbt die menschliche Augenlinse. Dieser natürliche Prozess wirkt wie ein physikalischer Gelbfilter. Kühle Blautöne und feine Grautöne verlieren an Kontrast. Sehr helle Pastelltöne – im Print gerne als Hintergrund für Zitate genutzt – werden für ältere Menschen schlicht unsichtbar.

Die Sättigungs-Falle im Dark Mode (Chromostereopsis)

Ein starker Blau-Anteil hilft bei Kontrasten, wird im Dark Mode aber zur Falle. Hochgesättigtes, leuchtendes RGB-Blau auf schwarzem Hintergrund führt dazu, dass das Auge Rot und Blau nicht auf denselben Punkt der Netzhaut fokussieren kann. Der Text scheint zu „schweben“. Das führt extrem schnell zu Augenermüdung (Fatigue) und Leseabbrüchen.

Die Illusion der Farb-Semantik (WCAG 1.4.1)

In gedruckten Fachbüchern gilt oft: Rot = Warnung, Grün = Lösung.
Auf einem Graustufen-Display oder für farbfehlsichtige Menschen bricht diese gelernte Sprache zusammen. Wer Grün und Rot nur über den Farbton unterscheidet, sieht auf dem Reader zwei identische Grautöne. Zudem sind leuchtende RGB-Farben auf hinterleuchteten Displays aggressive Reize für das Nervensystem, die kognitive Kapazität rauben.

Die Faustregel nach WCAG 1.4.1

Farbe darf eine Information dekorativ unterstützen, aber niemals das einzige Signal sein. Jede farbliche Auszeichnung braucht zwingend ein zweites, formales Merkmal – ein Icon, ein Präfix wie „Hinweis:“ oder typografische Auszeichnungen.

Infoboxen richtig bauen (Rahmen statt Fläche)

Der klassische Print-Reflex füllt Infoboxen mit bunter Hintergrundfarbe. Im E-Book fressen diese Vollflächen Kontraste auf, sobald die Schriftgröße geändert oder ein Sepia-Modus aktiviert wird.

Die barrierefreie Lösung

Ein sauberer Rahmen (border-left: 3px solid currentColor;) ohne Hintergrund, der das native Farbschema des E-Readers übernimmt. So ein Rahmen strukturiert die Box visuell, funktioniert in jedem Modus und passt sich der gewählten Textfarbe automatisch an. Das garantiert auf allen Geräten eine perfekte Sichtbarkeit.

Fazit: Die Autonomie der Leserschaft ist das stärkste UX-Argument

Das Lesen am Bildschirm ist für das menschliche Auge ein unnatürlicher Kraftakt. Gutes E-Book-Design ist aus multiplen Perspektiven durchdacht und übergibt der Leserschaft die Kontrolle. Wer seine Augen schonen will, schaltet auf Sepia. Wer im Dunkeln liest, nutzt den Dark Mode. Wer schlecht sieht, erhöht den Kontrast.

Ein E-Book, das diese Autonomie durch harte Farbcodes und feste Hintergründe erschwert, schließt Menschen aus, provoziert schlechte Rezensionen und verfehlt seinen wirtschaftlichen Zweck.

Code-Architektur im EPUB bietet die nötige Flexibilität, damit Inhalte in jeder Umgebung funktionieren. Farbe ist dabei ein sehr wichtiger Aspekt der Buchgestaltung. Digital bedeutet es lediglich, das bei der Farbgestaltung weitere Perspektiven mit reinspielen und Flexibilität eine andere Denkweise einfordert.

Profilbild von Anja Fritzsche – Inhaberin von Bookcode Tech

Nächster Schritt: Erstanalyse anfragen

Das nachträgliche Bereinigen von Farb- und CSS-Fehlern in exportierten EPUBs kostet immens viel Zeit und Knowhow.

Als Spezialistin für EPUB 3.3-Produktion und digitale Barrierefreiheit biete ich Verlagen modulare Code-Repair-Pakete an. Statt das gesamte Buch neu zu setzen, greife ich gezielt auf Code-Ebene ein, bereinige CSS-Strukturen und mache das EPUB nach aktuellen Praxisstandards barrierefrei und damit wirtschaftlich zukunftsfähig.

Jede Erstanalyse ist unverbindlich und kostenfrei. Die ermittelten Ergebnisse geben darüber Aufschluss, wo Verbesserungspotenzial besteht und rechtliche Lücken geschlossen werden können.

Nutze das Online-Formular* zur Spezifikation deines Projekts, um eine fundierte Analyse deiner Dokumente oder Manuskripte anzufordern.

* Hinweis zur Datensicherheit: Dein Upload und alle Projektdaten sind durch das direkt im Formular integrierte, rechtsgültige Non‑Disclosure Agreement (NDA) ab der ersten Sekunde vollumfänglich geschützt.

Zum Online-Formular

FAQ für technisch Interessierte

  1. Was ist der technische Hintergrund von E-Ink?

    Standardmäßige Schwarz-Weiß-E-Reader (wie die Modelle mit E-Ink Carta oder Carta 1200) können genau und ausschließlich 16 verschiedene Graustufen darstellen.

    Das Geheimnis dahinter liegt in der digitalen Ansteuerung: Das Display arbeitet mit einer Farbtiefe von 4 Bit pro Pixel. Da jeder Bit-Zustand verdoppelt wird (2 hoch 4), ergeben sich exakt 16 Kombinationsmöglichkeiten von reinem Weiß über verschiedene Grautöne bis hin zu tiefem Schwarz.

    Physikalisch gesehen stecken in dem Display winzige Mikrokapseln mit geladenen schwarzen und weißen Pigmenten. Eine hauchdünne elektronische Schicht hinter dem Bildschirm – die sogenannte TFT-Matrix – gibt kurze elektrische Impulse ab. Diese Impulse wandern präzise gesteuert durch die 4-Bit-Informationen und verschieben die Pigmente so, dass das Auge genau die gewünschte Graustufe wahrnimmt.

  2. Warum funktioniert Blau fast immer?

    Weil die häufigste ‚Farbenblindheit‘ fast ausschließlich eine Rot-Grün-Schwäche ist (über 99 % der Fälle). Das biologische System für die Wahrnehmung von Blau liegt auf einem ganz anderen Gen und bleibt davon unberührt. Blau wird also von nahezu jedem Menschen korrekt wahrgenommen, weshalb ein höherer Blauanteil in Farben ein höheres Kontrastverhältnis bieten kann.

    Bleiben Hintergründe weiß, funktioniert das auch hervorragend mit Graustufen. (Quelle: bionity.com)

    Praxistipp: Selbst testen kann man die unterschiedlichen Auswirkungen der Farbgestaltung mit der App Color Blind Pal, die einen mit dafür entwickelten Farbfilter buchstäblich durch andere Augen sehen lässt.

  3. Warum ermüden manche Farben im Dark Mode die Augen?

    Wenn gesättigtes RGB-Blau auf schwarzem Grund steht, greift ein optisches Phänomen namens Chromostereopsis. Da blaues und rotes Licht im Auge unterschiedlich stark gebrochen werden, entstehen zwei verschiedene Fokuspunkte auf der Netzhaut. Das zwingt die Augenmuskeln zu ständiger, unbewusster Nachfokussierung (Re-Akkommodation), was rasch zu visueller Ermüdung (Fatigue) führt. Der Dark Mode an sich ist oft angenehm, bietet zusätzlich abgeschwächte Dunkeltöne durch Anthrazit mit Gelbanteil. Eine hohe Farbsättigung bietet ein zu geringes Kontrastverhältnis. (Quelle: Study on Chromostereoscopic Stimulus / PMC)

    Bestes Beispiel ist Apples Verwendung von Blau bei Links (siehe Apple Developer Documentation):

    Das sind die Farbecodes als Hexcode `#0A84FF`, als RGB `rgb(10, 132, 255)` und als RGBA`rgba(10, 132, 255, 1.0)`

  4. Warum verlieren ältere Menschen oft die Sicht auf kühle Farbtöne?

    Das liegt an einer ganz natürlichen biologischen Veränderung: Im Laufe des Lebens verdichten sich die Proteine in unserer Augenlinse (Linsenbruneszenz). Die Linse vergilbt dadurch schleichend. Da eine gelbe Linse wie ein physikalischer Filter für kurzwelliges, blaues Licht wirkt, erreicht deutlich weniger blaues Licht die Netzhaut. Für ältere Augen büßen kühle Farben (wie Blau, Cyan oder kühles Grau) drastisch an Leuchtkraft und Kontrast ein. Barrierefreie Gestaltung bedeutet deshalb auch, Texte nicht allein durch feine, kühle Farbnuancen vom Hintergrund abzuheben. (Quelle: Clinical Review / Cureus)

  5. Was fordert die Barrierefreiheits-Richtlinie WCAG 1.4.1 (Einsatz von Farbe)?

    Das Erfolgskriterium verlangt auf Level A, dass Farbe niemals als einziges visuelles Mittel eingesetzt werden darf, um Informationen zu vermitteln, Aktionen anzuzeigen, eine Reaktion anzufordern oder visuelle Elemente zu unterscheiden. (Quelle: W3C Web Accessibility Initiative)

    Negativ-Beispiel: Ein wichtiger Link im Text unterscheidet sich vom restlichen Text nur dadurch, dass er rot statt schwarz ist. Auf einem Graustufen-Display (E-Ink) ist dieser Unterschied unsichtbar.

    Positiv-Beispiel: Der Link ist farbig und zusätzlich unterstrichen oder fett formatiert. Dadurch bleibt er für jeden lesbar.

Schreibe einen Kommentar