Placeholder Text: Think Outside the Box

The verdict is in. Placeholder text is harmful in search boxes.

Searchers are on your site to complete a task. Having placeholder text inside a search box distracts from the task and it reduces the usability and accessibility of the search box. Placeholders look simple, but are in fact very tricky to use.

When people are trying to accomplish a goal, their focus is not on the form an organization requires them to use. It’s on achieving their goal.

Don’t Put Labels Inside Text Boxes (Unless You’re Luke W), UX Matters

What Is Placeholder Text?

Placeholder text is the label for possible content in a text box. It can normally be found when there are prompts to fill out a form. It’s the hint that tells you ‘Last name’ or the format with which to enter your birthdate or phone number. Placeholder text typically exists as a hint to fill in actual text.

Put Labels and Placeholders Outside the Box

These hints can be essential to help identify what information to input, but they shouldn’t be be put inside the text box. They should be placed outside the box.

If you include hint text inside your form’s text boxes, many users—quite likely, the majority—will interpret the hint text as a default.

Don’t Put Hints Inside Text Boxes in Web Forms, UX Matters

Inside the Box Is Hard to Use

Placeholder text inside the search box

Outside the Box Is Better

368-x-62-Placeholder-search-outside-box

Placeholder text inside the search box can hinder more than help. Some sites use placeholder text within a search box, and inadvertently searchers don’t remove it. This leads to searches with a query consisting entirely of placeholder text, or a query that is an amalgamation of the two.

For example, some sites will have “What are you looking for?” or “Search…” within the search box. Though such hints can be helpful, studies have shown that text in a field makes the search box—and all other types of Web forms and content boxes—less noticeable.

Placeholder text within a form field makes it difficult for people to remember what information belongs in a field, and to check for and fix errors. It also poses additional burdens for users with visual and cognitive impairments.

Placeholders in Form Fields Are Harmful, Nielsen Norman Group

Conclusion

In summary, avoid inline placeholder text in search boxes. The best solution is to have clear, visible labels and placeholders that are placed outside the box.

Tags:

GitHub LogoEdit
Top