User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
Possible Duplicate:
On forms, is inline placeholder text better than a label outside each field?
Are there any advantages / disadvantages in placing ones labels outside ones text inputs like Gmail's login box vs. placing them inside (as placeholders) like Twitter's login box (other than the latter's lack of support on old browsers)?
Labels within fields go away as you start typing which means the context for the answer disappears. If you forget what question you are answering you have to clear the field and hope to see the label again. Also, there is no way to go back and check your answers, a nightmare on longer form.
Note that in terms of semantics and accessibility, there is a difference between a label and a placeholder
The key is to not assume a placeholder can take the place of a label on a form field.
Where it gets debatable is how to actually implement that. Prior to HTML 5's placeholder attribute, there were two common methods:
Hide the label with CSS, add text into the field itself and delete it on focus with JS
Move the label so that it physically was on top of the field.
I usually preferred the second option as it felt more pure.
Today, though, with HTML 5, we have an actual attribute for this called 'placeholder'. In addition, we can use aria-label for accessibility:
In theory, a field with both of those attributes set to the text you want for a label should work--both from a usability standpoint and an accessibility standpoint.
As for which to use, I'd typically suggest that one should always use a proper label tag and place it next to or above the form field. This is the clearest option for most users and the most appropriate in terms of markup. In addition, you can still use a placeholder attribute for further clarification if needed.
When to put a label inside the field? I'd say that usually comes down to space and visual design considerations.
Labels outside, example copy or guidance on completion inside (which disappears on entry). So a label "Date of birth" but "dd/mm/yyyy" inside the field to indicate the format expected.
