Home > Usability, Web usability > Why I Don’t Like Infinite Scrolling

Why I Don’t Like Infinite Scrolling

May 31, 2014

Infinite scrolling, a somewhat recent trend in Web design, is a technique in which long lists of items, rather than being broken into separate pages, are loaded a few at a time via AJAX and appended to the current page. If you’re not familiar with it, you can find more information in a Smashing Magazine article by Yogev Ahuvia: “Infinite Scrolling: Let’s Get To The Bottom Of This.” Ahuvia tries to present a balanced look at the strengths and weaknesses of the technique, but it seems that there are more cons than pros. The comments are overwhelmingly negative.

In addition to Ahuvia’s piece, Hoa Langer’s “Infinite Scrolling is Not for Every Website” says that infinite scrolling “plays a nasty trick” because it “breaks the scrollbar,” and concludes that the technique is “not the answer for most websites.” Dan Nguyen and Dmitry Fadeyev both write about how infinite scrolling didn’t work when Etsy tried using it for search results. There’s even an xkcd cartoon. 

I’ll admit to being a bit biased in my selections, but I haven’t seen nearly as much praise for the technique as I have criticism of it. This doesn’t surprise me. Personally, I don’t like infinite scrolling at all. It doesn’t seem to be solving a real problem, at least as far as I can tell, but it certainly causes problems.

The problem that most often affects me personally is the jerking effect that occurs when I try to scroll by clicking-and-dragging the scrollbar. When there’s not a lot of content loaded, the sliding portion (called the “thumb” if the Wikipedia article is to be believed) is fairly tall. As more content loads, not only does the thumb shrink, but the point on the scrollbar representing where I was also moves out from under the pointer. As soon as I move the mouse again, the thumb jumps toward the pointer and the viewport winds up somewhere I didn’t expect. It’s very disorienting.

I’ve noticed that this isn’t exactly the behavior I’ve been encountering lately. Instead, on occasion, I find that my mouse pointer is below the scrollbar’s slider, but it still moves with the mouse, not unlike the way it continues to move even when the mouse slides off it to the left or right. Unfortunately, in my experience, this doesn’t stop the page from jumping around a bit when the new content first loads. Consequently, I still lose my place even if the viewport does end up in more or less the same spot. I’m not sure if there’s a script that fixes it, or if browser vendors have made efforts to accommodate infinite scrolling; Benjamin Milde mentions in a comment on Ahuvia’s article that he sees the above behavior in Firefox but not Chrome, so maybe that’s it.

One especially annoying situation occurs when infinite scrolling is implemented on a page that has a footer. There is something at the bottom of the page, but the user can’t actually read it, because as soon as it’s scrolled into view, it gets pushed back off-screen by the newly-loaded content. Making sure there’s nothing under the infinitely-scrollable column might seem obvious enough, but it does get overlooked every now and then. MorgueFile, for instance, has this problem.

In fact, according to Ahuvia, even Facebook did this (at least at the time that article was written). As I look at Facebook now, it seems like there’s a quasi-footer at the bottom of the right-hand column, but it doesn’t have nearly as many links as the footer in Ahuvia’s screen shot. As far as I can tell, Facebook doesn’t have the footer at all anymore; after several minutes, I gave up on trying to reach the point when Facebook refuses to load any more posts on the news feed, so I can’t say that for sure.

Another issue is that infinite scrolling automatically loads content in response to an action, namely scrolling, that normally doesn’t prompt that action. It’s bad enough that the page is taking action without the user’s permission, but downloading additional content in such a fashion can a problem for people who have slow connections or data caps. Whether this is a serious problem depends on what’s being loaded. Another handful of DuckDuckGo search results won’t hurt much, but another couple dozen Google Image Search results may be a problem. Anyway, I think users would like to decide for themselves how much whittling away at their data allowances is acceptable.

Finally, infinite scrolling tends to create a continuous stream of content with no end in sight. This problem is not unique to infinite scrolling: Some pages on deviantArt (but not others) have back/next buttons but no way to jump to specific pages and no indication of how many pages there are in total or which page is the current one. Neither is it impossible for an infinitely scrolling page to avoid this problem: Discourse, an open-source forum project that uses infinite scrolling, solves it with a floating box indicating the post currently being viewed and the total number of posts in the thread.

It’s worth noting that infinite scrolling (without an indicator like Discourse’s) is often used for things like social network posts and search results for which people frequently don’t care about being able to keep their place; indeed, keeping “a place” in such contexts is often meaningless, because what’s on “page 5" of 10,123” today might be on “page 120 of 11,050” tomorrow as new content is posted and sort algorithms are adjusted. On the other hand, even if the association of a certain page number to certain results is ephemeral, it can still be useful for users returning to the result list using the Back button. Besides, I prefer to be able to decide for myself whether I need pagination.

One thing that would solve most of my complaints would be the solution that deviantArt uses (in addition to optionally switching to back/next buttons): Instead of loading more content as soon as the bottom of the page is scrolled into view, the page displays a “Show more” button. This adds a bit of friction to the process of loading more content, but it also puts control back in the user’s hands. It still has the potential to break the things that AJAX in general breaks, such as the back button and the ability to bookmark or share URLs (especially when sharing with non-Javascript users), but so does infinite scrolling, and in either case these problems already have solutions in widespread use.

For that matter, simply using AJAX to implement pagination would solve the problems as well, not add much more friction than the “Show more” button, and not lack much of anything that infinite scrolling offers except the ability to return to previous pages just by scrolling up. A hybrid design could potentially address even that issue, if the feature turns out to be really necessary to some application.

To be honest, I just don’t see an advantage to infinite scrolling. There may be a few minor benefits, but there are other ways to get them, and they don’t justify the high cost of usability. As far as I’m concerned, infinite scrolling is a bad idea and it should probably be avoided.

%d bloggers like this: