Tuesday, February 19, 2008

Paging vs Scrolling - Aesthetic and Functional Considerations

Recently, while working on two different Flash projects, I had to deal with the idea of paging vs scrolling. I've encountered both types of UI treatments countless times over the last 20+ years, but I've never thought too deeply on the subject. Yes, I've been irritated by Flash sites with tiny scroll boxes. And I've been irritated by HTML pages that page the info instead of just letting it flow in my browser. But now I found myself thinking actively about the issue of paging vs scrolling.

So I Googled "paging vs scrolling" and sure enough, it's been looked at and studied. The studies do not use very large numbers of participants, so I'm hesitant to put too much stock in them. My focus on paging vs scrolling is for a very specific context, fixed sized-Flash movies with static content. There are aesthetic and functional reasons to choose paging in this situation.

How many times have you been faced with a Flash site where there were tiny scrolling boxes with non-standard scrollbars? Even though your monitor may have plenty of room, you're forced to scroll (it just feels wrong and looks bad). If you're delivering text to a small, fixed area, this is where paging looks and works better in a Flash movie where the text is already pre-loaded. A problem with paging in HTML is that it relies on a request back to the server each time you want to flip to a new page.

Back in the old days of newspaper and magazine design and layout, if you had a blurb of text that exceed the space, you'd refer the reader to another page. It is a convention that is familiar. On the web (and in Flash), it can work even better as it allows the reader to immediately jump to the next passage (as opposed to searching for it and perusing ads), as well as easily jump back. You could make a similar case to scrolling but it doesn't hold up aesthetically in the case of Flash. Whereas with paging, you could have more than one article on a screen of a Flash movie that the user can page through and it will hold up from a design perspective, but imagine multiple scroll boxes (*gasp* I've seen such things).

Fixed-size layouts is only part of the justification for paging in Flash. Another element is whether the content is static. If the content for a story is fairly static (minor edits aside), paging works well. If the content is in flux--where the text on each page is changing in the story so it is flowing differently--I think a scrollbox is more appropriate.

People do more than just read words when they look at a page. They see the shape of the paragraphs, lines, words, and character forms. Flipping through pages can take advantage of this if the text is not constantly changing. A similar form of visual and spatial memory is used when you go back to a favorite passage in a book. But in this scenario, I'd be tempted to avoid a fixed-sized Flash for HTML or another fluid medium like Flex.