Tab-Taste zeigt Sprunglinks an. Enter aktiviert den ausgewählten Sprunglink und navigiert direkt zum entsprechenden Seitenbereich.

Barrierefreie E-Mails: BFSG-Pflichten für Newsletter und Transaktionsmails 2026

11. Mai 20267 Min. Lesezeit
Barrierefreie E-Mails: HTML-E-Mail mit korrekten Alt-Texten, Kontrastmarkierungen und semantischer Struktur

Eine Studie des Email Markup Consortium aus dem Jahr 2025 analysierte über 500.000 E-Mails und kam zu einem erschreckenden Ergebnis: 99,97% aller HTML-E-Mails haben mindestens ein Barrierefreiheitsproblem[1]. Das BFSG verpflichtet Unternehmen, die digitale Dienste an Verbraucher erbringen, auch ihre Transaktionsmails zugänglich zu gestalten.

Welche E-Mails sind BFSG-pflichtig?

  • Betroffen: Transaktionsmails, die Teil der digitalen Dienstleistung sind: Bestellbestätigungen, Rechnungen, Versandbenachrichtigungen, Zugangsdaten, Passwort-Resets
  • Grauzone: Willkommens-E-Mails und Onboarding-Sequenzen, da sie direkt an den Verbraucherdienst geknüpft sind
  • Weniger eindeutig: Reine Marketing-Newsletter ohne direkten Transaktionsbezug, sofern keine vertragliche Verpflichtung besteht

Warum E-Mail-Barrierefreiheit häufig ignoriert wird

E-Mails werden oft als Ausnahme von Barrierefreiheitsanforderungen betrachtet, weil sie kein Teil einer Website sind. Das ist falsch. Eine Auftragsbestätigung, eine Rechnung im PDF-Anhang oder ein Passwort-Reset sind integrale Bestandteile eines digitalen Dienstes und fallen damit unter die BFSG-Pflicht.

Laut dem Email Markup Consortium sind die häufigsten Probleme[1]:

  • Fehlende Sprach-Deklaration: 99,8% aller E-Mails haben kein lang-Attribut am <html>-Element
  • Fehlende Alt-Texte: Bilder ohne Beschreibung sind in über 80% der HTML-Mails vorhanden
  • Unzureichende Farbkontraste: Besonders in Marketing-Mails mit hellen Pastellfarben
  • Keine Klartextvariante: HTML-E-Mails ohne Plain-Text-Fallback sind für bestimmte assistive Technologien problematisch

Die wichtigsten technischen Anforderungen

1. Sprache deklarieren

Die Sprachdefinition ist die häufigste fehlende Anforderung und die einfachste zu beheben:

<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Ihre Bestellbestätigung</title>
</head>

Screenreader-Nutzer hören Inhalte in der korrekten Sprache vor. Ohne lang-Attribut wird Deutsch möglicherweise mit englischer Aussprache gelesen.

2. Alt-Texte für alle Bilder

<!-- Richtig: Inhaltliches Bild mit beschreibendem Alt-Text -->
<img src="logo.png" alt="Barrierefix GmbH Logo" width="200" height="60">

<!-- Richtig: Dekoratives Trennbild -->
<img src="divider.png" alt="" role="presentation">

<!-- Richtig: Produktbild in Bestellbestätigung -->
<img src="product.jpg" alt="Wireless Keyboard Modell K380, Schwarz" width="150" height="150">

<!-- Falsch: Kein Alt-Text -->
<img src="product.jpg">

3. Semantische Überschriftenstruktur

E-Mail-Clients unterstützen oft kein volles HTML5, aber Überschriften-Tags sind breit unterstützt und helfen Screenreader-Nutzern bei der Navigation:

<h1>Ihre Bestellbestätigung #12345</h1>
<h2>Bestellte Artikel</h2>
<h2>Lieferadresse</h2>
<h2>Zahlungsinformationen</h2>

Vermeiden Sie, Texte durch CSS visuell zu vergrößern statt semantische Überschriften zu verwenden. Eine <p>-Zeile mit font-size: 24px ist für Screenreader keine Überschrift.

4. Ausreichender Farbkontrast

Das WCAG-Mindestkontrasterfordernis von 4,5:1 für normalen Text gilt auch in E-Mails. Besonders problematisch sind:

  • Hellgraue Fußzeilentexte auf weißem Hintergrund (oft unter 3:1)
  • Farbige Call-to-Action-Buttons mit weißem Text in schwachen Farbtönen
  • Statusmeldungen in hellgelb oder hellgrün

5. Barrierefreie Links und Buttons

<!-- Richtig: Beschreibender Link-Text -->
<a href="https://example.com/bestellung/12345">
  Bestellung #12345 verfolgen
</a>

<!-- Falsch: Nichtssagender Link-Text -->
<a href="https://example.com/bestellung/12345">Hier klicken</a>

