Design Principles
Label Placement & Placeholder Misuse
Labels must remain permanently visible and clearly associated with their fields — placeholder text disappears the moment the user starts typing, forcing reliance on memory precisely when cognitive load is highest.
Where it comes from
It's grounded in Nielsen Norman Group's form-usability research, which catalogues the specific ways placeholder text — the grey hint inside a field — harms usability when it's used as a substitute for a visible label.
Why it matters for your website
NN/G's usability research identifies seven distinct ways placeholder text harms form usability: it disappears when the user types, forcing reliance on memory; it makes checking and fixing errors harder; it strains low-vision users who struggle with the deliberately lower-contrast placeholder colour; it causes multitasking users who return to a form to lose their place; it confuses auto-completed fields; it reduces accessibility for screen reader users; and it creates ambiguity between placeholder text and pre-filled values. The core principle is simple: a label is a permanent navigation aid, not a prompt that sacrifices itself. Wroblewski's research on label placement adds that top-aligned labels — above rather than beside the field — produce the fastest scan-and-complete times because they allow uninterrupted downward visual flow. Placeholder text can usefully supplement a visible label; it should never replace one.
The core problem is that placeholder text disappears the moment the user starts typing. A label is meant to be a permanent navigation aid; a placeholder is a prompt that sacrifices itself exactly when cognitive load is highest — leaving the user to remember what the field was for.
NN/G catalogues seven distinct harms: the vanishing text forces reliance on memory, makes error-checking harder, strains low-vision users with deliberately low-contrast grey, makes returning multitaskers lose their place, confuses auto-completed fields, reduces screen-reader accessibility, and blurs the line between placeholder and pre-filled value. A placeholder can usefully supplement a visible label — it should never replace one.
Wrong vs right
Form fields labelled only by placeholder text, which vanishes on typing and leaves users guessing what each field was for.
A permanent visible label for every field, with placeholder text used only as an optional supplement.
Low-contrast grey placeholder text used as the only label, straining low-vision users.
A clear, permanent, sufficiently-contrasted label, accessible to all users.
Bottom- or side-placed labels that slow the scan-and-complete flow.
Top-aligned labels above each field, which research shows produce the fastest completion.
Understanding Label Placement & Placeholder Misuse
Label placement and placeholder misuse is about a specific, common mistake: using placeholder text — the grey hint inside a field — as a substitute for a visible label. Nielsen Norman Group's form-usability research catalogues seven distinct ways this harms usability, all stemming from one fact: placeholder text disappears the moment the user starts typing.
The seven harms are concrete. The vanishing text forces reliance on memory just as cognitive load peaks; it makes checking and fixing errors harder; its deliberately low-contrast grey strains low-vision users; it makes multitasking users who return lose their place; it confuses auto-completed fields; it reduces accessibility for screen-reader users; and it creates ambiguity between a placeholder and a pre-filled value. A label, by contrast, is a permanent navigation aid that stays put.
Placement matters too. Luke Wroblewski's research found top-aligned labels — above the field rather than beside it — produce the fastest scan-and-complete times, because they allow an uninterrupted downward visual flow. The rule is simple: a placeholder can usefully supplement a visible label, but it must never replace one. It connects to form field reduction, feedback, and accessibility.
How Kweri checks it
This is one of the more directly checkable form principles. Kweri can detect fields that rely on placeholder text without a persistent visible label, and can assess label placement (top-aligned versus beside or inside the field). It reliably flags placeholder-as-label patterns and the accessibility and memory problems they cause. What benefits from human and assistive-tech testing is the full accessibility picture — how the form behaves with a screen reader, for instance. So Kweri surfaces placeholder misuse and label-placement issues concretely, and points to assistive-technology testing for the complete accessibility check.
FAQ
Why shouldn't placeholder text replace labels?
Because placeholder text disappears the moment the user starts typing, forcing them to remember what the field was for just as cognitive load peaks. A label is a permanent navigation aid; a placeholder is a prompt that sacrifices itself. Use placeholders only to supplement labels.
What's wrong with using placeholders as labels?
Nielsen Norman Group identifies seven harms: it forces reliance on memory, makes error-checking harder, strains low-vision users with low-contrast grey, makes returning users lose their place, confuses auto-filled fields, reduces screen-reader accessibility, and blurs placeholder versus pre-filled values.
Where should form labels be placed?
Top-aligned — above the field rather than beside or inside it. Luke Wroblewski's research found top-aligned labels produce the fastest scan-and-complete times, because they allow an uninterrupted downward visual flow through the form.
Can I use placeholder text at all?
Yes — as a supplement, not a replacement. A placeholder can usefully add an example or hint alongside a permanent visible label. The rule is that it must never be the only thing labelling a field.
How does placeholder misuse affect accessibility?
It harms it in several ways: low-contrast placeholder text strains low-vision users, it reduces accessibility for screen-reader users, and the vanishing text disadvantages anyone who needs to re-check the field. Permanent, properly-associated labels are far more accessible.
Related principles
Every unnecessary form field adds cognitive cost and reduces completion — ask only for what is needed to complete the current step, and defer everything else.
Errors should be flagged as users complete each field, not after the entire form is submitted — post-submit error discovery forces users to stop, hunt for problems, and often repeat work they've already done.
The brain's temporary active store holds only 4–7 chunks for 20–30 seconds — information users have to remember across steps will be forgotten unless the system carries it for them.
Web accessibility is organised around four principles: content must be Perceivable, Operable, Understandable, and Robust — failure on any one principle makes content inaccessible to some users.
Attribution & sources
Identified by Nielsen Norman Group (with Luke Wroblewski on placement). Catalogued from Nielsen Norman Group — Form Design: Placeholders.
Based on NN/G's placeholder research and Wroblewski's work on label placement; the linked article is the reference used here.
See Label Placement & Placeholder Misuse on your own site
Run a free Kweri audit — a plain-English review of your site’s speed, accessibility, SEO and design, ranked by what to fix first. No login, no jargon.
Run a free audit →