Formularprüfung: Ein roter Rand erklärt noch keinen Fehler

Zwei Prüfungen mit verschiedenen Aufgaben

HTML kann mit passenden Eingabetypen und Attributen viele einfache Fehler erkennen. Dazu gehören Pflichtfelder oder bestimmte Formatvorgaben. Die Constraint Validation API erlaubt ergänzende Regeln. MDN weist ausdrücklich darauf hin, dass solche Browserprüfungen die serverseitige Validierung nicht ersetzen: Anfragen können auch außerhalb des vorgesehenen Formularwegs gesendet werden.

Das W3C empfiehlt verständliche, zugeordnete Beschriftungen für Formularfelder. Beides gehört zusammen: Menschen müssen wissen, was sie eingeben sollen, und das System muss prüfen, ob die Eingabe für den konkreten Vorgang gültig ist. Der Ratgeber behandelt diese Grundlagen am Beispiel einer freiwilligen Kursanmeldung.

Eine Anforderung zuerst in Alltagssprache schreiben

Unsere Beispielanmeldung benötigt einen Namen und eine Kontaktadresse. Eine Nachricht ist freiwillig. Schreibe zunächst genau diese Regeln auf, bevor ein Entwicklungsassistent Felder erzeugt. Vermeide zusätzliche Pflichtangaben, die für die Bearbeitung gar nicht gebraucht werden. Ein korrekt ausgefülltes Formular ist noch keine Bestätigung eines Kursplatzes, solange der zugrunde liegende Prozess dies nicht vorsieht.

Lege anschließend für jeden Fehler eine hilfreiche Reaktion fest. Bei einer fehlenden Kontaktadresse soll die Meldung das betroffene Feld benennen. Bereits eingegebene unkritische Daten sollten erhalten bleiben, damit niemand alles erneut tippen muss. Eine pauschale Meldung „Ungültig“ lässt offen, welche Änderung nötig ist.

Mit vier Fällen prüfen

Erster Fall: Alle Pflichtangaben fehlen. Zweiter Fall: Die Adresse hat offensichtlich kein erwartetes Format. Dritter Fall: Alle erforderlichen Angaben sind vorhanden, die freiwillige Nachricht bleibt leer. Vierter Fall: Der Server ist beim Absenden vorübergehend nicht erreichbar. Notiere für jeden Fall die erwartete sichtbare Reaktion.

Die ersten beiden Fälle prüfen die Rückmeldung zur Eingabe. Der dritte verhindert, dass freiwillige Felder versehentlich erzwungen werden. Der vierte prüft, ob die Seite eine gescheiterte Übertragung ehrlich behandelt. Eine Erfolgsmeldung darf erst erscheinen, wenn die dafür erforderliche serverseitige Verarbeitung tatsächlich bestätigt wurde.

Form und Inhalt getrennt abnehmen

Prüfe die Fehlermeldungen mit Tastatur und auf einer schmalen Ansicht. Kannst du erkennen, welches Feld betroffen ist, ohne dich nur auf Farbe zu verlassen? Bleibt die Beschriftung sichtbar, wenn bereits Text eingegeben wurde? Teste auch die Rückkehr vom Fehler zum korrigierten Formular.

Lass die serverseitigen Regeln in der Betriebsanleitung festhalten und mit harmlosen Testdaten kontrollieren. Ein Browserhinweis verbessert die Bedienung; eine abgesicherte Verarbeitung braucht zusätzlich die eigene Prüfung am empfangenden System. Erst beide Ebenen ergeben einen belastbaren Anmeldeweg.