<!-- Richtig: Button mit deutlichem Label -->
<a href="https://example.com/account"
   style="background-color: #f97316; color: white; padding: 12px 24px;
          border-radius: 6px; text-decoration: none; display: inline-block;">
  Zum Kundenkonto
</a>

E-Mail-Templates auf Barrierefreiheit prüfen

Wir analysieren Ihre Transaktionsmails und Newsletter auf BFSG-Konformität

Kostenloses Erstgespräch

Plain-Text-Variante: Pflicht oder Empfehlung?

Jede HTML-E-Mail sollte eine Klartextvariante als Multipart-Alternative enthalten. Das ist aus mehreren Gründen wichtig:

  • Nutzer, die E-Mails als reinen Text lesen (aus Sicherheits- oder Präferenzgründen), erhalten den vollständigen Inhalt
  • E-Mail-Clients, die HTML nicht unterstützen, zeigen die Klartextversion
  • Bestimmte Screenreader-Konfigurationen bevorzugen Klartextdarstellung

Die meisten E-Mail-Versandsysteme wie Mailchimp, Brevo (ehemals Sendinblue) oder AWS SES unterstützen Multipart-Mails. Die Konfiguration erfolgt einmalig im Template.

Barrierefreie PDF-Anhänge in Transaktionsmails

Rechnungen, Lieferscheine und Auftragsbestätigungen werden häufig als PDF-Anhänge versendet. Diese PDFs müssen ebenfalls barrierefrei sein, sobald sie Teil des digitalen Diensts sind.

Anforderungen an PDF-Anhänge in Transaktionsmails:

  • Korrektes Tagging der Dokumentstruktur (H1-H6, Absätze, Listen, Tabellen)
  • Alt-Texte für Logos und grafische Elemente
  • Metadaten (Dokumenttitel, Sprache) gesetzt
  • Lesbare Schriftgröße und ausreichender Kontrast

Mehr dazu im Artikel PDF Barrierefreiheit: Der vollständige BFSG-Leitfaden 2026.

Tools zum Testen barrierefreier E-Mails

ToolKostenWas es prüft
Litmus Accessibility CheckerAb 99 USD/MonatKontrast, Alt-Texte, Screenreader-Vorschau
Email on AcidAb 74 USD/MonatRendering in 100+ Clients, Accessibility-Tab
WAVE (Webversion der Mail)KostenlosHTML-Struktur, wenn Mail im Browser geöffnet
axe DevToolsKostenlos (Basis)Barrierefreiheit für im Browser angezeigte E-Mails
Checklist von Accessible EmailKostenlosManuelle Prüfliste nach WCAG

Für regelmäßig versendete Templates empfiehlt sich ein einmaliger Audit mit anschließender Integration der Prüfung in den Entwicklungsprozess, bevor neue Templates live gehen[2].

Checkliste: Barrierefreie Transaktionsmail

E-Mail Barrierefreiheits-Checkliste

  • lang-Attribut am <html>-Element gesetzt (z.B. lang="de")
  • Alle informativen Bilder haben beschreibende Alt-Texte
  • Dekorative Bilder haben leeres Alt-Attribut (alt="")
  • Semantische Überschriften (H1, H2) statt nur visuell vergrößerter Text
  • Farbkontrast mindestens 4,5:1 für normalen Text
  • Link-Texte beschreiben das Ziel (kein "hier klicken")
  • Schriftgröße mindestens 14px für Fließtext, 12px für sekundären Text
  • Plain-Text-Variante als Multipart-Alternative enthalten
  • PDF-Anhänge sind getaggt und barrierefrei
  • Tabellen haben Header-Zellen mit scope-Attribut

Häufig gestellte Fragen

FAQHäufig gestellte Fragen

Gilt das BFSG auch für Marketing-Newsletter?

Transaktionsmails sind klar betroffen. Bei reinen Marketing-Newslettern ist der Geltungsumfang weniger eindeutig, aber Barrierefreiheit ist aus AGG-Gründen und als Best Practice empfehlenswert.

Mein ESP erstellt die Templates. Bin ich trotzdem verantwortlich?

Ja. Als Absender sind Sie für die Barrierefreiheit verantwortlich, unabhängig vom verwendeten Tool.

Was sind die drei wichtigsten Sofortmaßnahmen?

(1) lang-Attribut am html-Element ergänzen, (2) Alt-Texte für alle Bilder hinzufügen, (3) Farbkontraste prüfen und bei Unterschreitungen anpassen.

Weiterführende Artikel:

Kostenloses Audit Ihrer Website

Lassen Sie uns Ihre Website auf Barrierefreiheit prüfen – kostenlos und unverbindlich

Themen:

Barrierefreie E-MailsBFSG E-MailNewsletter BarrierefreiheitTransaktionsmail zugänglichHTML E-Mail WCAGE-Mail Accessibilitybarrierefreier NewsletterWCAG E-Mail