The Art of Label Placement

UPDATE - Luke W. left a comment to point out his 100 page form design presentation, I am working my way through it now and I am impressed so far.

I was doing some research for my little smart-client side project and came across a couple of nice articles on form-design and label placement:

Web Application Form Design by Luke Wroblewski - This article covers the best ways to arrange labels and submission buttons.

Web Application Form Design Expanded by Luke Wroblewski - Another great article from Luke W. expanding on the same topics.

Label Placement in Forms by Matteo Penzo - Matteo takes Luke's advice but applies eyetracking to evaluate how usable it is.

After going through these I decided on non-bold labels above the input fields, and the users are happy.

-James

Comments

#1 haacked@gmail.com (Haacked) on 4.12.2007 at 2:28 AM

Wow, this is a fantastic resource. Interestingly enough, this was the direction I've been headed with Subtext lately as you can see from my contact form and comment forms haacked.com/.../contact.aspx< />

#2 LukeW on 4.12.2007 at 5:09 PM

James, you might also be interested in my recent presentation on Best Practices for Form Design (100+ page PDF):
http://www.lukew.com/resources/articles/WebForms_LukeW.pdf

thanks~

Leave a Comment