Ein Anmelde- oder Bezahlvorgang, der aufgrund eines Barrierefreiheitsfehlers fehlschlägt, ist nicht nur ein abstraktes Problem – es handelt sich um einen Kunden, der einen Kauf nicht abgeschlossen hat, und manchmal um einen Kunden, der nicht wiederkommt. Dieser Artikel konzentriert sich auf die kritischsten Punkte bei Formularen, Anmelde- und Checkout-Abläufen – und wenn Sie sich auch für PDF-Formulare interessieren, lesen Sie unseren Leitfaden zubarrierefreie PDF-Formulare.
Kurz gesagt – was dieser Artikel behandelt
Echtzeit-Fehlermeldungen
Der häufigste Fehler: eine Fehlermeldung, die visuell erscheint (kleiner roter Text neben dem Feld), aber nicht einem Bildschirmleseprogramm angezeigt wird. Ein blinder Benutzer füllt das Formular aus, klickt auf „Senden“ und versteht nicht, warum nichts passiert – weil er überhaupt nichts von dem Fehler hört. Die Lösung: Verwenden Sie „aria-live“, um Fehler automatisch anzukündigen, und verknüpfen Sie jeden Fehler mit „aria-describedby“ direkt mit dem entsprechenden Feld, sodass der Bildschirmleser den Fehler vorliest, sobald der Benutzer dieses Feld erreicht.
Klare, dauerhafte Feldbeschriftungen
Platzhaltertext (der graue Text, der verschwindet, sobald Sie mit der Eingabe beginnen) ist kein Ersatz für eine echte Feldbezeichnung – sobald der Benutzer mit der Eingabe beginnt, verliert er den Kontext dessen, wonach das Feld überhaupt fragt. Jedes Formularfeld benötigt ein echtes „ “, das während des gesamten Ausfüllvorgangs sichtbar (oder zumindest für einen Bildschirmleser zugänglich) bleibt und nicht nur als Hinweis verschwindet.
💡 Praxistipp
Erforderliche Felder müssen doppelt markiert werden: visuell (ein Sternchen oder das Wort „Erforderlich“) und auch im Code („aria-required="true"`), sodass selbst ein Benutzer, der das Sternchen nicht sehen kann, weiß, dass das Feld erforderlich ist, bevor ein Übermittlungsfehler auftritt.
Mehrstufige Prozesse
Mehrstufige Anmelde- oder Checkout-Abläufe (persönliche Daten ▸ Versand ▸ Zahlung ▸ Bestätigung) müssen einem Screenreader klar mitteilen, in welchem Schritt sich der Benutzer von wie vielen Schritten insgesamt befindet, und ihn ankündigen, wenn der Benutzer zum nächsten Schritt übergeht – damit ein Benutzer, der die visuelle Fortschrittsanzeige nicht sehen kann, nicht mittendrin die Orientierung verliert.
Eine barrierefreie Bestellbestätigung
Nach Abschluss eines Kaufs oder einer Anmeldung muss die Bestätigungsnachricht selbst zugänglich sein – sie muss einem Screenreader deutlich angezeigt werden (nicht nur eine stille visuelle Änderung auf der Seite) und alle wichtigen Informationen (Bestellnummer, Menge, Lieferdatum) als echten Text und nicht als Bild enthalten.
Verfügen Sie über Nutzungsbedingungen oder Auftragsbestätigungen, die als PDFs gesendet werden?
Unser Tool überprüft auch die Dokumente, die den Kauf- und Anmeldevorgängen beiliegen – Nutzungsbedingungen, Quittungen, Bestätigungen.
Scannen Sie Ihre Website kostenlos ←Nach dem Scannen können Sie die gefundenen Dokumente auch direkt und kostenlos über zugänglich machenAccessiDoc.