When it comes to filling out a form, you want your users to spend less time understanding your form and more time filling it out. Over at UXMatters, Matteo Penzo wrote a [fantastic article](http://www.uxmatters.com/MT/archives/000107.php) detailing the results of some eye-tracking studies he’s done on the impact of label placement in relation to form elements.

> “Input elements should be organized in logical groups so that your brain can process the form layout in chunks of related fields.”

Obviously the closer you have the label to the input element, the less fixated the user is on trying to figure out the association between what the form is asking for and the task that needs to be accomplished. Since there’s a pretty good relationship between cognitive processing and eye fixation, the lower the fixation the faster the field is being processed. The big question, however, is if it’s faster to put the label to the side or above the field. Here’s a quick overview of some of the results.

– **Labels to Left and Aligned Left** : 500ms
– **Labels to the left and Aligned Right** : 170ms for Experts and 240ms for Novice
– **Labels Sitting Directly Above the Field** : 50ms

What’s surprising (even to us) is that putting the labels directly above the field (like we do with Wufoo form layouts) is almost 5X faster for the user to process than putting the labels next to the field.

> “Placing a label right over its input field permitted users to capture both elements with a single eye movement. Also, if a label indicated data that was very familiar to users–for example, their first name or family name–users did not fixate on the label separately to read it.”

Definitely head over there and check out the results for yourself and let us know what you think. It’s a great read and I really appreciate the guys at UXMatters for taking the time and resources to share the results for free. Thanks to studies like these, hopefully, form designers will have more information in their arsenal to build forms that are inherently faster to understand and fill out.

In regards to how this will impact Wufoo designed forms, we’ve always been fans of the label above layout and since a majority of the forms created on our system are short forms, we’ll continue to leave this placement as our default layout. We are, however, closing in on providing a way to allow users to attach their own CSS file on their Wufoo forms so they can customize these layouts to their heart’s content. Currently, we’re working on providing the appropriate CSS ids and class hooks to give designers the most amount of flexiblity when this feature goes out. Any suggestions or requests on this feature are always welcome.