I often implement numbered list for both print and web projects. At times it is just more efficient to break the list into two, three, or four columns.

How should item ordering be handled?

Should numbers start at 1 in the top left then move down the column, then jump to the next column to continue numbering? (Option A)

Or should numbers start at 1 in the top left the move sideways to #2, #3, etc., jumping columns for each number? (Option B)

enter image description here

In terms of web responsiveness, Option B provides better break points (at times with 3 or 4 columns).

Should this be handled the same in both print and web?

  • personally I think option A is more readable. I think we (well western culture) tend to read in columns left to right, so I'd read the whole left column before I went to the next one – binky Sep 8 '15 at 20:11
  • 1
    @Scott While I don't believe the question is off-topic here, the UX site definitely fields questions related to printed materials as well. Among other things. – Chris Hayes Sep 9 '15 at 6:33

I think that your first option is a much better practice. I wouldn't treat a numbered list any different than I would design an alphabetical list. Would you setup a book's index in an alternating-column style?

Having a reader's eye scan back and forth across multiple columns doesn't sell the continuity that an ordered list should provide.

Multiple column text for the web is still touchy, but CSS support is growing (and is in most modern browsers)

| improve this answer | |

Option A, for the love of dog, please. Whipping my eyes back and forth to read Option B is exhausting. (This is how Stack Exchange does alphabetical order with the tags, and I hate it.) It's almost like you have to carry too much information from left to right as you hop from one column to the next instead of just skimming downward quickly.

I see almost no advantage to Option B for print or web.

| improve this answer | |
  • B is more about responsive web design... so.... – Scott Sep 8 '15 at 21:46

Option A is great, it feels intuitive. Reading columns top-to-bottom is natural for Western readers.

Option B is better suited for rows instead of columns, and maybe that's an approach to try; less space between entries, more space between lines. The responsive-friendly point is legitimate, but as it stands now, I think this layout will hinder your content's readability, and the ability to quickly scan and parse information without friction, which should be priority #1.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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