4 ms·

Page Flips Are Better Than Infinite Scroll

41 points by alexkon 16y ago

jacobolus 16y ago
By far my favorite way to read content on a screen is using Tofu http://amarsagoo.info/tofu/ http://amarsagoo.info/tofu/ which presents columns (of user-preferred width, font, hyphenation & justification, and leading) of text, and then scrolls column-by-column left and right. It’s especially nice when two or more people are trying to read from the same screen, because occasional scrolling of a whole column directly horizontally is much less disruptive than arbitrary amounts of scrolling down a page. On wide computer displays, it is a significantly better use of screen real estate than single-column web pages, which should stick to a measure (width) of not much more than about 60 characters to be readable. Anything longer than a page or two that I plan to read on a screen gets copied and pasted into Tofu. Edit: note that there’s a (quick) slide animation with scrolling in Tofu which helps maintain the impression of a single continuous surface, but there are no gratuitous animated flipping page corners.
- omaranto 16y ago
  I certainly see the value in Tofu for a large screen, but on my iPod I'd only want one column (so Tofu-style reading degenerates to pagination). My question is whether on an iPad sized screen Tofuness would be convenient. What do you think?
  - jacobolus 16y ago
    I think an iPad screen would be great for 2 columns (in portrait mode) or 3 columns (in landscape mode) of a Tofu-like reader. But I don’t have an iPad so I can’t tell you for sure. What I can tell you is that on my 12" PowerBook (1024x768) I used to set Tofu up with 3 columns filling the screen, and on my 13" MBP (1280x800) I set it up with 4 columns filling the screen – of 14px Myriad as the font – and it works fantastically.
- nazgulnarsil 16y ago
  this is an amazing usability hack of the internet.
- repsilat 16y ago
  Would it be going too far to make an "infinite" 2D column layout? Essentially like Tofu, but allowing the user to scroll up and down as well if they want to keep reading down a column instead of going up to the next one. Scrolling one page down is isomorphic to scrolling one column to the right. Might be nice for user freedom, but the added freedom might detract from user experience. Moreover, you'd have to have some fancy logic behind text reflowing etc to make it work with font size changes.
- joe_the_user 16y ago
  To me, tofu looks horripical... But maybe that's just me.. but the thought of text just sliding out from the right makes mu skin crawl... (And I have used 3-column interfaces previously - remember the old IHT interface?) But I'm saying this to highlight the larger point that everyone has their preference, it probably has a relation to biology or bodily reflexes or habits or something. I suspect that the ability to customize appropriately will become valuable over time (with a wave of appropriate customizations appearing only after the earlier wave of arbitrary-features-created-by-software-developers recedes).
