Lade dir unser kostenloses Handbuch herunter, das dir bei der Umsetzung deiner E-Mail-Marketingstrategie helfen wird.
Die eingegebene E-Mail-Adresse ist ungültig.
Vielen Dank für deine Anmeldung.
Mit der Angabe deiner E-Mail bestätigst du, dass du unsere Datenschutzerklärung gelesen und verstanden hast und einverstanden bist, Marketing-E-Mails von Squarespace zu erhalten.
Egal, ob du Geschäftsinhaber:in, Marketing-Expert:in oder einfach Wert auf Inklusivität legst: Das Verständnis der Prinzipien des barrierefreien E-Mail-Designs ist ein entscheidender Schritt zur Förderung einer inklusiveren digitalen Landschaft. Barrierefreie E-Mails zu erstellen ist nicht nur eine Frage des guten Willens. Es kann auch eine gesetzliche Anforderung für dein Unternehmen sein und ist der Grundpfeiler für ein großartiges Benutzererlebnis.
Hier sind fünf einfache Dinge, die du beim Verfassen von E-Mails beachten solltest, um sicherzustellen, dass sie einladend, informativ und für Personen mit den unterschiedlichsten Bedürfnissen und Vorlieben nutzbar sind.
Hinweis: Diese Anleitung ist als Ressource gedacht, um dir den Einstieg zu erleichtern, sollte aber nicht als Rechtsberatung ausgelegt oder verstanden werden. Squarespace kann dich nicht dabei beraten, wie du dafür sorgen kannst, dass deine Website bestimmten Gesetzen, Bestimmungen oder Standards zur Barrierefreiheit entspricht.
1. Füge Alternativtext für Bilder hinzu
Alternativtext ist eine Beschreibung eines Bildes, das mit Hilfstechnologien erkannt werden kann. Alternativtext ist nicht nur für Menschen mit Sehbehinderungen praktisch, sondern auch für:
Menschen mit kognitiven Behinderungen, die die gesprochene Sprache besser verstehen als Bildsprache
Personen, die Sprachassistenten verwenden, wenn sie sich nicht gerade die E-Mail ansehen
User, denen aufgrund einer schlechten Internetverbindung möglicherweise kein Bild angezeigt wird
User, die Bilder aus Zeit- oder Kostengründen nicht herunterladen möchten
Das Hinzufügen von Alternativtext zu deinen Bildern stellt sicher, dass alle Leser:innen die wichtigsten Informationen aus deiner E-Mail abrufen können. Um zu wissen, wann du Alternativtext hinzufügen und hilfreiche Beschreibungen verfassen solltest, kannst du dich fragen:
Ist dieses Bild dekorativ oder vermittelt es Informationen? Dekorative Bilder benötigen leeren Alternativtext, da sie nicht dazu dienen, die Informationen in der E-Mail besser zu verstehen.
Was muss jemand über das Bild wissen? Nicht jede Information eines Bildes ist notwendig, um jemandem zu helfen, seinen Zweck zu verstehen. Beispielsweise ist die Hintergrundfarbe eines Porträts nicht wichtig, der Name der Person auf dem Foto aber wahrscheinlich schon.
Beachte beim Schreiben von Alternativtexten diese weiteren Richtlinien.
Versuche, den Alternativtext auf maximal 250 Zeichen zu beschränken. Wenn für ein Bild eine längere und detailliertere Beschreibung erforderlich ist, solltest du eine Beschriftung für die vollständige Beschreibung hinzufügen.
Gib in deiner Beschreibung nicht „ein Bild von“ oder „ein Foto von“ an. Unterstützende Technologien identifizieren Bilder für Benutzer:innen, sodass du dies nicht tun musst.
Hol dir mehr Tipps für das Schreiben hilfreicher Alternativtexte
2. Strukturiere E-Mails mit Überschriften
Die Art und Weise, wie du Inhalte in deinen E-Mails organisierst, wirkt sich darauf aus, wie Menschen, die Hilfstechnologien verwenden, darin navigieren. Damit deine E-Mails für diese Technologien leichter zu navigieren sind, musst du dein Layout einfach und einheitlich halten und die einzelnen Abschnitte in deiner E-Mail klar und deutlich benennen.
Du kannst deiner E-Mail eine leicht verständliche Struktur geben, indem du Überschriften (z. B. H1, H2, H3) verwendest, anstatt dich auf fett oder kursiv gedruckten Text zu verlassen, um verschiedene Abschnitte deiner E-Mail voneinander zu trennen. Verwende nur ein H1 pro E-Mail, da ein H1 den Titel oder die Überschrift kennzeichnet, und verwende die Überschriftenebenen entsprechend ihrer Reihenfolge, anstatt direkt von einem H2 zu einem H4 überzugehen.
Damit deine E-Mails leichter zu überfliegen sind, verwende eine Kombination aus Schriftgröße, Schriftstärke, Stil oder sogar Farbe, um normalen Absatztext vom Titeltext zu unterscheiden. Zum Beispiel ziehen kräftigere und größere Schriftarten die Aufmerksamkeit auf sich. Wende sie daher auf Texte an, die du hervorheben möchtest, z. B. auf Abschnittsüberschriften.
3. Berücksichtige die Schriftart und -größe
Lesbarkeit ist ein wichtiger Bestandteil, um deine E-Mails barrierefreier zu gestalten. Wenn du Schriftgröße, Stil, Farbe, Abstände und mehr sorgfältig auswählst, können andere leichter durch deine Inhalte navigieren.
Schriftart-Stil
Wir empfehlen, eine lesbare Schriftart mit klaren Linien und sehr wenigen dekorativen Verzierungen zu wählen. In der Regel funktionieren serifenlose Schriftarten wie Arial, Calibri, Tahoma oder Helvetica auf Bildschirmen besser. Diese Schriftarten erleichtern es den Empfänger:innen, deine E-Mail zu überfliegen und deine Nachricht schnell zu verstehen – das ist wichtig, wenn viele Leute ihren Posteingang unterwegs überprüfen.
Für eine bessere Lesbarkeit auf verschiedenen Plattformen und Geräten verwenden die meisten E-Mail-Clients standardmäßig eine serifenlose Schriftart, wenn sie die von dir verwendete Schrift nicht unterstützen. Falls du zusätzliche Hinweise zu den Schriftart-Optionen benötigst, findest du auch eine Liste von barrierefreien und quelloffenen Schriften auf der Website von U.S. Web Design System.
Schriftgröße
Die Schriftgröße, die du auswählst, hat großen Einfluss auf die Lesbarkeit deiner E-Mail, insbesondere für Menschen mit Sehbehinderungen. Eine gute Mindestschriftgröße, die du anstreben solltest, ist 16 px (abhängig von der Art der Schriftart, die du verwendest).
Versuche, verschiedene Größen zu testen, während du deine Nachricht entwirfst, da die Lesbarkeit je nach Schriftart variieren kann. Es ist auch wichtig, eine Test-E-Mail zu senden, bevor du sie an deine Abonnent:innen sendest, damit du sehen kannst, wie deine Designauswahl auf verschiedenen Geräten und Bildschirmen aussieht.
Schriftfarbe
Wähle eine Schriftfarbe, die sich deutlich vom Rest der Hintergrundfarbe abhebt (z. B. schwarze Schrift auf weißem Hintergrund). Je mehr Kontrast vorhanden ist, desto lesbarer sind deine Inhalte.
Auch wenn manche Farben einen Kontrast bilden (wie Grün und Rot), können Personen mit einer Sehbehinderung (wie Grün-Rot-Farbenblindheit), deine Inhalte möglicherweise nicht sehen. Du kannst einen Farbkontrast-Prüfer verwenden, um sicherzustellen, dass dein Text vor dem Hintergrund gut lesbar ist.
4. Verwende beschreibenden Text für Links
Wenn du einen beliebigen Text mit einem Hyperlink versiehst, solltest du deine Links mit entsprechenden Bezeichnungen versehen. Hilfstechnologien weisen im Allgemeinen darauf hin, wenn Text verlinkt ist, sodass du das Wort „Link“ nicht in deinen Inhalt aufnehmen musst.
Wenn du User:innen beispielsweise auf eine Kontakt-Seite weiterleitest, ist es hilfreicher, „Kontaktieren Sie uns auf unserer Kontakt-Seite“ zu schreiben, als „Um uns zu kontaktieren, klicken Sie auf den folgenden Link“. Im Allgemeinen ist es für eine Person einfacher zu wissen, wohin ein Link führt, wenn sie nur den Link-Text und nicht den Link-Text samt Umgebungstext lesen muss.
Stelle abschließend sicher, dass sich deine Links optisch vom Rest des Umgebungstextes unterscheiden, damit die Leser:innen wissen, dass es sich nicht um normalen Text handelt. Hierzu kannst du sie formatieren, z. B. durch eine andere Farbe, Kursivschrift, Unterstreichung oder durch ein Symbol oder einen Button.
5. Vermeide die Verwendung von GIFs
GIFs können einigen E-Mails ein lustiges und ansprechendes Element verleihen, aber es ist wichtig, den Kontext und die Zielgruppe zu berücksichtigen, da sie eine große Herausforderung für die Barrierefreiheit darstellen können. Sie sind möglicherweise nicht mit Screenreadern kompatibel, was es für Personen mit Sehbehinderungen schwierig macht, den Inhalt der E-Mail zu verstehen.
GIFs können informationsreich sein, da sie in der Regel mehr Details zeigen oder mehr vermitteln als ein statisches Bild. Es kann schwierig sein, einen geeigneten Alternativtext bereitzustellen, damit Benutzer:innen von Hilfstechnologien sie besser verstehen. Sie können auch ablenken, eine visuelle Störung verursachen und von der Kernbotschaft der E-Mail ablenken.
Wenn du dich jedoch entscheidest, deiner E-Mail ein GIF hinzuzufügen, solltest du ein sich langsam bewegendes GIF verwenden, das nicht öfter als dreimal in einer Sekunde blinkt oder springt, da das für manche sehr störend sein kann. Wenn die Möglichkeit besteht, dass Leser:innen das GIF anhalten können, solltest du diese Option auch anbieten. Füge außerdem immer einen Alternativtext hinzu, der das GIF beschreibt, falls sie das Bild nicht sehen können.