Du wirst lernen
Lerne, wie du den Zugänglichkeitsassistenten auf der Registerkarte Formularwarnungen im Anmeldeformular-Editor nutzen kannst, um einige der häufigsten Probleme bei der Einhaltung der Zugänglichkeitsrichtlinien für Web-Inhalte (WCAG) zu vermeiden. Unternehmen, die ihre Websites ADA-freundlich gestalten wollen, sollten sich auf die WCAG-Standards beziehen und diese befolgen. Der Assistent für Barrierefreiheit hilft dir dabei, Anmeldeformulare zu erstellen, die für alle Besucher deiner Website zugänglich sind.
Die WCAG-Standards zielen darauf ab, Webinhalte für alle zugänglicher zu machen, auch für Menschen mit Behinderungen. Die Zugänglichkeit von Websites ist in vielen Ländern gesetzlich vorgeschrieben, und die Umsetzung der WCAG-Standards kann dazu beitragen, viele dieser Anforderungen zu erfüllen. Bitte beachte, dass der Zugänglichkeitsassistent zwar dabei helfen soll, Zugänglichkeitsprobleme gemäß den WCAG 2.0 AA-Standards, wie sie für das Anmeldeformular gelten, zu erkennen, dass er aber aufgrund bekannter Einschränkungen der vorhandenen Technologie oder anderer technologieunabhängiger Faktoren möglicherweise nicht in der Lage ist, alle Zugänglichkeitsanforderungen zu erkennen. Die Verwendung des Zugänglichkeitsassistenten kann bei der Erfüllung der Anforderungen an die Barrierefreiheit im Internet helfen, garantiert aber nicht die Einhaltung der geltenden Gesetze. Um die rechtlichen Auswirkungen und Anforderungen der Barrierefreiheit im Internet zu klären, wird empfohlen, einen qualifizierten Anwalt zu Rate zu ziehen.
Bevor du beginnst
Im Folgenden findest du eine Liste von Problemen, die der Zugänglichkeitsassistent überprüft. Bitte beachte, dass die unten aufgelisteten Fehlertypen so sind, wie sie der Eingabehilfen-Assistent von Klaviyo identifiziert, und nicht die spezifischen Eingabefeldnamen im Form Builder. Wenn ein Fehler entdeckt wird, erscheint eine Warnung mit einer Beschreibung und einer Aufforderung zur Fehlerbehebung auf der Registerkarte Formularwarnungen.
Fehlerart |
Beschreibung |
Button-Name |
Stellt sicher, dass die Schaltflächen einen erkennbaren Text haben. |
Image-alt |
Stellt sicher, dass das Bildelement einen alternativen Text (alt text) oder eine HTML-Rolle von "none" oder "presentation" hat. |
Farbkontrast |
Stellt sicher, dass der Kontrast zwischen Vorder- und Hintergrundfarben den Schwellenwerten für das Kontrastverhältnis nach WCAG 2 AA entspricht. |
Link-in-Text-Block |
Achte darauf, dass die Links vom umgebenden Text unterscheidbar sind, ohne dass die Farbe eine Rolle spielt. |
Link-Name |
Stellt sicher, dass die Links einen erkennbaren Text haben. |
Etikett |
Stellt sicher, dass jedes Formularelement eine Beschriftung hat. |
Erstelle ein ADA-freundliches Anmeldeformular
Egal, ob du dein erstes Anmeldeformular erstellst oder ein Formular aktualisierst, der Zugänglichkeitsassistent hilft dir, Probleme mit der Zugänglichkeit zu erkennen und zu beheben.
So erstellst du ein Formular, das den oben genannten WCAG-Standards entspricht:
- Erstelle ein neues Anmeldeformular oder öffne den Formulareditor für eines deiner bestehenden Anmeldeformulare.
- Verwende den Editor, um Inhalte hinzuzufügen und das Formular so zu gestalten, dass es zu deiner Marke passt.
Der Eingabehilfen-Assistent sucht nach Formularelementen, die nicht den WCAG-Standards entsprechen, während du dein Formular erstellst, und protokolliert sie als aktive Warnmeldungen. Bei einem bestehenden Formular werden alle Probleme im Abschnitt " Aktive Warnungen"protokolliert.
- Klicke auf die Formularwarnungen unten links, um die festgestellten Probleme mit der Barrierefreiheit zu sehen.
Unter Aktive Warnungen siehst du verschiedene Karten, die die Elemente beschreiben, die nicht den WCAG-Standards entsprechen und die der Zugänglichkeitsassistent in deinem Formular identifiziert hat, zusätzlich zu anderen inhaltlichen oder gestalterischen Problemen. Jede Karte enthält eine Beschreibung des Problems und eine Aufforderung, es entweder zu beheben oder zu verwerfen. Wenn du zum Beispiel ein Bild zu deinem Anmeldeformular hinzufügst, weist dich der Zugänglichkeitsassistent darauf hin, dass du dem Bild einen Alt-Text hinzufügen sollst. Der Alt-Text enthält eine Beschreibung des Bildes, damit Kunden, die deine Website mit einem Bildschirmlesegerät besuchen, den Inhalt von digital aufrufen können.
- Um ein Problem zu beheben, folge den Vorschlägen auf der Karte und löse oder ergänze das fehlende Element. Wenn du mit deinen Änderungen zufrieden bist, klicke auf Reparieren.
Bei einigen Problemen wirst du aufgefordert, sie in den Einstellungen des jeweiligen Blocks (z. B. eines Schaltflächenblocks) oder im Abschnitt "Stile" zu beheben, anstatt direkt auf der Registerkarte " Formularwarnungen". Um diese Probleme zu lösen, notiere dir die Problembeschreibung auf der Warnkarte und klicke dann auf Block bearbeiten (oder Stile bearbeiten), um die vorgeschlagenen Änderungen vorzunehmen. Navigiere zurück zur Registerkarte Formularwarnungen , sobald du das Problem behoben hast.
- Wenn du einen oder mehrere der Vorschläge zur Barrierefreiheit ignorieren möchtest, klicke auf Ablehnen. Wenn du ein Problem verwirfst, erscheint ein modales Fenster, in dem du gefragt wirst, ob du deine Wahl abbrechen oder bestätigen möchtest.
Du kannst zu einem späteren Zeitpunkt zu den ignorierten Problemen zur ückkehren, indem du den Assistenten öffnest und deine zuvor abgelehnten Benachrichtigungen ansiehst. Es wird empfohlen, dass du alle Probleme behebst, die im Zugänglichkeitsassistenten angezeigt werden. Die Nichteinhaltung der WCAG-Standards kann dein Unternehmen einem rechtlichen Risiko aussetzen.
- Klicke auf " Veröffentlichen", um dein Anmeldeformular auf deiner Website mit deinem Accessibility Update live zu schalten.
Wenn du auf Veröffentlichen klickst, wirst du aufgefordert, alle aktiven Formularwarnungen zu korrigieren. Du kannst wählen, ob du die Fehler auf der Registerkarte Formularwarnungen beheben oder trotzdem veröffentlichen willst.
JAWS Berichte zur Barrierefreiheit
Bitte beachte, dass JAWS, ein Bildschirmleseprogramm für Microsoft Windows, Anmeldeformulare auf deiner Website, die in Klaviyo erstellt wurden, möglicherweise nicht erkennt. Damit Website-Besucher, die JAWS verwenden, trotzdem mit dem Anmeldeformular auf deiner Website interagieren können, empfehlen wir, einen zusätzlichen Codeschnipsel in deine Website einzufügen, der sie für JAWS zugänglicher macht.
Kopiere das folgende Code-Fragment und füge es in die Hauptthemen-Datei deiner Website ein, damit JAWS dein Klaviyo Anmeldeformular erkennt und liest:
Nächste SchritteNächste Schritte
Es ist wichtig, dass du die WCAG-Standards in allen deinen Klaviyo Anmeldeformularen einhältst. Bereits veröffentlichte Anmeldeformulare können noch Probleme mit der Barrierefreiheit enthalten, die du beheben kannst. Beachte jedoch, dass Klaviyo nicht automatisch alle nicht WCAG-konformen Probleme behebt.
Navigiere zur Registerkarte Formularwarnungen im Editor für jedes deiner bestehenden Formulare, um alle Probleme mit der Barrierefreiheit zu beheben und die WCAG-Konformität deiner Website zu gewährleisten.
Zusätzliche Ressourcen