Von „Hilfe, meine Farben!” zu cleveren Lösungen: Marken-Farben barrierefrei und Darkmode-aware gestalten.
E-Mail-Marketer möchten, dass ihre Kampagnen nicht nur gut aussehen, sondern auf allen Geräten und in jeder Nutzungssituation eine überzeugende User Experience bieten – inklusive Zugänglichkeit für alle Zielgruppen. Wenn die E-Mail-Templates technisch solide sind, die inhaltlichen Guidelines (z. B. Struktur, Alt-Texte, klarer Code) feststehen, der E-Mail-Barrierefreiheits-Check aber immer noch Fehler anzeigt, dann liegt es oft an den Markenfarben: Sie erfüllen schlicht nicht die WCAG-Kontrast-Vorgaben.

Was hat Vorrang – Corporate Design oder Barrierefreiheit?
In den meisten Fällen geben Unternehmen den Brand-Vorgaben den Vorrang. Schließlich geht es um die Wiedererkennung der Marke! Außerdem sind Farbkontraste nur ein kleiner Bestandteil der Anforderungen an die Barrierefreiheit von E-Mails und die Rechtslage, ob Newsletter überhaupt barrierefrei gestaltet sein müssen, ist noch nicht eindeutig geklärt.
Diese Einstellung ist nachvollziehbar, doch ein genauerer Blick auf das Thema Markenfarben in E-Mails lohnt sich: Eine geringere Zugänglichkeit kann nämlich durchaus das Engagement und die Konversionsrate schmälern.
Farbkontrolle ist eine Illusion
Die Vorstellung, dass Corporate Identity-Verantwortliche und E-Mail-Marketer die volle Kontrolle über die Farben in ihren E-Mails haben, ist schon lange eine Illusion. Der Darkmode verändert bereits munter Ihre Farben, z. B:
- Gelbe Buttons werden beige.
- Dunkelblaue Schrift auf Buttons wird hellblau umgefärbt und macht CTAs völlig unlesbar.
- Rote Störer werden pink und beißen sich mit dem Unternehmensrot im Logo.
Die meisten E-Mail-Marketing-Verantwortlichen wissen mittlerweile über die Eigenarten des Darkmode Bescheid. Sie akzeptieren, dass sich nicht alle Probleme einfach beheben lassen. Es bedeutet enormen Aufwand, für jeden Client ein eigenes Farbschema zu definieren – und dann muss man hoffen, dass das Schema für alle Betriebssysteme, Geräte und zukünftige Updates funktioniert. (Übrigens: Den Light-Mode zu erzwingen, ist niemals die beste Lösung!)
Viele akzeptieren also zähneknirschend, dass es Abweichungen von den vorgegebenen Brand-Farben in verschiedenen E-Mail-Clients gibt.
Warum sollten Sie dann ausgerechnet beim Thema Barrierefreiheit und Kontraste darauf bestehen, dass die Farben nicht verändert werden dürfen?
Lösungsansätze für eine bessere User Experience
Sowohl für die Kontraste bei der Barrierefreiheit als auch für die Farbveränderung im Darkmode lassen sich Lösungen finden, die eine bessere User Experience bieten und E-Mails sowohl lesbarer als auch wiedererkennbarer machen. Allerdings erfordern sie etwas Flexibilität bei der Farbwahl.
Kleine Anpassungen, große Wirkung
Meistens sind es kleine Veränderungen am Hexcode – ein etwas dunklerer Rotton oder ein etwas hellerer Blauton–, die Texte lesbarer gestalten und gleichzeitig dafür sorgen, dass im DarkMode keine Neonfarben mehr auftauchen. Anstelle von reinem Schwarz (#000000) oder Weiß (#FFFFFF) sollte man lieber dunkles Grau (#1A1A1A) oder Offwhite(#F5F5F5) verwenden, um problematische Farbjustierungen zu vermeiden. Die kleinen Unterschiede sind für Kundinnen und Kunden meist mit bloßem Auge nicht zu erkennen.
Konkrete Vorgehensweise:
1. Farbanalyse durchführen: Prüfen Sie Ihre aktuellen Markenfarben auf WCAG-Konformität. Kontrast-Tools wie „WebAIM Contrast Checker” oder „Colour Contrast Checker” helfen bei der Feinabstimmung.
2. Alternative Farbtöne entwickeln: Erstellen Sie leicht angepasste Versionen Ihrer Unternehmens-Farben.
3. Darkmode-Tests: Testen Sie die Farbwirkung der angepassten Farben in verschiedenen Darkmode-Umgebungen.
Fazit – Markenidentität trifft auf funktionale Zugänglichkeit
Ja, Brand-Vorgaben sind wichtig. Aber sie sollten nicht zu starr sein. Flexibilität ist der Schlüssel! Bereits kleine Farbjustierungen können sowohl den WCAG-Kontrast sichern als auch für Darkmode-Resillienz sorgen.
Unternehmen, die ihre Markenfarben für Barrierefreiheit und verschiedene Darstellungsmodi anpassen, investieren somit in die Zugänglichkeit ihrer Kommunikation. Die Frage sollte daher nicht lauten: „Corporate Design oder Barrierefreiheit?” sondern: „Wie gestalten wir unser Corporate Design so, dass es in allen digitalen Kontexten funktioniert und für alle Nutzer:innen zugänglich ist?”