Kontaktformulare: So helfen Fehlermeldungen weiter

Per Starke arbeitet am Laptop an einem Tisch im Café, von schräg oben fotografiert

Ein gutes Kontaktformular hält die Anfrage auch bei einem Tippfehler auf Kurs. Es zeigt, welches Feld Aufmerksamkeit braucht, wie sich der Fehler beheben lässt und ob die Nachricht tatsächlich angenommen wurde.

Stell dir vor, jemand beschreibt ein Projekt, ergänzt eine E-Mail-Adresse und klickt auf «Anfrage senden». Jetzt fehlt ein Zeichen in der Adresse. Genau an dieser Stelle muss deine Website weiterführen. Die Person hat ihr Anliegen bereits formuliert; sie sollte mit einer kleinen Korrektur fortfahren können.

Worum es geht

Eine hilfreiche Fehlermeldung beantwortet zwei Fragen: Was ist hier falsch, und was kann ich jetzt tun?

Für ein leeres Pflichtfeld könnte das heissen: «Trage deine E-Mail-Adresse ein, damit wir dir antworten können.» Bei einem erkannten Formatfehler: «Prüfe deine E-Mail-Adresse. Das Format sollte zum Beispiel name@firma.ch sein.» Formuliere passend zur tatsächlichen Prüfung. Ein korrektes Format sagt noch nichts darüber aus, ob das Postfach existiert.

Das W3C beschreibt diese Aufgaben getrennt: Fehler identifizieren und, wenn eine Korrektur bekannt ist, eine passende Hilfestellung geben. Das ist ein konkreter Teil von Barrierefreiheit, der sich direkt im Anfrageweg prüfen lässt.

Warum das wichtig ist

Ein Formular ist der Übergang vom Lesen zum Gespräch. Wenn dabei etwas scheitert, braucht der Interessent Orientierung: Muss er ein Feld korrigieren, später erneut senden oder einen anderen Kontaktweg wählen?

Unterscheide deshalb Eingabefehler und technische Probleme. Eine ungültige E-Mail-Adresse lässt sich im Feld korrigieren. Bei einer Störung des Versanddienstes bringt das Umschreiben der Nachricht nichts. Dort braucht es eine ehrliche Meldung zum Versandstatus und einen erreichbaren Ersatzweg.

Die Conversion-Optimierung deiner Website sollte diesen Abschnitt des Anfragewegs mitprüfen. Dazu gehören die Texte, die technische Verarbeitung und die Möglichkeit, nach einem Fehler weiterzumachen.

Direkt umsetzen

Feld, Ursache und Korrektur verbinden

Platziere den Hinweis beim betroffenen Feld. Beschreibe den Fehler in Text, sodass er auch ohne die rote Umrandung verständlich bleibt. Bei mehreren Fehlern kann zusätzlich eine Übersicht mit Links zu den jeweiligen Feldern helfen. Für die technische Zuordnung kommen etwa aria-describedby und ein passend gesetzter Fehlerzustand infrage. Das W3C-Tutorial zu Formularmeldungen zeigt solche Verbindungen und Wege zum betroffenen Feld.

Eingaben erhalten und zum passenden Zeitpunkt prüfen

Lass die bereits geschriebene Projektbeschreibung bei einer fehlgeschlagenen Übermittlung stehen. Prüfe ausserdem, wann Hinweise erscheinen: Eine halb getippte Adresse sofort als Fehler zu melden, kann die Eingabe unnötig unterbrechen. Teste beispielsweise eine Prüfung beim Verlassen des Feldes und nach dem Absenden. Die passende Lösung hängt vom Formular und seiner Nutzung ab.

Die Eingabevalidierung im Browser unterstützt schnelle Rückmeldungen. Die serverseitige Prüfung bleibt zusätzlich erforderlich.

Den Versandstatus präzise beschreiben

Zeige eine Erfolgsmeldung erst, wenn das System die Annahme bestätigt hat. «Deine Anfrage wurde angenommen» und «Die E-Mail wurde zugestellt» sind unterschiedliche Aussagen. Versprich nur den Status, den du technisch bestätigen kannst. Ist der Ausgang unklar, benenne das und biete einen nächsten Schritt an. Dynamische Rückmeldungen sollten auch für assistive Technik erkennbar sein; dafür erklärt das W3C die Anforderungen an Statusmeldungen.

Den Fehlerweg vor dem Launch durchspielen

  • Sende das Formular mit einem leeren Pflichtfeld und einer fehlerhaften Adresse ab. Wird klar, wo du korrigieren musst?
  • Provoziere im Testsystem einen Versandfehler. Bleibt dein Text erhalten, und ist der nächste Schritt verständlich?
  • Prüfe mit Tastatur und Screenreader, ob die Meldung und das zugehörige Feld erreichbar sind.
  • Wiederhole den Ablauf auf dem Handy. Passen Hinweis, Feld und Button ins Layout?
  • Kontrolliere eine erfolgreiche Testanfrage bis im empfangenden System. Stimmt die Bestätigung mit dem tatsächlichen Status überein?

Kurz gesagt

Plane Fehlermeldungen als Teil des Gesprächseinstiegs. Wer eine Anfrage abschicken will, braucht eine verständliche Korrektur, seine erhaltenen Eingaben und eine verlässliche Auskunft darüber, was mit der Nachricht passiert ist.