WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Alignment of Labels in forms

for

From: Tim Beadle
Date: Sep 17, 2008 8:00AM

On Wed, Sep 17, 2008 at 2:09 PM, Christopher Nagle
< <EMAIL REMOVED> > wrote:
> Hello,
>
> Is it terms of accessibility and usability, is it better to align labels
> close to the inputs they correspond to i.e. right aligned or is it better to
> have them be lined up evenly against the side of the containing element i.e.
> left aligned? I have been right aligning my labels so they are closer to
> the input elements they correspond to so people who have problems with
> spacial orientation or people who use screen magnifiers with a significant
> amount of magnification can more easily see which labels go with which
> fields. Though someone recently asked me to left align the labels in a
> form. Here's an example of what I mean.

Luke Wroblewski of Yahoo did has written a lot on this subject. He
references some eye-tracking research into form field alignments and
time-to-completion of the form in this blog entry:
http://www.lukew.com/ff/entry.asp?504

In short: top aligned (i.e. label and field on separate lines)
performs best, right-aligned performs next best (but uses space more
effectively) and left-aligned performs the worst.

Regards,

Tim