Der ultimative Leitfaden für Dark Mode für E-Mail-Marketer

Avatar of Chris Coyier
Chris Coyier am

DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!

Im *regulären* Web (nehme ich an) behandeln wir "Dark Mode" mit der CSS-Media-Query prefers-color-scheme. Aber, und das überrascht niemanden, es ist in der Welt des HTML-E-Mails weitaus seltsamer. Die Seltsamkeit besteht darin, dass verschiedene E-Mail-Clients den Dark Mode unterschiedlich handhaben, angefangen damit, dass der E-Mail-Client selbst möglicherweise eine eigene Umschaltmöglichkeit für den Dark Mode hat.

Nehmen wir an, diese Umschaltmöglichkeit hat den Dark Mode aktiviert. Dann können drei Dinge passieren:

  1. Die UI der App wechselt in den Dark Mode, aber die E-Mail bleibt unverändert (z. B. Apple Mail).
  2. Sie versucht, Dark Mode auch auf Ihre E-Mails anzuwenden, aber nur, wenn sie helle Bereiche erkennt. Diese Bereiche werden dunkel, während dunkle Bereiche unverändert bleiben (z. B. Outlook.com).
  3. Sie geht voll rein und invertiert die E-Mail-Farben zwangsweise (z. B. die Gmail-App auf iOS 13).

Letzteres ist verrückt. Wie Alice Li sagt:

Dies ist das invasivste Farbschema: Es invertiert nicht nur die Bereiche mit hellen Hintergründen, sondern beeinträchtigt auch dunkle Hintergründe. Wenn Sie also Ihre E-Mails bereits mit einem dunklen Thema gestaltet haben, werden sie durch dieses Schema ironischerweise zu hellen Designs gezwungen.
Hervorhebung ihrerseits.

Direkter Link →