The rule
Use empty states to show a feature's potential and placeholders to provide specific examples of expected input.
Why it matters
Empty states often represent a user's first impression; leaving them blank is a "wasted opportunity" that makes a product feel static. Placeholders reduce cognitive load by hinting at the type of information needed, but they strain short-term memory if they disappear before the task is finished. Effective empty states turn a "dead end" into an "open door" by guiding the next action.
How to apply it
- Explain why the state is empty and tell the user what should be there.
- Always provide a call to action or instructions on how to fill the empty state.
- Use placeholders only for short examples or leading phrases, never for critical instructions.
- Treat "Your" as customized items and "My" for personalized user-saved items.
Example
Weak
(Placeholder with instruction) "Email / Enter your email"
Stronger
(Placeholder with example)
"Email / kevin@dmi.com"
Tensions and exceptions
Placeholders that look like labels are redundant and crowded. However, in very specific search boxes (like on Twitter or Fiverr), a question as a placeholder can effectively dictate the style of answer you want from the user.