Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I am familiar with research on label placement to the left or above. I tend to go with right justified with the label to the left of the field for my form designs.

However, inline placeholder text is trending and it does further reduce page clutter. Is there any research out there supporting its use? Has anyone conducted usability studies on their forms that they can share?

enter image description here

Research Links:

http://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php

http://www.lukew.com/resources/articles/web_forms.html

share|improve this question
4  
Apple recently redesigned their checkout flow to use in-line labels for the form fields... however, as Luke Wroblewski points out in the linked article, this only works well because they're doing it for highly structured data (e.g. address), and they've designed the forms to match the data structure. –  Daniel Newman Jul 21 '11 at 17:27

2 Answers 2

up vote 21 down vote accepted

The major problem with inline placeholder text is after filling out a number of fields, it is difficult or sometimes impossible to determine what the original purpose of that field was.

Say for example you are filling out a form and decide to change your input, so you clear it out and then somehow you get sidetracked by a phone call of something else. Is there any way that you will ever know what that field was intended for without refreshing the page?

With a right or top(or left) aligned label it is always clear what the goal of a field is.

Here is a link to an article that discusses the cons of placeholder text. It doesn't talk about whether or not to use it on its own, but it does talk about the complications than can be created by using it. Talking points range from the users not fully clearing out the placeholder text to mistaking the placeholder text as a completed field:

As users work through most forms:

They see a blank box. They type. The box now looks filled in. Each time this happens, users learn that

  • boxes they need to fill in are blank
  • boxes with text in them are already filled in
share|improve this answer
3  
Ideally when you clear out the field it should show the placeholder again but I bet a lot of forms do not. I can't think of any that do actually... –  Roger Attrill Jul 21 '11 at 17:59
4  
Good stuff. HTML5 is resurfacing this pattern with the placeholder attribute. Luckily it erases and refills the field. I am not prepared to adopt quite yet. –  Itumac Jul 21 '11 at 18:57
1  
Placeholder is great for saving space on single field forms such as search bars. The label should still be used in code for screenreders but can be hidden from view in CSS. Facebook do this in their search bar "Search for people, places and things" –  slawrence10 Dec 16 '12 at 21:14
    
FWIW, gmail's latest compose message UI uses placeholder text that appears while the field is focused and empty, there is no page refresh required to have it displayed if the user forgets which field is for subject or recipient's email address. Not sure what Google's R&D had to say, but they usually do things by the numbers. –  Shash Dec 18 '12 at 8:26

The answer depends on the frequency with which the user touches the controls:

If the person is going to use the form often, then you can train them what each field is. Muscle memory takes over and they stop reading the labels; internal or external. This is the rationale for gMail using placeholders. People use gMail every day and overcome the learning curve of placeholders.

If a user only sees the form once, then it's imperative that the form utilize the user's a priori knowledge of how forms on the web behave. There are very few use cases where the aesthetic improvement outweighs the usability detriment.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.