tjpick 16y ago
infinite scroll is mystery meat anyway. It breaks the standard affordance of the scroll bar -- that the length of the scroll bar reflects the total length of the page. One of those cases where trying to get clever just results in frustrated users (me) because of unexpectedly changing an interaction that otherwise would be taken for granted.
- jacobolus 16y ago
  By “infinite scroll” the author is just talking about every normal web page (e.g. some Wikipedia article), not about the (indeed, potentially confusing) case where a site loads extra content using Ajax every time the reader approaches the bottom of the page.
  - tjpick 16y ago
    ah right. Never seen "infinite scroll" used to mean normal scrolling [arguably "finite" not that I'd actually bother calling it that.] That threw me off.
minalecs 16y ago
I'm on the side of less eye candy more speed. I see the page flip as nothing more than eye candy, and would rather do without it.
abhaga 16y ago
But with infinite scroll, how does the "flipping between 1 column and 2 columns on the go" work? Do we read down the left column and then go up to the right? And how do we know where we are if we switch back to 1 column. Of course, we can simply drop the facility to switch but I am curious if the two can work together in a usable way.
naner 16y ago
I came to a similar conclusion, but I think the flip always looks and feels a little off. I prefer the page slide like the NYTimes website optimized for Chrome. Not a continuous slide, but a slide from one page to the next.
joe_the_user 16y ago
Even on a phone, I suspect the interface and the content need to be in harmony so generalizations like this are a bit excessive. And moreover, just about thing you view on the phone will be something people also view in another way - as a website or a paper magazine. It's aesthetically and economically justifiable to have the two-plus views be in something like harmony. Facebook's infinite scroll on the website seems clunky, yet it's somewhat logical to have a relation between website and iPhone app.
armandososa 16y ago
Alas, I was expecting hard data to support his statement, rather than a mere opinion. I prefer Stanza over iBooks precisely because I hate page flips.
comex 16y ago
Pagination is definitely better than manual scrolling, but I find iBooks' animation too visually fancy. The Kindle iPad app is better: it just slides the new page in.
yason 16y ago
I generally like page flips, like reading a PDF page by page instead of scrolling continuously. But the downside is that generally page-flipping is coupled with fixed layout. And usually there's too much text on a single page, making the font absurdly small. The good side about scrolling is that I can choose whatever font size I want and the page just grows as necessary while I can still scroll up and down. On the other hand it's a bit more difficult to locate yourself or jump around in a big chunk of scrolling text. PgDn/PgUp is a kind of a page flip but usability-wise it's better to have a bit of margin on top and bottom, just like on a real paper page. Then you know where the page ends and where the next page begins, and you don't have to scan the lines to see if the browser scrolled 100% or left 3 lines visible from the previous position or what. I think I would like best a solution where the content is paginated but it would be dynamically fitted onto a page whose size is the browser window size. It would only fit as much text of proper size on one page that nicely fits there. If I use a big font, then it's 20 lines; if I use a small font, it's 40 lines. But I would still get pages, maybe fewer or more. A page would have proper margins and I could reason about navigating back to something I read "ten pages ago".

41 points by alexkon 16y ago

By far my favorite way to read content on a screen is using Tofu http://amarsagoo.info/tofu/ http://amarsagoo.info/tofu/ which presents columns (of user-preferred width, font, hyphenation & justification, and leading) of text, and then scrolls column-by-column left and right. It’s especially nice when two or more people are trying to read from the same screen, because occasional scrolling of a whole column directly horizontally is much less disruptive than arbitrary amounts of scrolling down a page. On wide computer displays, it is a significantly better use of screen real estate than single-column web pages, which should stick to a measure (width) of not much more than about 60 characters to be readable. Anything longer than a page or two that I plan to read on a screen gets copied and pasted into Tofu. Edit: note that there’s a (quick) slide animation with scrolling in Tofu which helps maintain the impression of a single continuous surface, but there are no gratuitous animated flipping page corners.

omaranto 16y ago
I certainly see the value in Tofu for a large screen, but on my iPod I'd only want one column (so Tofu-style reading degenerates to pagination). My question is whether on an iPad sized screen Tofuness would be convenient. What do you think?
- jacobolus 16y ago
  I think an iPad screen would be great for 2 columns (in portrait mode) or 3 columns (in landscape mode) of a Tofu-like reader. But I don’t have an iPad so I can’t tell you for sure. What I can tell you is that on my 12" PowerBook (1024x768) I used to set Tofu up with 3 columns filling the screen, and on my 13" MBP (1280x800) I set it up with 4 columns filling the screen – of 14px Myriad as the font – and it works fantastically.
nazgulnarsil 16y ago
this is an amazing usability hack of the internet.
repsilat 16y ago
Would it be going too far to make an "infinite" 2D column layout? Essentially like Tofu, but allowing the user to scroll up and down as well if they want to keep reading down a column instead of going up to the next one. Scrolling one page down is isomorphic to scrolling one column to the right. Might be nice for user freedom, but the added freedom might detract from user experience. Moreover, you'd have to have some fancy logic behind text reflowing etc to make it work with font size changes.
joe_the_user 16y ago
To me, tofu looks horripical... But maybe that's just me.. but the thought of text just sliding out from the right makes mu skin crawl... (And I have used 3-column interfaces previously - remember the old IHT interface?) But I'm saying this to highlight the larger point that everyone has their preference, it probably has a relation to biology or bodily reflexes or habits or something. I suspect that the ability to customize appropriately will become valuable over time (with a wave of appropriate customizations appearing only after the earlier wave of arbitrary-features-created-by-software-developers recedes).

tjpick 16y ago

infinite scroll is mystery meat anyway. It breaks the standard affordance of the scroll bar -- that the length of the scroll bar reflects the total length of the page. One of those cases where trying to get clever just results in frustrated users (me) because of unexpectedly changing an interaction that otherwise would be taken for granted.

jacobolus 16y ago
By “infinite scroll” the author is just talking about every normal web page (e.g. some Wikipedia article), not about the (indeed, potentially confusing) case where a site loads extra content using Ajax every time the reader approaches the bottom of the page.
- tjpick 16y ago
  ah right. Never seen "infinite scroll" used to mean normal scrolling [arguably "finite" not that I'd actually bother calling it that.] That threw me off.

minalecs 16y ago

I'm on the side of less eye candy more speed. I see the page flip as nothing more than eye candy, and would rather do without it.

abhaga 16y ago

But with infinite scroll, how does the "flipping between 1 column and 2 columns on the go" work? Do we read down the left column and then go up to the right? And how do we know where we are if we switch back to 1 column. Of course, we can simply drop the facility to switch but I am curious if the two can work together in a usable way.

naner 16y ago

I came to a similar conclusion, but I think the flip always looks and feels a little off. I prefer the page slide like the NYTimes website optimized for Chrome. Not a continuous slide, but a slide from one page to the next.

joe_the_user 16y ago

Even on a phone, I suspect the interface and the content need to be in harmony so generalizations like this are a bit excessive. And moreover, just about thing you view on the phone will be something people also view in another way - as a website or a paper magazine. It's aesthetically and economically justifiable to have the two-plus views be in something like harmony. Facebook's infinite scroll on the website seems clunky, yet it's somewhat logical to have a relation between website and iPhone app.

armandososa 16y ago

Alas, I was expecting hard data to support his statement, rather than a mere opinion. I prefer Stanza over iBooks precisely because I hate page flips.

comex 16y ago

Pagination is definitely better than manual scrolling, but I find iBooks' animation too visually fancy. The Kindle iPad app is better: it just slides the new page in.

yason 16y ago

I generally like page flips, like reading a PDF page by page instead of scrolling continuously. But the downside is that generally page-flipping is coupled with fixed layout. And usually there's too much text on a single page, making the font absurdly small. The good side about scrolling is that I can choose whatever font size I want and the page just grows as necessary while I can still scroll up and down. On the other hand it's a bit more difficult to locate yourself or jump around in a big chunk of scrolling text. PgDn/PgUp is a kind of a page flip but usability-wise it's better to have a bit of margin on top and bottom, just like on a real paper page. Then you know where the page ends and where the next page begins, and you don't have to scan the lines to see if the browser scrolled 100% or left 3 lines visible from the previous position or what. I think I would like best a solution where the content is paginated but it would be dynamically fitted onto a page whose size is the browser window size. It would only fit as much text of proper size on one page that nicely fits there. If I use a big font, then it's 20 lines; if I use a small font, it's 40 lines. But I would still get pages, maybe fewer or more. A page would have proper margins and I could reason about navigating back to something I read "ten pages ago".