Why Infinite Scrolling is probably a bad idea (2015)
medium.com
medium.com
Certain applications do more resemble television watching, where there's way more content than you could ever fit into a processable queue. Instagram, for instance. What I want there is for pics I've seen to get marked as seen and not come up again. Here infinite scroll makes sense.
Another interesting example in this space is Tinder. I'd like an Instagram-like experience for Tinder. Instead of having to swipe to see a new pic, I should just be able to scroll, and already-seen pics are treated the way left-swipes are.
I do agree with many of the other arguments though, especially bookmarking/history.
Also, given how fast you can scroll back to the beginning, I don't buy the DOM-replacing technique. I've never seen it working on the desktop website.
While this technique does save on immediate memory consumption, I am sure that maintaining the stack still causes eventual slow downs.
The increased adoption of ad blockers happened for a similar disrespect for the user -- and an over-embrace of "baiting"
Infinite scroll on a mobile device makes perfect sense.
I am also more likely to open tabs on my desktop than on my phone because it's more complicated to switch to the newly opened tab in Chrome.
Precisely correct. Like you, on my desktop, I counter the user interface deficiencies of infinite scrolling by opening links in new tabs. This prevents the very real and very annoying problem of not being able to return to the infinitely-scrolling list view at the position I left it. Tabs prevent that loss of page context.
On a mobile device, tab-based workarounds are possible but more cumbersome, so I usually choose to open one item from the infinite scrolling list traditionally. If when I return via the back button, context is lost, I usually concede defeat by this bad user interface paradigm and leave the site.
Tumblr refuses to load the `next page`, and I don't want to hit the refresh keystroke combination because I really really don't want to go back to the top of the "page". I simply want the "next page" to load correctly.
No matter how bad it is: Either the problem is wider or there is a benefit.
A wider problem would be tying people to services with annoyances and playing on addictive behavior.
A Benefit would be an undisturbed flow of skimming over content or using the edge of the screen as a reading aid (I hate it, when I scroll down one screen on HN and the site bottoms out. I than need to find until where I read and where the previously unseen content begins¹).
¹ ok, might need to write an extention for a red line fading away after you skipped a page :). A bit like the "read until here" lines in irc clients.
You state "either the problem is wider, or there is a benefit". There are other options. The possibility, say, that infinite scroll (plus crappy filtering) feeds into psychological dysfunctions such as FOMO.
That optimises for keeping-users-on-site, but may well (and I'd argue doesn't) optimise for user satisfaction, utility, or ultimately, satisfaction.
As Clay Shirky says, it's not information overload, it's filter failure. The slogan of the old nn Usenet reader was "no news is good news". A stream full of crap isn't a good thing. A stream with an occasional flow of gems is far better.
I've suggested datelines (to tell when entries were added), read/unread indicators, and introducing of other-than-alread-seen content into streams. I've yet to see any of these adopted.
To avoid a custom solution for HN i need to experiment on how demanding it is to add scroll listeners to every div on a page...
If it's something mainly images, like tumblr, I'd be much happier actively paging through than forcing my phone, or even my desktop, to load GBs of images I'm skipping past.
Google+ and FB become unusable (and the browser you visit them in) if you go down too far, so it's not just a bad idea, it's basically breaking.
This UX pattern does have benefits for the user. It has a low cognitive load with very little friction to show more items. All the UX challenges he calls out are solvable.
In addition, this has been solved on the desktop. File browsers and Media players with large collections already do this well. The challenge is building a great scrolling experience on the web.
I've seen many folks try to solve this with a repeater control and they quickly find out that there's a long way to go to get something with great performance. What's really needed to solve the problem is UI & data virtualization, which is something that native app developers have a lot more experience with.
None of the issues he cites are insurmountable.
Have you seen this approach used, is it a reasonable compromise, what problems remain?
Is there a standard approach to release memory from items at the beginning of the scroll when they're far off screen?
If your page eats memory, needs finer analytics, and doesn't comply with bookmarking and back button functionality, don't do it. But good infinite scroll pages solve this.
Choice paralysis and scrollbar issues seems less relevant, because having 100 pages can be just as paralyzing and the scrollbar is a non-issue with wheels and touch.
As for the last point he makes, being harder to use, the entire list applies to any paginated page also.
Google Images is a good infinite scroll page. Content opens inline, you're engaged in a visually seeking task where anything beyond looking would be distracting, and the page does tap-off (cop out?) at a certain point so that it isn't too infinite. Though you can "load more", at that point you are given the opportunity to rethink your search criteria, and that speed bump is practical.
Yes, let's just completely dismiss the concerns of people whose preferred way to move up and down in a web page is to grab the slider with their mouse or stylus. Everyone is perfectly able to curl their fingers around a little pod that makes them put their wrist into a position that can cause strain on the tendons and make lost of tiny, precise movements with it. Nobody has any RSI issues.
- signed, a lady who uses her Wacom tablet instead of a mouse for all of her desktop computing after her index finger decided it refused to double-click without pain.
I sympathize with any health issues, but to be fair, if we were discussing accessibility then RSI is just the beginning.
Also, maybe you're not able to use it, but most Wacom pens have options to allow scrolling by just clicking and dragging, making the scrollbar a non-issue. The scrollbar has never been the most convenient of interfaces.
Iterators aka cursors are the other option.
Some of the issues listed in the article (memory consumption) can be addressed through hacks (keeping the current and 1-2 higher or lower screens resident, flushing others). Some (footer unusability) are real problems -- I've largely concluded that sidebars are an anti-pattern for virtually all textual content (hence my use of Reader Mode or Pocket for such content).
More often, though, I view a scroll or list as a set of potentially interesting candidates that I want to further winnow down. The lack of ability to do so in far too many contexts simply boggles me.
Not just Facebook (which I don't use), or G+ (which I do when Google aren't overtly backing antidemocratic anti-equality measures such as the TTP and TTIP -- oh, Facebook and Apple do too), or Reddit. But, say, shoping sites.
I hop onto Amazon and am interested in, say, laptops. Or cords. Or pens. Or chairs. And am presented with, in response to a reasonable search for that term:
1. A great many items which are in no way, shape, or form, laptops. Or cords. Or pens. Or chairs.
2. Items far, far outside my price range.
3. Vendors whom I will not, ever, under any circumstances, purchase from.
Etc.
If I were in an actual full-service store, I'd indicate my preferences to the salesclerk, and, if they were in the least worth their salt, they would remove the offending items and not present them again. (And if they refused to do so, I'd simply leave.) For all its vaunted capabilities, online selection doesn't do this.
For content, I compare a stream with an offering of, say, publications, authors, topics, and quality-of-writing. In a physical stack, again, I could eliminate publishers, authors or reporters, genres, publication dates, etc., to get to specifically what I want. But online:
1. Reddit doesn't allow me to filter by total quality of a post or discussion. (The fact that its moderation system makes such filtering all-but-useless is another problem).
2. Google+ doesn't have author, topic, negative match (e.g., term exclusion, say, -trump or -kardashian), or date selection in its searches.
3. Amazon doesn't allow filtering within merchandise categories for matching vs. nonmatching items. Say, stationary items which aren't pens, or clothing items which aren't slacks.
None of these tools allows me to select a specific match and indicate "go away" with some level of prejudice: don't show me this item, don't show me this author, now, or forever, etc.
I've got hugely more utility with a pile of books or articles sitting on a table.
Yeah: scrolls are lazy-ass cheap copouts to psychologically hook users (the ones who aren't immediately pissed off and run like hell), and to avoid both useful filtering and the necessary deep content classifications required for actually beneficial content selection.
I came to think that an actually useful, really pro-user ("user-friendly"?) interface for the sites you listed would generally be a very thin UI over a query language. So to use your example, when I visit Amazon, what I really want to do is something like this:
SELECT * FROM products WHERE category="stationery"
AND tags NOT LIKE "%pens%
AND price BETWEEN (20, 200)
AND vendor NOT IN [my blacklist, fetched from the profile]
ORDER BY price ASC
LIMIT 100;
Now this interface would be infinitely more useful than what most of e-commerce & social networking sites have, it would be much easier to do than what they have - but here's the kicker. They don't want that. It's not in their interest to make an useful tool, because they get to make less money this way.
And speaking of social media and usefulness, Facebook got close to my ideal a while ago. You could do almost SQL-like selects when searching for content. But this function, known as Graph Search, is gone now. Probably because some people called it "creepy". I guess everything even remotely distinguishing your product from a TV program is now "creepy".
The other, though is that the coding, presentation, and awareness of what's offered is utterly shite.
Amazon quite literally has no fucking clue what the hell it's selling. And it's among the better sites. Craigslist is even more abysmal -- I was searching for a specific type of chair some time back and found myself presented with anything from that (rarely) to hammocks to porches.
Whether it's quality control over item descriptions, or AI to sort out what things are, or collaborative filtering, or nominated expert filtering, or whatever, better data over what's actually represented by systems is also required.
For articles and textual content, author, authority, and various other metadata need stronger control. I see a Web in which such information being accurately presented as crucial to search results placement helping, possibly.
Yep, so just put it in the fixed sidebar.
> 2. Performance degrades
Not really, if you've developed this the right way - which is render only items that are currently visible and derender the ones that are above the current scroll canvas.
> 3. Analytics is harder to implement
> 4. Bookmarking and the back button become problematic
I put those together, because they are relevant. Anyway Google suggest how to remove this [1] and even presents a demo [2]
1 : https://webmasters.googleblog.com/2014/02/infinite-scroll-se... 2 : http://scrollsample.appspot.com
> 5. People may suffer from choice paralysis
As other people here suggested, this depends on the content. If you work in e-commerce there is quite a habit people to scroll infinitely with a huge amount of products ( disclaimer - I'm the sole developer of `www.bagaholic.me` - bags price comparison website ).
> 6. The scrollbar becomes unusable and untrustworthy
Not a significant reason at all. Twitter, Pinterest, Facebook proved that.
> 7. It’s generally hard to use
I think stating that, without some stats is kinda "opinionated". Again based on the content a valid context with fixed sidebar, header is a must.
>1) Yep, so just put it in the fixed sidebar.
Who said the site has a fixed sidebar? Why create a design that necessitates one?
>Not really, if you've developed this the right way - which is render only items that are currently visible and derender the ones that are above the current scroll canvas.
So change the list constantly under the user, and thus the scrollbar and relevant position. Plus, the extra coding complexity, and what for?
>5) As other people here suggested, this depends on the content. If you work in e-commerce there is quite a habit people to scroll infinitely with a huge amount of products
Even in commerce, choice paralysis is a thing, regardless of if people tend to "scroll infinitely" if they are shown a huge amount of products. That they scroll doesn't mean they don't feel the choice paralysis.
>6. The scrollbar becomes unusable and untrustworthy
FB wants to be immersive and keep you lost deep inside to show you ads, not to do what's best for usability.
I mostly agree with the article, but it's crazy to say any one design solution is universally good/bad. There are good and bad ways to implement just about anything.
Because a footer, like a header, are staples of web design since day one, and work well as anchors that the user knows and expects to find at the top and bottom of the page.
They also leave all other (layout) options open.
Whereas a sidebar for example, while good in some situations, it prevents e.g. to have full side-to-side images and other such content, or distracts from the main text when reading long form, etc.
"Footers" (or related things like captions) exist in just about every design, and they almost always function the same. Art galleries have plaques. Books have footnotes. Food packaging has nutritional info. If your design doesn't have a footer, then it's probably a mistake.
I think the article's point would stick a little better though if the author focused more on the implementation than on the ∞scroll itself, since it's inconsistency across user experiences that causes frustration with ∞scroll, not so much ∞scroll itself. The only reliable constant across implementations of ∞scroll is that you'll be able to continually scroll; how it interacts with static content on the page, how it interacts with the back-button, and so on depends completely on how well it's implemented. It is very frustrating to come across sites where you follow a link far down in the page and hit back, only to be taken to the very top of the list and having to scroll and reload everything again. It's not even so much a performance issue; my old iPhone4s handles most ∞scroll just fine, but it's still just frustrating to go through pages and pages of scrolling because hitting Back didn't return me to where I was. This is particularly bad on mobile where fat-fingering links is pretty easy/common.
Edit: not sure why you're getting down voted - I think your comments are fine and worth discussion; I also think they're wrong, but that's the point of discussion...
Twitter, Pinterest, Facebook and Discourse ignored that. They didn't prove it wasn't significant to their users, they just don't care.
This way the browser's "find" feature doesn't work at all. Are you going to implement your own "find" feature too?