This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung →
Forms and error messages: detect, explain, avoid
Every input field needs a label, every error must be named in text, and where possible, a correction suggestion belongs with it. For legally or financially binding entries, you must be able to review or reverse them before submitting.
- The most common mistake is a field with no linked label — often because the placeholder text serves as the label. That disappears while typing: anyone who gets distracted no longer knows what belongs in the field.
- Error messages shown in red alone are a double violation: colour as the only information, and no text saying what's wrong. What's needed is a message that names the field and describes the problem.
- Since WCAG 2.2, accessible authentication has been added: a login process may not require a memory test — image puzzles or copying from another app with no alternative are violations.
FAQ
Is placeholder text enough as a label?
No. It disappears while typing, often has too little contrast, and isn't recognised as a label by all assistive technology. What's needed is a linked label that stays visible.
What must an error message look like?
It must state in text which field is affected and what's missing. Where the system knows or can narrow down the correct value, a suggestion belongs with it.
What does "accessible authentication" require?
That authentication is possible without a memory or transcription task. Pasting from the clipboard must stay allowed, and puzzle tasks need an alternative.