UI DESIGN LAB
  • Home
  • Community
  • Library
  • Knowledge
  • Docs
ZHLogin
Back to knowledge
Typography Color Accessibility

Placeholder Is Not a Label

Placeholder Is Not a Label turns a frequent interface judgment into an executable constraint before generation.

formsplaceholderreadability

Design Principle

Placeholders are useful for examples, not as the only instruction or critical guidance.

Principle Placeholders are useful for examples, not as the only instruction or critical guidance.

Design action Use label for field name, help text for rules, and placeholder only for short examples; keep rules visible when errors appear.

Examples Positive example: Fields need format examples, search hints, or short prompts but have high error risk. Counterexample: Placeholder contains the full rule.

Apply when Fields need format examples, search hints, or short prompts but have high error risk. Users need to judge state, scope, risk, or next action quickly.

Source notes Source note: Synthesized from W3C WCAG 2.2, Apple Accessibility, IBM Carbon Accessibility, and accessibility practices in major design systems.

Agent Directive

Use label for field name, help text for rules, and placeholder only for short examples; keep rules visible when errors appear.

Apply When

  • Fields need format examples, search hints, or short prompts but have high error risk.
  • Users need to judge state, scope, risk, or next action quickly.

Avoid

  • Placeholder contains the full rule.
  • Irrelevant structure, copy, or decoration is added only to make the UI feel richer.

Knowledge Metadata

Category
Typography Color Accessibility
Quality
84%
Version
v1
Published
6/6/2026