Re: [css3-multicol] How to avoid scrolling up for next column

On Thu, Dec 21, 2006 at 09:21:57PM +0000, Jarno Suni wrote:

> The size of a page would have to adapt to the size of viewport
> automatically. Maximum length (or height) of a column would be
> determined by the available vertical space in viewport. Programmer or
> user would specify the preferred column width for easy reading. Ideally,
> the column width should depend on font size, I think.
> 
> Btw. if programmer used neither styles nor tables, setting the single
> column's width should be configurable by user. In my experience, current
> browsers do not give good means to adjust viewport width (without
> resizing the browser window, which is not a handy way, if there are
> several tabs open).

Regarding column width, one could of course specify column width in ems,
but we found that it's best if there are an integer number of columns
per viewport: after all, there's pretty much no value for just a partial column
to be visible, so rather than show N½ columns you might as well show N or N+1.

Relatedly, and more importantly, any scrolling mechanisms (keys, finger, even
mouse) should try to avoid ending the movement part way through a column.
Looking at the results of our study, I think that for some mouse events we
erred towards allowing precise movement (at the cost of allowing ending part
way through a column): most people who used keyboard for scrolling (which never
ended part way through a column) preferred column display (with horizontal
scrolling) over standard vertical scrolling, whereas most people who used the
mouse (and especially if they dragged the scroll bar, which our user interface
always interpreted as precise scrolling without any attempt to avoid cutting a
column) preferred standard vertical display.

Just knowing that there's a way to scroll to exactly a full column isn't enough:
users typically don't change how they scroll, and are unhappy with a
column-based display if their existing preferred scrolling mechanism tends to
truncate columns.

However, I don't know just how far to go, i.e. I don't know exactly how
to decide for a given mouse/touchscreen input event whether to interpret it
as requesting precise movement or moving to show a full column, all I can say
is that if I were to repeat the experiment then I'd tend more towards avoiding
truncating columns.

The user study I'm talking about and that prompts this recommendation is
described at:

  http://portal.acm.org/citation.cfm?id=1526821
  or
  http://www.csse.monash.edu.au/~marriott/BraMarMou09.pdf


As for whether using multiple pages instead of horizontal scrolling could be better,
we haven't looked at it, but it would have some cognitive advantages, and it might
be something we (the group I work with at university) should look at.  Say if you'd
be interested in the results of such a study.


Something else we've found when playing with multi-column layouts (but which we
haven't looked into carefully) is that the ideal space between columns is
actually sub-linear in font size: i.e. if you make the font size k% larger then
the gap between columns should be larger too but by less than k%.  I haven't
looked into it enough to offer a more concrete guide, but it does mean that
neither px nor em is ideal for specifying the gap between columns.  If anyone
wants to look into this, please post your results here so that the
css3-multicol recommendation for column-gap:normal can be adjusted.

pjrm.

Received on Sunday, 22 August 2010 08:41:16 UTC