Today Nielsen Norman Group released an article confirming my fears for placeholders. Katie Sherwin addresses seven issues as to why placeholders are not optimal for usability.
- Replaced text reeks havoc on users’ short-term memory
- Reviewing completed forms (without traditional labels) becomes impossible
- With no labels, errors become increasing hard to fix–especially with fields with similar content
- Keyboard interactions can become problematic
- Fields with content in them are less noticeable
- Users can consider placeholders as auto-filled data
- Poor implementations can require additional work for users
Even if you use placeholders in conjunction with normal form labels, as I had in the past, you can’t get over the fact that during testing users’ eyes were drawn to empty fields.
“At the minimum, users will spend more time locating a non-empty field–a nusiance. At the worst, they will overlook the field completely–a potential business-killing disaster.”
With usability at the forefront of my mind when developing web forms, adding cognitive load and additional time to users’ tasks is unacceptable. Adding placeholders in order to save room or make my design cleaner at the cost of ruining the user experience is unacceptable.
Possible Solutions
There’s a new design pattern that has been gaining some traction within the design community that has been lovingly titled Float Labels. In this pattern, the placeholder is both visually and semantically the label for the form. This provides clear context for the user when filling out the form, but produces additional issues.
- Small labels may cause trouble for users with visual impairments
- Poor implementation may break the semantic label use rendering this approach useless for accessibility
- Users may still mistake placeholder data for auto-filled data
- Users are still drawn to empty fields
- Doesn’t solve the issue of providing additional information for a field as you are now using the placeholder just as a label, not an example or additional instructions
As always, it is necessary to consider each implementation for every project you do. There may be a time where good implementation of the float label design pattern will benefit you more than hurt you. Here are some resources if you’re interested in learning more about this new pattern that attempts to solve this usability issue.