Du wirst lernen
Lerne, wie du deine E-Mail und dein Anmeldeformular zugänglicher machen kannst. Wenn du dein E-Mail- und Anmeldeformular gestaltest, solltest du darauf achten, dass deine Designs für alle Empfänger/innen zugänglich sind. Auch wenn die Zeit, die du dir für die zusätzliche Arbeit nimmst, als lästig erscheinen mag, wird sie sich für die Millionen von Menschen, die mit einer Behinderung auf der Welt leben, enorm auszahlen.
Barrierefreiheit in E-MailsBarrierefreiheit in E-Mails
Betreff und Vorschautext optimierenBetreff und Vorschautext optimieren
Wenn du dir bei deinem Betreff und dem Vorschautext besonders viel Mühe gibst, wird deine E-Mail nicht nur leichter zugänglich, sondern wirkt sich auch auf deine Öffnungsrate aus. Dein Betreff und dein Vorschautext sollten beschreibend, verlockend und kurz sein.
Grundlegendes E-Mail-DesignGrundlegendes E-Mail-Design
Genau wie bei Betreff gilt: Wenn du die Best Practices für das Design deiner E-Mail befolgst, machst du auch deine E-Mail zugänglicher. Dazu gehört, dass du alle Bilder mit einem Alt-Text versiehst, keine reinen Bild-E-Mails verschickst, kontrastreiche Farben verwendest (z. B. weiß und schwarz, grau und dunkelblau, rosa und dunkelrot), Überschriften zur Trennung von Ideen verwendest, beschreibende Links verwendest (z. B. "Shop the collection" statt "Click here to go to the collection") und deine E-Mail logisch strukturierst. Mit diesen Best Practices stellst du sicher, dass alle deine Kunden deine Nachrichten erhalten und dass du auch den Posteingang erreichst.
Checkliste und BeispielCheckliste und Beispiel
- Schreibe Betreffs und Vorschautexte, die beschreibend, kurz und auf den Punkt sind.
- Füge einen Alt-Text zu allen Bildern hinzu.
- Vermeide es, sachdienliche Informationen in Bilder einzubauen.
- Verwende kontrastierende Farben.
- Verwende Überschriften, um Ideen zu trennen.
- Verwende beschreibende Sprache in Links.
- Gestalte die E-Mail in einer logischen Struktur.
Unten siehst du ein Beispiel für eine E-Mail, die für alle Empfänger optimiert ist (links) und eine, die das nicht ist (rechts).
Barrierefreiheit im AnmeldeformularBarrierefreiheit im Anmeldeformular
Zum Glück macht es der Code hinter deinem Klaviyo Anmeldeformular möglich, dass alle deine Empfängerinnen und Empfänger die Informationen, die sie brauchen, durchsehen können. Ein Klaviyo-Formular, das du auf deiner Website veröffentlichst, ermöglicht es den Website-Besucherinnen und -Besuchern automatisch, das Formular vollständig über die Tastatur zu bedienen, und Screenreader können die Formulare lesen. Außerdem können Website-Besucher ein Formular mit der Escape-Taste schließen und mit der Enter-Taste abschicken. Außerdem kannst du im Formular-Editor auf der Registerkarte " Formatvorlagen" eine Umrissfarbe hinzufügen , damit die Nutzer/innen wissen, welches Feld beim Durchblättern des Formulars hervorgehoben ist.
Anmeldeformular-DesignAnmeldeformular-Design
Genau wie beim E-Mail-Design solltest du einige grundlegende Richtlinien befolgen, um sicherzustellen, dass alle deine Empfänger die Informationen erhalten, die du ihnen über deine Formulare mitteilen möchtest. Wenn du Formulare entwirfst, verwende kontrastreiche Farben, vermeide es, relevante Informationen in Bildern unterzubringen, verwende beschreibende Sprache in Links und baue deine Formulare logisch auf. Während du dein Anmeldeformular erstellst, überwacht Klaviyo eine Reihe von Problemen mit der Barrierefreiheit und fordert dich auf, alle erkannten Probleme auf der Registerkarte Formularwarnungen zu beheben.
Unter "Wie erstelle ich ein ADA-freundliches Anmeldeformular?" erfährst du mehr über die Erstellung barrierefreier Anmeldeformulare im Klaviyo form editor.
Unten siehst du ein Beispiel für ein gut gestaltetes Formular (rechts) und ein Formular, das nicht für alle zugänglich ist (links).
Zusätzliche Ressourcen