Forms and inputs use labels, hints and placeholders to show users how to fill in fields correctly.
Their goal is to clarify expectations, prevent errors and make data entry as simple and reliable as possible.
Labels.
Labels clearly name what should be entered. They provide orientation and reduce uncertainty.
Recommendations:
- Be clear. Use precise labels that clearly describe the purpose of the field.
- Explain when needed. If additional information is required for understanding, place it in an info popover.
Examples:
Street and number
House number
Number
Placeholders.
Placeholders provide hints and assist with data entry.
Recommendations:
- Show examples. Use placeholders to show the required format or example values and prevent input errors.
- Not a replacement. Placeholders do not replace a label - they serve only as a supplementary hint.
Examples:
Enter search term
City, station, ...
Date of birth (DD.MM.YYYY)
Search
What are you looking for?
Number
E-Mail, Last Name, First Name, Customer Number, Address, Phone Number ...