4

I have a list (quite a long one) of checkboxes. Some will be checked by default, and I'd like to put those first. So I'm wondering which direction is more frequent when reading / completing them, to decide whether to arrange the default ones horizontally or vertically (and to see which priority items I put 'first').

Which reading direction is proven to be more frequent? Red or green?:

enter image description here

These are the scenarios I will use in each case:

enter image description here

vs

enter image description here

Improve this question

3 Answers 3

Reset to default
3

Well I would arrange them vertically if I was to do this, because:

  • It looks grouped.
  • It's easy to read at one glance, and doesn't look scattered.
  • It's easier to scan through, uncheck the default checked boxes.
  • You are also amplifying the focus on a single part of the screen which is good.


You should also have a look at this Documentation:


Update:
Radio Buttons should also be placed vertically. Microsoft's link and Apple's link have said the same. Except that if its On and Off, then it should be side by side. Other than that vertical arrangement rules!

Improve this answer
2
  • 1
    +1, left allignement eases glance reading and scanning. Separating sets of them in chunks with white in between is a good idea, at least if the chunks are categories. But I would try to do that vertically too.
    – JOG
    Commented Sep 27, 2012 at 8:41
  • If a radio button is "On" or "Off", it should usually be a checkbox. That said, sometimes a radio box can make things clearer, since you can provide explanatory text for both states rather than for only one.
    – Brian
    Commented Sep 27, 2012 at 20:59
4

The answer is: you don't know. And that is the exact reason why you have to avoid multi-column layouts.

See this article: http://baymard.com/blog/avoid-multi-column-forms

Quote: One of the problems with form fields in multiple columns is that your users are likely to interpret the fields inconsistently.

Improve this answer
2
  • Thank you for your answer. The article is very interestnig and it helped me reorganise some of the other form elements (I still use two columns, but the inputs look now consistent in spite of the interpretation). Unfortunately, some of the checkbox lists have 20 - 25 elements, so until the web app changes functionality I won't be able to arrange them differently.
    – Yisela
    Commented Sep 27, 2012 at 20:36
  • Yes, you are able to organize them differently. In a list of 25, order can be created. That means that you can apply grouping, either by creating different groups in your main form, or by presenting your options as items in a list that has grouping or even in a tree if needed.
    – André
    Commented Sep 28, 2012 at 6:48
1

Vertically.

In my eyes it looks like lines in a newspaper in a multi-column article. In that case you would read the lines vertically, one column at a time. If it's good enough for a newspapers, it's good enough for me.

Also, you can play with the margins and spacing. Make the spacing between vertical items smaller than the spacing between columns. This will make it pretty obvious that columns go together first.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.