Right aligned labels

20 Aug 2006 - 10:46pm
8 years ago
5 replies
1330 reads
Kinjal
2006

I would like to know everyone's views on Right aligned labels. I did some research on the web and found the below link:

http://developer.apple.com/documentation/UserExperience/Conceptual/OSXHIGuidelines/XHIGLayout/chapter_19_section_2.html
http://jroller.com/page/microarchitect?entry=why_you_should_right_align
http://www.uxmatters.com/MT/archives/000107.php
http://www.lukew.com/resources/articles/web_forms.html

The questions I have are:

1) Right align or left align labels??
I personally like right aligned labels if the form field is single column.
2) Views on multi column labels in right aligned labels????
I dont think I would go for right alingned labels for a multi column
3) what about required fields?? Where to place required fields in rignt aligned labels?
4) If the label is very long, shall it be wraped to the second row??

I appreciate if anyone can post their views on the above posted questions. Please refer to the attached sample document.

-------------- next part --------------
A non-text attachment was scrubbed...
Name: align.pdf
Type: application/pdf
Size: 478802 bytes
Desc: not available
Url : /pipermail/discuss-interactiondesigners.com/attachments/20060820/16803b1e/align.pdf

Comments

21 Aug 2006 - 10:42am
Robert Hoekman, Jr.
2005

> 1) Right align or left align labels??
> I personally like right aligned labels if the form field is single
> column.

Left-aligned, above the fields: http://uxmatters.com/MT/archives/000107.php

-r-

21 Aug 2006 - 11:13am
russwilson
2005

I'm not sure if it was on this list, but I recently
read a great study that (if I remember correctly)
concluded that labels directly above input fields were
the best choice for many applications.

Name
[______________]

Address
[______________]

...

(sorry for not providing the source - will do so later
if time permits)

-----Original Message-----
From: discuss-bounces at lists.interactiondesigners.com
[mailto:discuss-bounces at lists.interactiondesigners.com] On Behalf Of
Robert Hoekman, Jr.
Sent: Monday, August 21, 2006 10:42 AM
To: Kinjal
Cc: discuss at ixda.org
Subject: Re: [IxDA Discuss] Right aligned labels

[Please voluntarily trim replies to include only relevant quoted
material.]

> 1) Right align or left align labels??
> I personally like right aligned labels if the form field is single
> column.

Left-aligned, above the fields:
http://uxmatters.com/MT/archives/000107.php

-r-
________________________________________________________________
Welcome to the Interaction Design Association (IxDA)!
To post to this list ....... discuss at ixda.org List Guidelines
............ http://listguide.ixda.org/ List Help ..................
http://listhelp.ixda.org/ (Un)Subscription Options ...
http://subscription-options.ixda.org/
Announcements List ......... http://subscribe-announce.ixda.org/
Questions .................. lists at ixda.org Home .......................
http://ixda.org/ Resource Library ........... http://resources.ixda.org

25 Aug 2006 - 11:11am
spyboy
2006

What amazes me is how a lot of paper forms have the field BELOW the field,
I don't know how many times I wrote in the wrong box because I thought the
label I was reading was above the box.

Kirk

-----Original Message-----
From: discuss-bounces at lists.interactiondesigners.com
[mailto:discuss-bounces at lists.interactiondesigners.com] On Behalf Of Wilson,
Russell
Sent: Monday, August 21, 2006 12:14 PM
To: Robert Hoekman, Jr.; Kinjal
Cc: discuss at ixda.org
Subject: Re: [IxDA Discuss] Right aligned labels

[Please voluntarily trim replies to include only relevant quoted material.]

I'm not sure if it was on this list, but I recently read a great study that
(if I remember correctly) concluded that labels directly above input fields
were the best choice for many applications.

Name
[______________]

Address
[______________]

...

(sorry for not providing the source - will do so later if time permits)

-----Original Message-----
From: discuss-bounces at lists.interactiondesigners.com
[mailto:discuss-bounces at lists.interactiondesigners.com] On Behalf Of Robert
Hoekman, Jr.
Sent: Monday, August 21, 2006 10:42 AM
To: Kinjal
Cc: discuss at ixda.org
Subject: Re: [IxDA Discuss] Right aligned labels

[Please voluntarily trim replies to include only relevant quoted material.]

> 1) Right align or left align labels??
> I personally like right aligned labels if the form field is single
> column.

Left-aligned, above the fields:
http://uxmatters.com/MT/archives/000107.php

-r-
________________________________________________________________
Welcome to the Interaction Design Association (IxDA)!
To post to this list ....... discuss at ixda.org List Guidelines ............
http://listguide.ixda.org/ List Help ..................
http://listhelp.ixda.org/ (Un)Subscription Options ...
http://subscription-options.ixda.org/
Announcements List ......... http://subscribe-announce.ixda.org/
Questions .................. lists at ixda.org Home .......................
http://ixda.org/ Resource Library ........... http://resources.ixda.org
________________________________________________________________
Welcome to the Interaction Design Association (IxDA)!
To post to this list ....... discuss at ixda.org List Guidelines ............
http://listguide.ixda.org/ List Help ..................
http://listhelp.ixda.org/ (Un)Subscription Options ...
http://subscription-options.ixda.org/
Announcements List ......... http://subscribe-announce.ixda.org/
Questions .................. lists at ixda.org Home .......................
http://ixda.org/ Resource Library ........... http://resources.ixda.org

25 Aug 2006 - 11:50am
Field, Carol
2006

My interaction design team discussed the eye tracking study that recommends placing labels above the text field or right aligning the labels if they are placed before the text field. We'd like to recommend caution in implementing the finding because the form studied was much simpler than the average form and because they seemed to emphasize speed. Accuracy becomes very important when the form is more complex.

o What if your form requires a formatting instruction such as m-d-yy?
o What if vertical space is an issue?
o What if the form is lengthy and has sections?
o What if this were one of many forms within a site or application, some of which were much more complex. Should you treat each form as a separate entity? What about consistency?

Carol Field | Manager, User Experience Team | Franklin Templeton Investments | cfield at frk.com|
960 Franklin Parkway, Bldg 960/3 San Mateo, CA 94403 | 650-525-8129 or 800/632-2350 x28129

-
Notice: All email and instant messages (including attachments) sent to
or from Franklin Templeton Investments (FTI) personnel may be retained,
monitored and/or reviewed by FTI and its agents, or authorized
law enforcement personnel, without further notice or consent.

26 Aug 2006 - 10:19am
Bryan J Busch
2006

> From: "Field, Carol" <CField at frk.com>
>
> My interaction design team discussed the eye tracking study that
> recommends placing labels above the text field or right aligning
> the labels if they are placed before the text field. We'd like to
> recommend caution in implementing the finding because the form
> studied was much simpler than the average form and because they
> seemed to emphasize speed. Accuracy becomes very important when the
> form is more complex.
>
> o What if vertical space is an issue?

Heya, Carol,

It's good that you bring up these questions for people to keep in
mind. But I'm a little confused about vertical space being an issue.
Is it a case of the designer not wanting the page to scroll, or is a
block of text being tied to the bottom of an image to create a
pleasing appearance, maybe? (example: the blue box to the right of
the biggest photo here: http://nytimesagency.com/)

Given what we know of coding for accessibility -- in this case, make
sure your design doesn't break when the text size is increased in the
browser -- it's nearly impossible to plan a web page layout that is
both accessible *and* allows for limited vertical space.

Or maybe it's something else you were referring to :)

- Bryan

Syndicate content Get the feed