Projektformulare mit klaren Feldern und Fehlermeldungen planen
Ein Formularentwurf zeigt Pflichtangaben, verständliche Feldtexte und konkrete Fehlerhinweise. Eingaben bleiben beim Korrigieren erhalten.
Ein langes Projektformular lässt sich gezielter überarbeiten, wenn der nächste Arbeitsschritt feststeht. Klären Sie zuerst, welche Angaben das Team dafür tatsächlich braucht. Danach können Beschriftung, Prüfung und Rückmeldung zusammen geplant werden.
Vom nächsten Arbeitsschritt ausgehen
Im folgenden konstruierten Portal soll das Team eine erste Softwareanfrage fachlich zuordnen und per E-Mail Rückfragen stellen. Dafür sind Projekttitel, Projektziel und E-Mail erforderlich. Die Telefonnummer bleibt freiwillig. Rechnungsadresse und interne Kundennummer werden für diese erste Anfrage nicht als Pflichtangaben verlangt. Das ist eine Entscheidung für diesen Beispielablauf.
W3C WAI empfiehlt, nur Angaben abzufragen, die für den jeweiligen Vorgang nötig sind. Jede verbleibende Frage braucht einen nachvollziehbaren Zweck.
Feldtexte dauerhaft sichtbar machen
Beschriftungen bleiben während der Eingabe sichtbar und werden technisch mit dem jeweiligen Feld verbunden. Ein Platzhalter im leeren Feld ersetzt diese Beschriftung nicht: Er verschwindet beim Schreiben. Hinweise zu Zweck und Freiwilligkeit stehen deshalb am Feld.
Feld | Bisher | Geplant |
|---|---|---|
| Projekt | Projekttitel (erforderlich) – Wie nennt Ihr Team das Vorhaben? |
| Beschreibung | Projektziel (erforderlich) – Welche Aufgabe soll die Software erleichtern? |
| Kontakt | E-Mail für Rückfragen (erforderlich). |
| Telefon * | Telefonnummer (freiwillig). |
Das Wort „freiwillig“ muss zur Prüfung beim Absenden passen. Ein leeres Telefonfeld darf in diesem Ablauf keinen Fehler auslösen.
Fehlermeldung an den konkreten Zustand binden
Für dieses Formular ist die Prüfung beim Absenden vorgesehen. Fehlende Angaben, unvollständige Eingaben und eine unbestätigte Übertragung erhalten unterschiedliche Rückmeldungen.
Situation | Geplanter Hinweis |
|---|---|
E-Mail fehlt | Geben Sie eine E-Mail-Adresse für Rückfragen ein. |
E-Mail enthält | Die E-Mail-Adresse ist unvollständig. Beispiel: |
Übertragung unbestätigt | Der Eingang Ihrer Anfrage ist noch nicht bestätigt. Ihre Eingaben bleiben hier erhalten. |
Eine Formatprüfung bestätigt noch nicht, dass das Postfach erreichbar ist. Ein Übertragungsproblem wird nicht als falsch ausgefülltes E-Mail-Feld dargestellt.
Korrektur ohne Datenverlust vorsehen
Der Entwurf sieht nach einem Eingabefehler eine Fehlerübersicht vor, die den Tastaturfokus erhält und zum betroffenen Feld verlinkt. Am Feld steht derselbe verständliche Fehlertext; er muss auch mit Hilfsmitteln zugeordnet werden können. Bereits eingegebene Werte bleiben erhalten, einschließlich der zu korrigierenden Angabe.
Eine Erfolgsmeldung folgt erst auf den bestätigten Eingang beim Server. Für erneutes Absenden bei unklarem Ergebnis muss der Ablauf klären, wie ein möglicherweise bereits erfolgter Eingang erkannt wird.
Mit einer vollständigen Aufgabe prüfen
Lassen Sie die Beispielanfrage ohne Telefonnummer ausfüllen. Prüfen Sie zusätzlich den Fehlerpfad mit einer unvollständigen E-Mail: Lässt sich der Hinweis finden, die Adresse korrigieren und die Anfrage abschließen, während das Projektziel erhalten bleibt? Beziehen Sie Tastatur, kleine Bildschirmbreite und die verwendeten Hilfsmittel ein. Notieren Sie, wo eine Person Hilfe braucht und ob der Eingang am Ende tatsächlich bestätigt wird.
Quellen
Geschrieben von
- Julia HoffmannRedakteurin für Design und UXJulia Hoffmann ist bei ASES für die redaktionellen Inhalte zu Design und User Experience zuständig. Ihre Beiträge behandeln die Nutzung von Websites und Anwendungen, die Gestaltung von Benutzeroberflächen und digitale Barrierefreiheit.
Weiterlesen
Alle Beiträge
Design & UX mit ASES
Nutzererlebnis, Oberflächen und Markenauftritt