Making fields understood.
WHERE TO PUT LABELS
Above the field, usually.
WHY
It works at any width, remains visible while typing, and suits narrow screens.
WHAT NOT TO USE AS A LABEL
Placeholder text inside the field.
WHY NOT
It disappears when typing begins It is frequently too low contrast to read It cannot be seen when reviewing what was entered Assistive technology handles it inconsistently
WHAT PLACEHOLDERS ARE FOR
An example of the format, in addition to a label.
WHAT TO LABEL WITH
Plain words the person understands.
WHAT TO INDICATE
Which fields are optional.
WHY THAT WAY ROUND
If most are required, marking the few optional ones is less cluttered.
WHAT TO ADD WHERE NEEDED
A short hint beneath, explaining format or purpose.
WHAT TO AVOID
Hints only visible on hover Abbreviations Labels that do not match what is validated
WHAT TO ENSURE
That tapping the label focuses the field.
