Fog Creek Software
Discussion Board




Good forms design ref?

Does anyone have a good forms design references?

I have a good many links that talk about good UI, but none that talk about layout some guide lines.

(you can have a good ui, but still have a crappy layout!!!).

I looking for the stuff like:

First Name:        ___________
Last Name:        ___________

Address:            ___________

City:                    ___________


Or

      First Name:___________
      Last Name:___________

          Address:___________

                  City:___________

I.e.: should you left justify the labels, or right justify. Does anyone has a good link ref to guild lines for the stuff like above?


Albert D. Kallal
Edmonton, Alberta Canada
kallal@msn.com
http://www.attcanada.net/~kallal.msn

Albert D. Kallal
Friday, August 06, 2004

I would say as long as you are consistent throughout your whole UI there should be no problem.  Unless of course your users complain about it.


Friday, August 06, 2004

Albert -- I'm surprised, I would have thought you'd have been all over this years ago.

Since Microsoft Office has the most widely used applications, I think it's easiest to just treat them as the standard and sort of learn by looking at how their user interfaces are designed.

But MS publishes rules for creating apps that give users the proper "Windows user experience".

http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnwue/html/ch14d.asp

It's useful stuff, but the level of detail gets a little too tedious for my taste.  I think you can learn faster and better just by getting a good feel for how things are done in the MS Office apps.

The blurb on alignment relevant to question in your post is not one of the more detailed, but you get from it that the standard alignment of labels for fields is left aligned:

"Alignment

When information is positioned vertically, align fields by their left edges (in western countries). This usually makes it easier for the user to scan the information. Text labels are usually left-aligned and placed above or to the left of the areas to which they apply. When placing text labels to the left of text box controls, align the top of the text with text displayed in the text box."

Herbert Sitz
Friday, August 06, 2004

Yeah, left aligned - so that the starting point is in a predictable place each time - makes it much easer to scan.

www.MarkTAW.com
Friday, August 06, 2004

Take a look at Robin Williams Design Workshop next time you're in Chapters/Borders/B&N.

http://www.amazon.com/exec/obidos/tg/detail/-/0201700883/qid=1091850287/sr=1-1/ref=sr_1_1/104-7397809-0975935?v=glance&s=books

She has a section on forms design in there - it's very good.

MT Heart
Friday, August 06, 2004

How about left aligned with leaders?  Or something similar to carry the eye over to the field.

First Name:_____________
Last Name:_____________
Address:...._____________
City:..........._____________
State:........_____________
Zip:............_____________

Mike
Saturday, August 07, 2004

Steve Krug : Dont make me think.

I dont remember  if he covers forms explicitly, but his advice applies to forms to.

My own first pieces advice would be to make sure there are no ambiguities, test it for the whole range of use cases, and break it down into clear sections if its alot.

If you have a shop that takes international orders, make sure to really get a hold of an adress in africa or asia to test it with, and take a look at what ends up in the database.
Overzealous validation scripts can really piss a user off.

Eric Debois
Saturday, August 07, 2004

>Albert -- I'm surprised, I would have thought you'd have been all over this years ago.

Yes, so much so..that I am now lacking reasons (or perhaps memory!) as to why I do things the way I do!

Actually, I want some nice articles to give to a person who is building screens and doing some design work for me.

>But MS publishes rules for creating apps that give users the proper "Windows user experience".

Yes, I been through many of those MSDN articles. I kind would liked some samples that show bad screens VS some that have been cleaned up to “nice” screens. Those articles are bit too long. I don’t want to have write-up my own guidelines for my consulting work..but I just may very well have to do this!

And, there is not always a hard and fast rule.

I will say that left, or right justified labels *can* look quite fine, and someone in this thread pointed out:

>I would say as long as you are consistent throughout your whole UI there should be no problem.  Unless of course your users complain about it.
The above very much rings true. I think that is the best advice.

As mentioned, I did want to have some docs to give to someone.

The other reason why I asked is I am in currently in a project where the screens I am working on were NOT done be me (this is different project then the guy doing design work For me). I can’t change these! In this project, the labels are right just, and they look ok to me (not great, but they are just fine….).  It now means that I am being forced to change the way I do things!

So, this is just a question of too often dealing with different designs, be they from other clients, or people doing work for me.

This is not even a issue of arguments

I simply want to add some structure into this issue.

Albert D. Kallal
Edmonton, Alberta Canada
kallal@msn.com
http://www.attcanada.net/~kallal.msn

Albert D. Kallal
Saturday, August 07, 2004

Take a look at "Seeing Data".  It's brand new so I haven't read it yet, but it looked somewhat interesting.

Clutch Cargo
Sunday, August 08, 2004

I prefer right justify labels. left justify labels are harder to read.

labels finished in dots are only used in character-based forms.

Guillermo
Sunday, August 08, 2004

*  Recent Topics

*  Fog Creek Home