6
Ask DN: Left or right aligned labels in forms?
over 8 years ago from George Papadakis, COO at Phaistos Networks
ref: http://d.pr/i/gM74
What's your pick and why?
12 comments
Adrian Howard, over 8 years ago
Neither.
Without knowing the context go for label immediately above the form field. Because there's some mild evidence that it's the fastest and more legible (but that depends on context, etc.) and it's the easiest to wrangle into smaller display sizes.
That decision might change depending on the context (e.g. limited vertical real estate).
If you're interested in label alignment I'd recommend reading Label Placement in Forms along with all of the comments — they're relevant.
I'd also take a gander at Label Alignment in Long Forms which talks about some more recent research.
George Papadakis, over 8 years ago
You are correct, of course; This is (or has to be) a context-based decision.
My "curiosity" had to do with this kind of environment, where just a bunch of fields (and labels) are present.
So many different views (and arguments) for such a trivial case makes you wonder for a couple of things - sort of.
Ketan Anjaria, over 8 years ago Are you asking from a visual perspective or a user perspective? The user perspective has been tested many times, left aligned labels above fields have consistently won out.
http://www.lukew.com/ff/entry.asp?504http://www.nngroup.com/articles/form-design-white-space/
I've found personally on forms with only 2-3 fields well known fields on mobile you can place the label as the placeholder when space is a consideration. Sign up with email, username, password is a good example. This pattern is becoming well known to mobile app users. Any more fields than that it becomes less effective.
Thank you for those very insightful links - and your (also insightful) reply.
Marc Edwards, over 8 years ago
I find that often left is neater, but right aligned is more legible. Depends how much variation there is in the label lengths. Longer labels make left aligned less legible. Having the label as close as possible to the related input field is desirable.
I believe there should be a way (a "native" one) to combine labels with placeholders into one — whatever that should be.
Again, a native one, not by deploying tricks, be that by manipulating the DOM (WEB), or messing up with APIs (iOS etc).
As I one said (and purposed), people with more brain capacity and experience than myself should gather and attack UI issues (and design challenges in general), tiny as this one, providing a "better world" for the rest of us.
But that's another story :-)
David Simpson, over 8 years ago
Neither, I would put it above.
Julian Lengfelder, over 8 years ago
I prefer floating input labels as done like this
That's "going too far".
The goal is not to break standards.
This kind of gimmicks eventually (and unfortunately) cause more confusion and clutter than the one they are supposed to be fixing.
Christina Cox, over 8 years ago
Left please.
Matthew Kosloski, over 8 years ago (edited over 8 years ago )
I think they would look better above the input. However, in my opinion, left-aligned looks nicer!
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now