Re: [IxDA Discuss] Label location
Jerome Ribot > Here's an interesting eye-tracking study that was > done recently by > Chui Chui Tan that highlights > some good guidelines for form design: > > http://www.cxpartners.co.uk/thoughts/ > web_forms_design_guidelines_an_eyetracking_study.htm Hi Jerome Thanks for drawing my attention to this study. It's a nice piece of work but it's also the last straw. /start of rant I'm just so *tired* of seeing a study of rather trivial web forms (in this case, four registration forms) used as a basis for making claims for *all* forms. /end of rant /start of more considered discussion This study carefully, and thoughtfully, investigated small differences between four quite good registration forms. I'm not sure I'd totally agree with every guideline, but you probably wouldn't go far wrong in following these guidelines IF, and only IF, these assumptions apply to your forms: - your organisation is a massive, brand-name web presence that every web user knows - your users are strongly motivated to fill in the form because it allows them to make use of crucial features that are only offered by the specific organisation - your form confines itself to straightforward questions that are appropriate in the context of the relationship between your users and their current goals, and your organisation and its current goals, and anything slightly unusual is justified appropriately right on the form - your form is appropriately legible and properly marked up for use by people using assistive technologies and/or amending the display of the form in their preferred browser I'll just unpick one of the recommendations in this piece: "Use coloured or shaded grouping headers ONLY if they are important" This isn't bad advice. It's quite good advice - if you know how to judge when the grouping headers are important. That judgment arises from considering the users, their goals, your organisation, its goals, and the overall conversation of the form (as well as its appearance). This study said "From the eye-tracking study, we found that the participants did not pay much attention to the headers". Well, no, they wouldn't. These forms were quite well designed, rather simple, and appropriate to the relationship and conversation. Grouping devices, such as these headers, are rarely needed by people in these circumstances - so they don't look at them. But: think of a more complicated form, with more difficult questions, in a more complex relationship. Users may need to break out of the form to find answers and then return later. They may need to ask someone about something in the form. In those circumstances, the grouping of the form can be really important, as a locating device and as a way of helping users to talk about the form to someone else. The grouping can also make the form appear less daunting, which is worthwhile. I know we all want simple rules that we can apply easily, and we all want to avoid yet another 'it depends' answer. Trouble is: we really do have to *think* about what we're designing - not exactly a surprise to IxDA people, of course, but not the easy answer. Oops - gone off into a rant again. Hope you understand why. Best Caroline Jarrett www.formsthatwork.com "Forms that work: Designing web forms for usability" foreword by Steve Krug Welcome to the Interaction Design Association (IxDA)! To post to this list ... disc...@ixda.org Unsubscribe http://www.ixda.org/unsubscribe List Guidelines http://www.ixda.org/guidelines List Help .. http://www.ixda.org/help
Re: [IxDA Discuss] Label location
Check out Luke's presentation at http://www.lukew.com/resources/articles/WebForms_LukeW.pdf . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Posted from the new ixda.org http://www.ixda.org/discuss?post=41873 Welcome to the Interaction Design Association (IxDA)! To post to this list ... disc...@ixda.org Unsubscribe http://www.ixda.org/unsubscribe List Guidelines http://www.ixda.org/guidelines List Help .. http://www.ixda.org/help
Re: [IxDA Discuss] Label location
Here's an interesting eye-tracking study that was done recently by Chui Chui Tan that highlights some good guidelines for form design: http://www.cxpartners.co.uk/thoughts/web_forms_design_guidelines_an_eyetracking_study.htm Cheers Jerome . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Posted from the new ixda.org http://www.ixda.org/discuss?post=41873 Welcome to the Interaction Design Association (IxDA)! To post to this list ... disc...@ixda.org Unsubscribe http://www.ixda.org/unsubscribe List Guidelines http://www.ixda.org/guidelines List Help .. http://www.ixda.org/help
Re: [IxDA Discuss] Label location
Don't forget 508. Easy to not think about it when dealing with straight forward forms, but there are serious concerns. Good idea to use the label tag and field sets. Even if you style them to look different, readers like JAWS will add functionality to the form for tabbing and helping the user to know what they are filling out. I'd imagine some of these subsidies might have to do with disabilities, so this is likely of even more concern than it normally is. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Posted from the new ixda.org http://www.ixda.org/discuss?post=41873 Welcome to the Interaction Design Association (IxDA)! To post to this list ... disc...@ixda.org Unsubscribe http://www.ixda.org/unsubscribe List Guidelines http://www.ixda.org/guidelines List Help .. http://www.ixda.org/help
Re: [IxDA Discuss] Label location
The context in which the respondents prepare for filling out the form and then actually do fill out the form can make all the difference. Background information: In documentation and training, the issues that Caroline raises are handled by instructional design. > the placement of the labels is far, far less important than what the questions are asking > I have many times seen people give up on forms because they don't understand the question or don't know how to answer it or the answer that they want to give doesn't fit within the allowed answers on the form. The methodology of instructional design is (a) to establish learning objectives: what must the person understand in order to be able to do the task (b) to provide support for the learning: ensure that the person has a way to get the help they need so that they achieve the understanding required to do the task, or else ensure that the person gets feedback directing them to support that can directly help them with the task. Application to the problem: This is going to sound really cumbersome, but here goes ... To apply instructional design methodology to forms, you would want to get a really good understanding of the processes that the provided information will go through. Then you want to make sure that the people filling out the form can understand the answers that they can give, and what the results will be when the process starts to work based on their answers. Sometimes the process itself is part of the problem. It could be that the process has to run through some steps before you can know what effect the answers will have on the result. In this case, the owners of the process should be informed that (if it is possible under the regulatory regime that defines the process) there may be a need to return to the respondent for further information or clarification or correction of previous responses once the process has gotten far enough to provide guidance on the implications of various inputs. What I recently did with one government agency is fill in the form with errors, submit it, and then call a number to discuss what I should have entered. I was lucky to know how to get the right number to call. If you can provide your respondents with contacts that they can use to actually get help with their issues, that will help tremendously to make the form submission and processing experience more robust and reliable both for the respondent and for those tasked with processing the submitted information. One way to package this sort of help is as an up-front tutorial in which you explain to the respondents what information they need to collect and how they can figure out whether what they're about to state is accurate and relevant to the issues they are trying to address. Best wishes, Bruce Esrig Madison, NJ On Sat, May 9, 2009 at 5:16 PM, Caroline Jarrett < caroline.jarr...@effortmark.co.uk> wrote: > Is there any evidence, or illuminating experience, > > about the benefits of locating form labels > > to the left of the input fields or above them > > using a smaller font? > > The forms are very long, say, 100 fields and more. > > Will be paginated, sort of a wizard, with next/prev buttons. > > The audience is rather illiterate, > > ages ranging from 18 all the way through > > the sixties and seventies. > > These are forms for applying for gov subsidies > > and the like, the fields contain mostly personal > > data of the family members and the like. > > > > I would like to be able to tell myself which layout > > is more usable: two columns or one column. > > Hi Juan > > As mentioned in previous posts, Luke W does discuss this issue in his book. > I've also got a discussion of the problem in my book: "Forms that work: > Designing web forms for usability" (available from any bookshop - details > on > www.formsthatwork.com) > > But here goes on giving you a direct (free) answer. > > If you read the popular advice on where to put labels on forms, you will > see > that it mostly relates to very short form labels that are asking very easy > questions. Luke's and my books are two places where we actually talk about > more complexity, such as longer labels. > > You can read a summary of my advice in this column: "Label placement on > forms" > http://www.usabilitynews.com/news/article3507.asp > > For your forms, you also mention that the audience is somewhat illiterate > and also includes many older people. For people who do not read easily - > which certainly includes your audience - 'smaller font' is definitely a > really bad idea. Putting long labels in smaller font just makes the labels > harder to read, which is exactly the worst idea for those audiences. > > For people who do not read easily, left-aligned text in a good, large, > legible font is really important. > > It's not quite so clear whether putting the labels to the left of the boxes > or above the boxes is the better solution for this particular type of > audience. Dr Kathryn Summers of
Re: [IxDA Discuss] Label location
> Is there any evidence, or illuminating experience, > about the benefits of locating form labels > to the left of the input fields or above them > using a smaller font? > The forms are very long, say, 100 fields and more. > Will be paginated, sort of a wizard, with next/prev buttons. > The audience is rather illiterate, > ages ranging from 18 all the way through > the sixties and seventies. > These are forms for applying for gov subsidies > and the like, the fields contain mostly personal > data of the family members and the like. > > I would like to be able to tell myself which layout > is more usable: two columns or one column. Hi Juan As mentioned in previous posts, Luke W does discuss this issue in his book. I've also got a discussion of the problem in my book: "Forms that work: Designing web forms for usability" (available from any bookshop - details on www.formsthatwork.com) But here goes on giving you a direct (free) answer. If you read the popular advice on where to put labels on forms, you will see that it mostly relates to very short form labels that are asking very easy questions. Luke's and my books are two places where we actually talk about more complexity, such as longer labels. You can read a summary of my advice in this column: "Label placement on forms" http://www.usabilitynews.com/news/article3507.asp For your forms, you also mention that the audience is somewhat illiterate and also includes many older people. For people who do not read easily - which certainly includes your audience - 'smaller font' is definitely a really bad idea. Putting long labels in smaller font just makes the labels harder to read, which is exactly the worst idea for those audiences. For people who do not read easily, left-aligned text in a good, large, legible font is really important. It's not quite so clear whether putting the labels to the left of the boxes or above the boxes is the better solution for this particular type of audience. Dr Kathryn Summers of the University of Baltimore is definitely *the* expert in designing forms for people with low literacy. I'll write to her and ask her what she thinks. Meanwhile, here's what I know from my extensive experience of testing government forms with a wide range of people, including older people: *provided* each label is clearly and unambiguously associated with the appropriate field, then the placement of the labels is far, far less important than what the questions are asking, and somewhat less important than the overall length of the form. I have many times seen people give up on forms because they don't understand the question or don't know how to answer it or the answer that they want to give doesn't fit within the allowed answers on the form. I have also seen people fail to start the form, or give up on it, because it just seems overwhelming. So far, I've never seen anyone bail on a form merely because the labels were in the wrong place. If I were you, I'd choose either method and then spend a lot of time testing with the real users and iterating the form design based on what you find. Summary of advice: 1. Make sure you: - use a large, legible font - place the label so that it is clearly and unambiguously associated with the correct field 2. It is definitely preferable to place the label above or to the left of the correct field 3. Test, fix, and test again. Several times. Best Caroline Jarrett www.formsthatwork.com "Forms that work: Designing web forms for usability". Welcome to the Interaction Design Association (IxDA)! To post to this list ... disc...@ixda.org Unsubscribe http://www.ixda.org/unsubscribe List Guidelines http://www.ixda.org/guidelines List Help .. http://www.ixda.org/help
Re: [IxDA Discuss] Label location
Hi Juan, Certainly you should check out Luke W.'s book on form design: http://www.rosenfeldmedia.com/books/webforms/ I've read it. The guidance you're looking for is in there! Are your form labels really long? If so you might want to stick with single-column (labels on top) layout. Labels on top are the fastest way to get people through a form. With two columns, people have to "jump" from column to column to read the label and fill in the input. Based on what you've mentioned, labels on top might be your best option. I'll let you be the judge of that though! =) Best, Jason R. -- Jason Robb ja...@jasonrobb.com http://jasonrobb.com http://uxboston.com http://twitter.com/jasonrobb http://twitter.com/uxboston . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Posted from the new ixda.org http://www.ixda.org/discuss?post=41873 Welcome to the Interaction Design Association (IxDA)! To post to this list ... disc...@ixda.org Unsubscribe http://www.ixda.org/unsubscribe List Guidelines http://www.ixda.org/guidelines List Help .. http://www.ixda.org/help
Re: [IxDA Discuss] Label location
You might want to check out LukeW's book on form design: http://www.lukew.com/resources/web_form_design.asp He also has many articles and presentations on the subject. Regards, Maria Cordell On Sat, May 9, 2009 at 10:18 AM, Juan Lanus wrote: > Is there any evidence, or illuminating experience, about the benefits of > locating form labels to the left of the input fields or above them using a > smaller font?The forms are very long, say, 100 fields and more. > Will be paginated, sort of a wizard, with next/prev buttons. > The audience is rather illiterate, ages ranging from 18 all the way through > the sixties and seventies. > These are forms for applying for gov subsidies and the like, the fields > contain mostly parsonal data of the family members and the like. > > I would like to be able to tell myself which layout is more usable: two > columns or one column. > Or you may RTFM me to an old discussion ... > > Thanks! > -- > Juan Lanus > > Welcome to the Interaction Design Association (IxDA)! > To post to this list ... disc...@ixda.org > Unsubscribe http://www.ixda.org/unsubscribe > List Guidelines http://www.ixda.org/guidelines > List Help .. http://www.ixda.org/help > Welcome to the Interaction Design Association (IxDA)! To post to this list ... disc...@ixda.org Unsubscribe http://www.ixda.org/unsubscribe List Guidelines http://www.ixda.org/guidelines List Help .. http://www.ixda.org/help
[IxDA Discuss] Label location
Is there any evidence, or illuminating experience, about the benefits of locating form labels to the left of the input fields or above them using a smaller font?The forms are very long, say, 100 fields and more. Will be paginated, sort of a wizard, with next/prev buttons. The audience is rather illiterate, ages ranging from 18 all the way through the sixties and seventies. These are forms for applying for gov subsidies and the like, the fields contain mostly parsonal data of the family members and the like. I would like to be able to tell myself which layout is more usable: two columns or one column. Or you may RTFM me to an old discussion ... Thanks! -- Juan Lanus Welcome to the Interaction Design Association (IxDA)! To post to this list ... disc...@ixda.org Unsubscribe http://www.ixda.org/unsubscribe List Guidelines http://www.ixda.org/guidelines List Help .. http://www.ixda.org/help
