Using a column based layout for text content

Question

Text typically falls into a single column on the majority of websites - the user reading down the page. The only scroll motion therefore is downward.

I've been experimenting recently with the CSS3 Column rule to split textual content into two columns. As a result the page length is shortened significantly, however it does require that the reader scroll back to the top after they have finished reading text in the first column, so that they may continue onto the second.

Whilst how much of a scroll is required depends on the amount of content itself and the users window size, I can't help but think this hinders the user experience (I do of course include an auto scroll to top button of the column, but still).

Does anyone have any experience (i.e gathered any data) in using column based layouts for textual content?

Is a column based layout too far removed from the expected behavior of a page? (therefore having a negative impact on UX)

If you know of any studies that have been conducted into this, please do share also.

Answer 1

I agree with you that forcing the user to scroll back to the top to read the next column is bad. Even with the 'back to top' button, it is an interruption where the user has to:

Find the button

Move their mouse to it

Click it

When it goes back to the top, find the start of the second column with his eye.

Compare this with one column where the user continues scrolling down from the start to the end of the article. There is no break in the flow.

If you are worried that a single column is too wide that it is becoming tiring for the user to read (this happens because when the users eye finishes a line and moves back to the left side, it can lose which line it was on), you can fix this by increasing line height, or increasing font size AND line height.

A good example of a site with good readability is: http://trentwalton.com/ - For text heavy pages, don't be afraid to use a large readable font, with good line height..