Ein Kontaktformular wirkt auf den ersten Blick oft harmlos. Ein paar Felder, ein Absenden-Button, vielleicht noch eine Checkbox für Datenschutz – fertig. Für viele Webseitenbetreiber gehört so ein Formular einfach dazu. Schließlich soll es Besuchern möglichst leicht gemacht werden, eine Anfrage zu senden.
Doch gerade Kontaktformulare sind ein Bereich, in dem Barrierefreiheit schnell schiefgehen kann. Besonders für Menschen, die mit einem Screenreader arbeiten, können schlecht umgesetzte Formulare richtig mühsam werden. Manchmal ist nicht klar, welches Feld gerade ausgefüllt werden soll. Manchmal fehlen Fehlermeldungen. Manchmal lässt sich das Formular zwar sehen, aber nicht sinnvoll bedienen.
Das Problem: Wenn das Kontaktformular nicht funktioniert, ist oft der wichtigste Weg zur Kontaktaufnahme blockiert.
Warum Kontaktformulare so wichtig sind
Ein Kontaktformular ist nicht irgendein Element auf der Webseite. Es ist häufig der direkte Weg zu einer Anfrage, einem Auftrag, einer Terminbuchung oder einer Beratung. Gerade bei Dienstleistern, Handwerkern, Praxen, Agenturen oder Online-Shops kann das Formular entscheidend sein.
Wenn ein Besucher die Seite liest, Vertrauen gewinnt und dann eine Anfrage senden möchte, sollte dieser letzte Schritt so einfach wie möglich sein. Genau an dieser Stelle darf keine unnötige Hürde entstehen.
Für Menschen, die einen Screenreader nutzen, ist ein Formular aber nur dann gut bedienbar, wenn es sauber aufgebaut und verständlich beschriftet ist.
Was macht ein Screenreader bei Formularen?
Ein Screenreader liest nicht einfach nur den sichtbaren Text einer Webseite vor. Er gibt auch Informationen über Struktur und Bedienelemente aus. Bei Formularen ist das besonders wichtig.
Ein Nutzer muss wissen:
Welches Feld ist gerade aktiv?
Was soll dort eingetragen werden?
Ist das Feld verpflichtend?
Gibt es eine Fehlermeldung?
Wurde das Formular erfolgreich gesendet?
Wenn diese Informationen technisch nicht richtig hinterlegt sind, kann der Screenreader sie nicht zuverlässig ausgeben. Dann wird aus einem einfachen Kontaktformular schnell ein Rätsel.
Häufiges Problem: Felder ohne klare Beschriftung
Einer der häufigsten Fehler sind Formularfelder ohne richtige Labels. Sichtbar steht vielleicht „Name“ über dem Feld oder als Platzhalter im Feld. Technisch ist das Feld aber nicht korrekt mit dieser Beschriftung verbunden.
Für sehende Nutzer sieht alles normal aus. Der Screenreader erkennt aber eventuell nur ein „Eingabefeld“ – ohne zu sagen, ob hier der Name, die E-Mail-Adresse oder die Telefonnummer eingetragen werden soll.
Das ist ungefähr so, als würde man jemandem mehrere leere Kästchen geben und sagen: „Füll das mal aus“, aber ohne zu erklären, was wohin gehört.
Ein gutes Formular verbindet jedes Eingabefeld eindeutig mit einer Beschriftung. Dann kann der Screenreader zum Beispiel sagen: „Name, Eingabefeld“ oder „E-Mail-Adresse, Pflichtfeld“.
Platzhalter ersetzen keine Labels
Viele moderne Formulare nutzen Platzhaltertexte. Im Feld steht dann hellgrau „Ihre E-Mail-Adresse“ oder „Nachricht eingeben“. Sobald man etwas eintippt, verschwindet dieser Text.
Das sieht schlicht aus, ist aber nicht immer benutzerfreundlich. Denn wenn der Platzhalter verschwindet, ist nicht mehr sichtbar, was das Feld eigentlich bedeutet. Wer das Formular später noch einmal überprüft, muss sich erinnern, was dort gefragt war.
Für Screenreader ist es ebenfalls problematisch, wenn ausschließlich Platzhalter verwendet werden. Ein Platzhalter kann zwar vorgelesen werden, ersetzt aber keine saubere Beschriftung.
Besser ist eine sichtbare, dauerhaft erkennbare Beschriftung über oder neben dem Feld. Der Platzhalter kann zusätzlich helfen, sollte aber nicht die einzige Erklärung sein.
Pflichtfelder müssen verständlich erkennbar sein
Viele Formulare markieren Pflichtfelder mit einem Sternchen. Das ist weit verbreitet, aber nicht immer ausreichend. Ein Sternchen allein erklärt nicht automatisch, was es bedeutet. Für manche Nutzer ist es unklar, besonders wenn die Erklärung dazu fehlt.
Noch schwieriger wird es, wenn das Sternchen nicht vom Screenreader sinnvoll vorgelesen wird oder nur optisch vorhanden ist.
Besser ist eine klare Kennzeichnung, zum Beispiel:
„E-Mail-Adresse, Pflichtfeld“
So versteht jeder sofort, dass dieses Feld ausgefüllt werden muss. Das hilft nicht nur Screenreader-Nutzern, sondern auch allen anderen Besuchern.
Fehlermeldungen sind oft schlecht umgesetzt
Ein besonders kritischer Punkt sind Fehlermeldungen. Fast jeder kennt es: Man sendet ein Formular ab und irgendetwas fehlt. Dann erscheint irgendwo ein roter Hinweis.
Für sehende Nutzer ist das meist erkennbar. Für Screenreader-Nutzer kann es aber passieren, dass die Fehlermeldung gar nicht automatisch wahrgenommen wird. Der Fokus bleibt vielleicht auf dem Button. Der Nutzer weiß nur: Das Formular wurde nicht abgeschickt. Aber warum?
Noch schlechter ist es, wenn Fehlermeldungen nur allgemein formuliert sind:
„Bitte überprüfen Sie Ihre Eingaben.“
Das hilft wenig. Besser wäre:
„Bitte geben Sie eine gültige E-Mail-Adresse ein.“
Oder:
„Das Feld Nachricht darf nicht leer bleiben.“
Eine gute Fehlermeldung sagt klar, welches Feld betroffen ist und was korrigiert werden muss.
Farbe allein reicht bei Fehlern nicht aus
Viele Formulare zeigen Fehler nur durch rote Rahmen an. Das ist für Screenreader natürlich nicht ausreichend. Ein Screenreader sieht keine Farbe. Aber auch für Menschen mit Farbsehschwäche kann das schwierig sein.
Ein roter Rahmen kann hilfreich sein, sollte aber nie die einzige Information sein. Zusätzlich braucht es einen verständlichen Text. Am besten direkt beim betroffenen Feld.
Ein gutes Beispiel wäre:
„E-Mail-Adresse: Bitte geben Sie eine gültige E-Mail-Adresse ein.“
So ist die Information klar, unabhängig davon, ob jemand die Farbe erkennt oder nicht.
Die Reihenfolge der Felder muss logisch sein
Screenreader-Nutzer bewegen sich häufig Schritt für Schritt durch ein Formular. Deshalb ist die Reihenfolge wichtig. Sie sollte logisch dem sichtbaren Aufbau folgen.
Problematisch wird es, wenn die technische Reihenfolge nicht zur sichtbaren Reihenfolge passt. Dann springt der Screenreader zum Beispiel vom Namen direkt zum Absenden-Button, danach zur Telefonnummer und dann erst zur Nachricht. Das verwirrt.
Auch bei mehrspaltigen Formularen kann das passieren. Was auf dem Bildschirm ordentlich aussieht, kann in der Bedienung durcheinander geraten, wenn die Struktur nicht sauber umgesetzt ist.
Ein gutes Formular führt Nutzer in einer klaren Reihenfolge durch alle Felder.
Buttons brauchen eindeutige Beschriftungen
Auch der Absenden-Button ist wichtig. Ein Button mit „Senden“ ist meist verständlich. Noch besser kann ein konkreter Text sein, zum Beispiel:
„Anfrage senden“
„Nachricht abschicken“
„Termin anfragen“
Unklare Buttons wie „Los“, „OK“ oder nur ein Pfeil-Icon sind weniger hilfreich. Der Nutzer sollte immer wissen, was beim Aktivieren des Buttons passiert.
Gerade bei Kontaktformularen sollte der Button keine Unsicherheit erzeugen. Niemand möchte sich fragen, ob jetzt wirklich eine Nachricht verschickt wird oder nur der nächste Schritt kommt.
Datenschutz-Checkboxen können zur Hürde werden
Viele Kontaktformulare enthalten eine Checkbox zur Datenschutzerklärung. Auch diese muss barrierefrei bedienbar sein. Das bedeutet: Die Checkbox braucht eine klare Beschriftung und muss mit der Tastatur erreichbar sein.
Problematisch sind Checkboxen, bei denen nur ein kleiner leerer Kasten vorhanden ist und der Text daneben technisch nicht verbunden wurde. Dann erkennt der Screenreader vielleicht nur „Kontrollkästchen, nicht aktiviert“, aber nicht, worum es geht.
Auch Links zur Datenschutzerklärung sollten verständlich benannt sein. Ein Link mit „hier“ ist weniger hilfreich als ein klarer Linktext wie „Datenschutzerklärung öffnen“.
Erfolgsmeldungen dürfen nicht fehlen
Nicht nur Fehler sind wichtig, sondern auch Erfolgsmeldungen. Nach dem Absenden sollte klar sein, ob die Nachricht angekommen ist.
Viele Formulare zeigen eine kurze Meldung wie:
„Vielen Dank, Ihre Nachricht wurde gesendet.“
Das ist gut, aber nur dann, wenn diese Meldung auch für Screenreader wahrnehmbar ist. Wenn die Meldung nur optisch erscheint, der Fokus aber irgendwo anders bleibt, kann der Nutzer unsicher sein.
Wurde die Anfrage wirklich gesendet? Muss noch etwas gemacht werden? Ist ein Fehler passiert?
Eine klare, gut erkennbare Erfolgsmeldung nimmt diese Unsicherheit raus.
Captchas sind oft ein großes Problem
Viele Webseiten nutzen Captchas, um Spam zu verhindern. Für die Barrierefreiheit können Captchas aber schwierig sein. Besonders Bilderrätsel, schwer lesbare Zeichen oder Aufgaben wie „Wähle alle Ampeln aus“ sind für blinde Menschen kaum nutzbar.
Auch Audio-Captchas sind nicht immer eine gute Lösung, weil sie schwer verständlich sein können oder Menschen mit Hörbeeinträchtigung ausschließen.
Spam-Schutz ist wichtig, aber er sollte nicht dafür sorgen, dass echte Besucher das Formular nicht nutzen können. Es gibt unauffälligere Methoden, die im Hintergrund arbeiten und den Nutzer weniger belasten.
Mobile Nutzung macht Probleme oft noch größer
Viele Menschen nutzen Webseiten auf dem Smartphone. Dort werden Formularprobleme oft noch deutlicher. Kleine Felder, zu enge Abstände, schlecht erkennbare Fehlermeldungen oder schwer antippbare Checkboxen machen die Bedienung anstrengend.
Auch Screenreader werden auf mobilen Geräten genutzt. Deshalb sollte ein Kontaktformular nicht nur am Desktop getestet werden. Gerade auf dem Smartphone zeigt sich oft, ob ein Formular wirklich verständlich aufgebaut ist.
Wie man Kontaktformulare besser macht
Ein gutes Kontaktformular muss nicht kompliziert sein. Wichtig sind saubere Grundlagen.
Jedes Feld braucht eine klare Beschriftung. Pflichtfelder sollten eindeutig erkennbar sein. Fehlermeldungen müssen verständlich erklären, was korrigiert werden soll. Die Bedienreihenfolge sollte logisch sein. Buttons brauchen klare Texte. Checkboxen müssen korrekt beschriftet sein. Und nach dem Absenden sollte eine eindeutige Rückmeldung erscheinen.
Sehr hilfreich ist ein einfacher Selbsttest: Das Formular einmal nur mit der Tastatur bedienen. Danach überlegen, ob man jederzeit versteht, wo man ist und was als Nächstes passiert. Noch besser ist ein Test mit einem Screenreader oder durch jemanden, der regelmäßig mit Hilfstechnologien arbeitet.
Fazit: Kontaktformulare müssen für alle funktionieren
Ein Kontaktformular soll den Kontakt erleichtern. Wenn es für Screenreader-Nutzer schwer oder gar nicht bedienbar ist, passiert genau das Gegenteil. Menschen werden ausgeschlossen, Anfragen gehen verloren und die Webseite wirkt weniger professionell.
Viele Probleme entstehen nicht aus Absicht, sondern aus kleinen technischen und gestalterischen Fehlern. Fehlende Labels, unklare Fehlermeldungen, schlechte Reihenfolgen oder nicht beschriftete Checkboxen reichen schon aus, um ein Formular unnötig kompliziert zu machen.
Die gute Nachricht: Viele dieser Fehler lassen sich beheben, ohne die komplette Webseite neu zu bauen. Wer seine Kontaktformulare klar beschriftet, logisch aufbaut und verständlich bedienbar macht, verbessert die Webseite für alle Besucher – nicht nur für Menschen mit Screenreader.
Dieser Artikel gibt eine allgemeine Orientierung und ersetzt keine Rechtsberatung.