Menu Search
Jump to the content X X
Smashing Conf San Francisco

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf San Francisco, dedicated to smart front-end techniques and design patterns.

Infinite Scrolling: Let’s Get To The Bottom Of This

Infinite scrolling promises a better experience for users. However, the good is often accompanied by the bad and the ugly. Once we understand the strengths and weaknesses of infinite scrolling, we can begin to use it to enhance our interfaces.

Human nature demands hierarchy and structures that are easy to navigate. But infinite scrolling sometimes leaves users feeling disoriented as they travel down a page that never ends.

Further reading on Smashing: Link

The NeverEnding Scroll6

The Good Link

Long lists are not new, but the way in which we scroll these lists has fundamentally changed since the arrival of mobile interfaces. Due to the narrowness of mobile screens, list items are arranged vertically, requiring frequent scrolling.

Infinite scrolling is highly trending7 as an interaction behavior on pages and lists. The basic functionality is that, as the user scrolls through content, more content is loaded automatically. With the popularity of social media, massive amounts of data are being consumed; infinite scrolling offers an efficient way to browse that ocean of information, without having to wait for pages to preload. Rather, the user enjoys a truly responsive experience, whatever device they’re using.

Pagination vs. Infinite Scroll8
Pagination versus infinite scrolling (Large version9)

Websites with lots of user-generated content today are using infinite scrolling to handle content that is being generated every second. By unspoken agreement, users are aware that they won’t get to see everything on these websites, because the content is updated too frequently. With infinite scrolling, social websites are doing their best to expose as much information as possible to the user.

Twitter10 integrates infinite scrolling effectively. Its feed fits the criteria: a large amount of data (tweets) and a real-time platform. From the perspective of the user, all tweets are equally relevant, meaning that they have the same potential to be interesting or uninteresting; so, users will often scroll through all of the tweets in their feed. Being a real-time platform, Twitter is constantly being updated, even if the user leaves their feed unattended. Infinite scrolling seems to have been created especially for websites like Twitter, which successfully employs the technology.

Infinite scrolling appears to have found its niche on the Web. However, there are also drawbacks that must be considered before assessing its value.

The Bad And The Ugly Link

With so much data to browse, users must stay focused on the information they are searching for. (Remember about being goal-oriented?) Do users always want a never-ending stream of data? Analytics show that when users search for information on Google, only 6%11 advance to the second page. So, 94% of users are satisfied with receiving only 10 results, which suggests that users find Google’s ranking of results to be relevant.

To Click or Not to Click Link

Google has implemented infinite scrolling for image search results but has yet to implement12 it for its general results. Doing so would eliminate the need for users to click to reach the second page. Google will probably maintain pagination because this pattern is quite symbolic for its brand. If it does switch to infinite scrolling, when would users typically stop scrolling? After 20 results? 50? When does an easy browsing experience become more complicated?

Looking for the best search result could take a second or an hour, depending on your research. But when you decide to stop searching in Google’s current format, you know the exact number of search results. You can make an informed decision about where to stop or how many results to peruse because you know where the end is. According to studies13 conducted in the field of human-computer interaction, reaching an end point provides a sense of control; you know that you have received all relevant results, and you know whether the one you are looking for is there or not. Knowing the number of results available provides a sense of control and helps the user make a more informed decision, rather than be left to scour an infinitely scrolling list.

Pagination: The Click Barrier14
Pagination is a barrier of clicks. (Large version15)

When items are distributed across Web pages, they are framed and indexed and have a start and end point. The information is presented clearly and orderly. If we select an item from a paginated list and are taken from that page, we know that clicking “Back” will return us to that page (probably to the same scroll position). Our Web search will continue right where it left off.

If you scroll the same list of results with infinite scrolling, you are left without that sense of control because you are scrolling through a list that is conceptually infinite. Let’s say you count yourself among the 94% who stop reading after the first page (i.e. 10 results) of a Google search. When the list scrolls infinitely, there is essentially no end to the first page. Rather than look for the end of the page, which doesn’t exist anyway, you decide to stop scrolling at the 10th item. This poses a problem with infinite scrolling, because the 11th item is directly in sight. With a paginated list, on which you wouldn’t see the 11th result, deciding not to continue browsing is easier. However, when the next results are already there16, you’d probably just keep on scrolling and scrolling.

As Dmitry Fadeyev points out:

“People will want to go back to the list of search results to check out the items they’ve just seen, comparing them to what else they’ve discovered somewhere else down the list. Having a paginated interface lets the user keep a mental location of the item. They may not necessarily know the exact page number, but they will remember roughly what it was, and the paginated links will let them get there easier.

Not only does the infinite scroll break this dynamic, it also makes it difficult to move up and down the list, especially when you return to the page at another time and find yourself back at the top, being forced to scroll down the list once again and wait for the results to load. In this way the infinite scroll interface is actually slower than the paginated one.”

— Dmitry Fadeyev, When Infinite Scroll Doesn’t Work17

When Infinite Scrolling Fails Link

The best companies are constantly testing18 and studying19 new interactions with their users. Increasing numbers of these studies are showing that infinite scrolling does not resonate20 with users if it does not support their goal on the website.

Temptation Link

When you’re looking for that perfect search result and are tempted to continue scrolling into a wasteland of irrelevant results, time is wasted. Chances are that the best result will appear in the first 10 items. Therefore, infinite scrolling merely tempts you21 to continue reading, wasting time and decreasing productivity in the process.

Optimism Link

Even more annoying is that scroll bars do not reflect the actual amount of data available. You’ll scroll down happily assuming you are close to the bottom, which by itself tempts you to scroll that little bit more, only to find that the results have just doubled by the time you get there.

Exhaustion Link

Infinite scrolling overwhelms users with stimuli. Like playing a game that you can never win, no matter how far you scroll, you feel like you’ll never get to the end. The combination of temptation and optimism play a big role in exhausting the user.

Pogosticking Link

Infinite scrolling often causes your position on the page to get lost. “Pogosticking” happens when you click away from an infinitely scrolling list and, when you return by clicking “Back,” are brought to the top of the previous page, instead of to the point where you left off. This happens because the scroll position is lost when you navigate away from an infinitely scrolling page, forcing you to scroll back down each time.

Loss of Control Link

Infinite scrolling leaves you with the feeling that you might be missing out on information. You continue scrolling because the results are right there, but you feel overwhelmed because you’re losing control over the amount of data being shown. There is something nice about defined pages on which the amount of content is quantified, where you can comfortably choose whether to click to view more or to stop. With infinite scrolling, you don’t have control over the amount of data on the page, which becomes overwhelming.

Distracting Link

Etsy22, an e-commerce marketplace, implemented infinite scrolling, only to find that it led to fewer clicks23 from its users. Infinite scrolling was unsuccessful because users felt lost in the data and had difficulty sorting between relevant and irrelevant information. While infinite scrolling provided faster and more results, users were less willing24 to click on them, defeating its very purpose.

Etsy's Home Page25
Etsy’s home page (Large version26)

Unreachable Link

Have you tried reaching the footer of Facebook lately? The footer block exists below the news feed, but because the feed scrolls infinitely, more data gets loaded as soon as you reach the bottom, pushing the footer out of view every time. Footers exist for a reason: they contain content that the user sometimes needs. In Facebook’s case, the user can’t reach it. The links are repeated elsewhere but are harder to find. Infinite scrolling impedes the user by making important information inaccessible.

Facebook auto-loading News Feed and the unreachable footer27
Facebook’s auto-loading news feed makes the footer unreachable. (Large version28)

Footers serve as a last resort. If users can’t find something or they have questions or want more information or explanation, they often go there. If they don’t find it there, they might leave the website altogether. Companies that implement infinite scrolling should either make the footer accessible by making it sticky29 or relocate the links to a sidebar.

Not Exclusive Link

Pinterest30 does not have a footer at all, which makes sense given the problem we just saw with Facebook. Through infinite scrolling, Pinterest emphasizes its profusion of data, an endless sea of inspiration taken from all over the Web.

Pinterest Ocean of Pins31
Pinterest’s ocean of pins (Large version32)

Images are faster and easier to scroll than text, so Pinterest and Google Images succeed with infinite scrolling to an extent. However, billions of images33 are on the Web, and users would prefer to see only the best of them. There is something to be said for exclusivity, which seems to be lacking in Pinterest’s layout.

Limiting the number of images on Pinterest’s home page, with an “Editor’s picks” or “Most popular” list, might make the website more appealing. How exclusive can a pin be when a ton of other similar pins are next to it?

Pinterest’s tactic of using infinite scrolling for its plethora of data suffers because it overwhelms users. The collection looks bottomless, but its immensity is somewhat daunting, and browsing it might seem a waste of time. Ultimately, Pinterest is trying to expose users to infinite inspiration, but that actually undermines the human need for control34. The amount of data becomes intimidating, and users are left with mixed feelings.

When Usability Wins Link

As mentioned earlier, Twitter integrates infinite scrolling effectively. The user sees an infinitely growing list of tweets and can comfortably click on a tweet to expand it in place, preventing the page from refreshing and, as a result, maintaining their scroll position.

Twitter's torn feed35
Twitter’s torn feed (Large version36)

On its mobile version, Twitter even adds a “torn paper” marker, indicating to the user where to resume reading. This subtle and simple solution enables the user to scroll up and down the list, while having a recognizable point to return to. Psychologically, that marker reassures the reader by dividing read and unread content. Such markers give the user a sense of control and a better perception of the content’s depth and how far they’ve gotten into it.

Twitter is not the only one. Discourse37, an emerging discussion platform, also has infinite scrolling that empowers the user. The company considered the importance of infinite scrolling to its user experience and implemented an intriguing and unique progress indicator. The indicator appears when needed and remains in view (without interfering) while the user reads the content. The indicator numbers the item currently being viewed out of the total number of items. This is a great way to make the user feel in control, even with a lot of data.

Smart progress indicator on Discourse.com38
The smart progress indicator on Discourse (Large version39)

Go Hybrid Link

A hybrid of infinite scrolling and pagination is also a good option in many cases. With this solution, you would show a “load more” button at the end of a preloaded list, which, when clicked, loads another batch of items onto the list. The same behavior that infinite scroll does automatically, this button does on demand. The interface gains some of the advantages of infinite scrolling, without some of its drawbacks.

Because infinite scrolling requires the website to fetch so much content, the hybrid solution is used at times to control the data load. In Facebook’s news feed and Google’s image search, the infinite scrolling is automatic at first but becomes on-demand once a certain number of items have loaded. This maintains the interface while limiting the load on the server.

Hybrid Infinite Pagination on Google Images40
Hybrid infinite pagination on Google Images (Large version41)

Infinite Pages Link

Infinite pages42 take the concept of infinite scrolling to a new level. Websites that employ this concept are “one-pagers.” To remove the barrier of clicking to the next page, the designer turns the entire website into one long scrollable page. Examples are Unfold43 and Lost World’s Fairs44.

On these one-page websites, the sections are spread vertically, one after another. This makes the whole website less comprehensible — hence, less accessible. These websites might not have infinite scrolling, but the user might still have that feeling of a never-ending page.

On infinite pages, the height of each section will vary according to its contents. Although the approach can make for some creative interactions, it can leave users disoriented and unsure where to scroll for the next piece of information. The scroll bar is hidden on many such pages, leaving users feeling lost as they unconsciously look for the scroll position45 to track their progress. Hidden scroll bars deprive users of that chance for rescue. Users shouldn’t be left helpless; the interface should clearly show them how to navigate the page.

Infinite Page
Not knowing where they stand can leave the users disoriented.

UX engineers need to take extra care when designing infinite pages. They must take into account accessibility; tell users where they stand by showing the length of the page and how much they’ve viewed. Solutions could include a fixed menu, a map of the page46 or a scroll progress bar47.

Another trick is the parallax effect48, whereby different layers on the page move at different speeds according to the user’s scrolling, creating the illusion of depth (as seen on Andrew McCarthy’s website49). While it can help to create beautiful and innovative50 experiences, it is sometimes heavily overused, and users can get confused by how much they need to scroll for more content. When the parallax effect is combined with animation, the user can get confused about whether the page is being scrolled by their movement or is moving autonomously. It’s wise to use the technique to enhance content, not as the content itself.

Let’s Get To The Bottom Of This Link

Infinite scrolling can be an innovative feature that greatly improves an interface by exposing content and making performance more efficient. But it needs to be used correctly.

Avoid the following sinkholes to achieve a strong infinite scrolling experience:

  • Users want immediate access to exclusive data.
    Users don’t want to be left to explore all of a website’s data on their own. When implementing infinite scrolling, identify what data is exclusive to your website and elevate it to the top of the page, and filter less relevant information.
  • Users want to feel in control.
    Infinite scrolling sabotages that feeling of control. Add a smart progress indicator, a fixed menu or a map.
  • Users often look for landmarks when scrolling.
    When scrolling through long lists, users expect to be able to easily distinguish between new and viewed data. Add landmarks along the interface to keep users oriented.
  • Consider conventional pagination or a hybrid solution.
    Good old pagination is always an alternative to infinite scrolling. And if that doesn’t fit the context, then a hybrid solution, using a “load more” button, could greatly enhance the interface.
  • Provide interesting content without an ambiguous interface.
    Having to traverse a never-ending list is logical only if the user leaves feeling that it was worthwhile.
  • Users often expect a footer.
    If footer-type information is functional to the interface, then it should appear at the bottom of the page. A fixed footer is usually the way to go with infinite scrolling.
  • An infinite list is still a list.
    Infinite scrolling still needs to meet common interface standards. Whether users take their eyes off the screen for a moment or click a link and then click “Back,” they expect to return to the exact point where they left off. Whatever your interface, make sure it meets users’ expectations.
  • Effects are nice to have but not a must.
    Many infinitely scrolling interfaces have various effects to show more data (whether by sliding in new content or another method). Be mindful not to focus more on effects than on presenting data in the most effective way possible.

Use It Correctly Link

Users are goal-oriented and find satisfaction in reaching the end of their exploration. To be effective, infinite scrolling has to account for this. Nothing is really infinite, not even these infinitely scrolling lists we’ve looked at. Users should always know where they stand, even when the content has not finished loading. They should know what the total amount of data is and be able to easily navigate the list. Infinite scrolling has to be implemented in the best possible way so that users can always find their way.


Footnotes Link

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18
  19. 19
  20. 20
  21. 21
  22. 22
  23. 23
  24. 24
  25. 25
  26. 26
  27. 27
  28. 28
  29. 29
  30. 30
  31. 31
  32. 32
  33. 33
  34. 34
  35. 35
  36. 36
  37. 37
  38. 38
  39. 39
  40. 40
  41. 41
  42. 42
  43. 43
  44. 44
  45. 45
  46. 46
  47. 47
  48. 48
  49. 49
  50. 50

↑ Back to top Tweet itShare on Facebook


Yogev Ahuvia is a Senior Front End Engineer at Fundbox. Yogev is a UX expert and a code artist (see his CodePen profile) and he writes and speaks on blogs and events. You can find him on his Twitter account @kindofone or on his blog.

  1. 1

    “UNREACHABLE” that is the worst experience, when you see the footer and then the content loads… I agree with the fixed footer. Maybe on :hover it can slide up if there is allot of footer content. Lazyload is a good jquery plugin to delay img loading outside the viewport.

  2. 2

    Niels Matthijs

    May 3, 2013 3:05 am

    I would say one of the keywords when choosing to use infinite scrolling is “discovery”. It’s useful when you’re looking for a certain item but aren’t sure what exactly it is you want.

    Think Google images (page 10 could still wield some wildly interesting results)
    Think “I want to buy my mom a DVD but have no idea which one”
    Think “I want a new desktop background”
    Think “So … tablets. What’s out there?”

    In situations like this paging (and load more links) get into the way and infinite scrolling works best. Infinite scroll list give you a quick overview of what is out there. Once you feel you’ve seen enough to get a good grasp of your choices, you can start filtering down to the items that looked promising.

    Another great use case for infinite scrolling is when you implement a master-detail pattern. The list is on the same page as the detail, so users can see the detail without losing the context of the list.

    • 3

      Context matters

      It also depends on the context of your design and how that content is delivered. As Marissa Mayer (when she was at Google) explained, the content that is being displayed is a determining factor. Google Images uses infinite scroll because users are able to scan and process images much more quickly than text. Reading a search result takes much longer. This is the reason why their main search results still use the more traditional pagination technique. You can read more at:

    • 4

      Yogev Ahuvia

      May 3, 2013 4:05 pm

      Great elaboration, Niels! The master-detail pattern you mentioned is a great example of when infinite scrolling fits the goal of the interface for the user. Also, I very much agree, generally, that infinite scrolling is almost a must-have feature for discovery interfaces. Just like you said, the user does not search for something specific so they need to see a large amount of items to find the one thing they like.

      I do think, though, that websites too often are blinded by the advantages of easy discovery using infinite scrolling, but forget that their users are searching for that one thing, after all. Even in your example of “buying a DVD for mom”; this is the user’s goal (finding a DVD for mom), meaning that the interface should show the most relevant items in relation to this query, which should probably limit the amount of relevant results by much! This could be done by categorizing the items on the website or by allowing to enter keywords for the search.

      Infinite scrolling might be tricky in those implementations as we want to use it to show the user as much information as possible, but the user can’t handle that much information without boundaries. Pagination might be less flowing for discovery purposes, but it might bring the user to decide faster on their chosen item and prevent some of infinite scrolling worst pitfalls – temptation and optimism.

      • 5

        Geert-Jan Brits

        May 8, 2013 1:50 pm

        ” I very much agree, generally, that infinite scrolling is almost a must-have feature for discovery interfaces. ” Which is why infinite scrolling DOES work for pinterest imo… Otherwise excellent article.

        • 6

          OMg… sorry – I clicked the down vote – and tried to change it. I COMPLETELY agree with what you said!

    • 7

      “Once you feel you’ve seen enough to get a good grasp of your choices, you can start filtering down to the items that looked promising.”

      …if you can find them again…

    • 8

      Agree with Niels. This is one of the reason why QIITO choose masonry layout for visitor to discover places. When visitor has no idea of where they want to go, they will more likely to browse to discover more places. We give them wide range of choices and assist them in making their choice.

      Do you agree with this when you are planning your trip? Experience it before you give your answer –

    • 9

      Infinite scrolling (lazy loading) works great for images and is a disaster as its used for Articles like Forbes or LA Times. They were sold junk as modern, My opinion

      The reasons are that people can scan images but endless articles with no idea of what is where is a UX disaster. Its not a pleasant surprise to me but a confusion. NY Times has it right. Remeber the silly trend to have the words that are most popular bigger and throw a word salad together. Its on par with that

  3. 10

    This is nice!
    Can I translate this into Chinese and share it on my blog? For sure I will notice from Smashing Magazine.

  4. 13

    Sometimes its useful (most times for users, not sure about what they want…) sometimes not. A very exiting feature fore some websites…
    Sure everything is infinite … to explore that websites are is a missing point since ages and an old print-myth.

  5. 14

    Timur Carpeev

    May 3, 2013 4:10 am

    Etsy is a handmade market place not a vintage store :)

    • 15

      Esther Arends

      May 3, 2013 7:01 am

      Thanks, we corrected it!

      • 16


        May 4, 2013 5:08 pm

        Actually, Etsy is a handmade marketplace AND an excellent source for vintage items. Their vintage selection is HUGE.

  6. 17

    Yes infinite scrolling is distracting at times. You just go on scrolling the mouse wheel until you index finger gets tired lolz

  7. 18

    Thank you for your in-depth article on this topic. Searching for pro’s and cons I found many articles that discuss infinite scrolling either for search results or for blogging/commenting tools. I am considering using the “infinite scroll on demand” pattern for a datatable. The datatable I have in mind contains a finite set of personal data, data that users will recognize as their own. I feel that, in this case, other pro’s and cons might apply.

    A pro of using infinite scroll instead of pagination could be that it enables users to bring into view as much data as necessary for a good overview. Some datatables with pagination already enable users to define the amount of items in the table. However, I feel the ‘More button’ is more intuitive and requires no conscious decision on how many items would suffice. Also, exploring personal data is less likely tempting or exhausting for users than exploring the unknown.

    A con of using infinite scroll could be that it is laborious to find a specific set of data that is far down the list. That makes a good sorting and filtering mechanism indispensible. I think the combination might be very powerful: the user can sort or filter the data to get the most interesting data first and then browse by scrolling down. Another con could be that the tableheader moves out of sight leaving the data hard to interpret. This might be solved with a sticky header.

    I would be excited to hear your thoughts on this subject.

    • 19

      Yogev Ahuvia

      May 4, 2013 3:24 am

      Hey Heleen,

      You mentioned some great pros and cons of infinite scrolling interfaces! On data tables, infinite scrolling could bring a very intuitive experience as the scrolling is done in a boxed component – the table. This means that probably when the user is scrolling the data table, the page’s body scroll stays in place, while only the inner contents of the data table are scrolling. By that, the interface avoids some of infinite scrolling drawbacks like losing scroll position, orientation distraction and the unreachable footer.

      I very much agree to what you said in regards to sorting the data table in order to make the scroll easier. When users scroll through content that is recognizable, like personal information, scrolling becomes less exhausting since they’re not scrolling through the unknown. The question is whether the contents of the data table can be intuitively sorted, and that depends on what data it contains.

      I feel that the use of a hybrid solution (using a ‘Load More’ button), in the case of a datatable, would interfere the experience, because in datatables users tend to know what they’re looking for as opposed to when discovering new data.
      When the user chooses to sort the table by a parameter, the hybrid solution would be even more in the way, because when the table is sorted, the user easily scrolls through it, supported by the sort parameter progress in the scroll. In this case, the user don’t feel exhausted as there are no surprises down the scroll (because it is sorted). The hybrid solution comes in handy when we want to help users in deciding whether they’ve seen enough and want to stop or load more and go on scrolling.

      In long datatables, infinite scrolling could harm our experience as we lose control of where the item is down the list. If the datatable is paginated we could always get back to a specific page in the list (if that list doesn’t change too often, that is). By that, we get to know our interface and feel in control while interacting with it.

      So, I would say, if your data table contains many many rows, using infinite scroll would make a great user experience only if you wrap it with a smart filtering and sorting mechanisms. When we don’t offer those mechanisms, we’re practically forcing users to scroll every time they want to find a specific row leading to a bad experience.

      Good luck!

      • 20

        Jonas Hermelin

        February 24, 2014 2:52 am

        Sadly, I would argue that many implementations of “hybrid” Show/load more are downright horrible and generally overused. I find the feature often being a pain, since most webpages loads too little data for each iteration in combination with bloated elements for each row of data. Examples are online bookstores showing around 10 books per fold on a 24 inch monitor, or video-on-demand services also showing only 5-10 elements per fold. Going through the list it demands of the user to repeatable click Show more, wait, click, wait, click, wait. And then you click on an element to view details, go back and find yourself at the top.

        This might work fine in social media or other cases of casual browsing, but applying this in situations when the user is activly looking for something I feel have been a major step backward in regards of usability.

  8. 21

    Another issue with infinite scrolling is that neither the user’s device nor your server have infinite resources. I have noticed that on some infinite scrolling sites, especially those with many images, devices with limited resources such as an iPad can start slowing down because of the sheer number of assets it has loaded.

  9. 22

    The problem with infinite scroll is, when you refresh the page. or you clicked on a link then went back to the same page you just lost where you were, and you have to click and click until you reach to that specific spot again. With paginations you are in control of navigation because you know which page to click on to get back to where you were.

  10. 23

    Eh, you don’t think google’s pagination for search results has anything to do with ad impressions in the top? I’m not convinced that google is keeping it for the sake of usability, I would definitely be very careful before making such an important business decision as it would be for google to implement infinite scroll…

    • 24

      Yogev Ahuvia

      May 4, 2013 3:58 am

      I actually think, like you, that it’s not usability that leads Google’s arguments for staying with pagination for their searching interface. Business preferences must play a role in that decision, but also the Google brand.
      I stated in the article: “Google will probably maintain pagination because this pattern is quite symbolic for its brand”. Google preserves the long ‘Goooooogle’ pagination component at the bottom of their results page from practically day one and it’s a symbol we all got to know as part of their brand. Abandoning it, I think, would only occur if it would come in the way for its users while browsing the results.

  11. 25

    Daniel Schwarz

    May 3, 2013 2:13 am

    A brilliant article. We use the masonry script to achieve infinite scrolling over @airwalk_design ( to “list” design inspiration, but we’ve connected it to a database and added our own jQuery effects. A lot of interesting points for us to consider.

    Good job!

    • 26

      Terrible UX, you should drop the box-shadows – that site is super laggy on my quite modern PC. Images-based shadow would perform better.

    • 27

      press the ESC key to close the modal window it would be a good feature

  12. 28

    Stan Rogers

    May 3, 2013 2:12 pm

    I have yet to have my “user experience” improved by infinite scroll in any way. Load-on-demand is another thing entirely, and I’m all for that. I can’t imagine a single circumstance, though, under which my apparent attempt to read to the bottom of the current page should be construed as entering a binding legal agreement to load another 10MB of stuff. ESPECIALLY when I’m mobile and paying through the nose for data or likely to be soft-capped. If I don’t ask for it, take it as read that I don’t want it yet. It’s not that I want to get to the footer (usually), but that I want to see the content I already had to scroll to before you added more crap so I could decide whether or not I wanted to load more. You’re not allowed to spend my money. Really — is that so hard to understand?

  13. 29

    This was an excellent exploration of a very popular design trend. I think the “discovery” aspect of infinite scrolling is really useful on mobile apps, where the user’s mental model / goal is to discover new content rather than find an item & make a decision.

    Desktop sites that want users to interact with content should avoid infinite scrolling because it can indeed lead to a feeling of floating within the content.

  14. 30

    What a coincidence, I just wrote yesterday about how the entire Gawker network shot itself in the foot with their recent redesign that horribly misuses infinite scrolling ( IMO they turned a series of useful sites into something quite irritating to use.

  15. 31

    I’m so happy you covered this topic. It’s taking over like animated gifs did back in the day, and when used properly is a great tool, but so often its overall usability isn’t thought all the way through. Point in case…I hardly ever am on Pinterest for the exact reason mentioned above!

  16. 32

    Great article. I loved the examples and fresh insight into the ever-growing conversation around infinite scroll.

    I do, however, have a small issue with the interpretation of analytics suggesting that 94% of users are “satisfied” with the first set of results from Google. One could also argue that 94% are actually unsatisfied with pagination and therefore just stay put. The 11th item, then, is ignored not because users don’t want to see it, but because they don’t want to take the action to see it. In this case, infinite scroll is a welcome change since people are allowed to continue on their own–the onus to chunk information is on them and off the content designers. What do you think?

    Again, great writing on a difficult subject.

    • 33

      Yogev Ahuvia

      May 4, 2013 3:46 am

      I think you’re right and infinite scrolling does solve that click-barrier to content publishers. But, as shown through the article, infinite scroll exposes users to some major drawbacks when they don’t have that point where they can decide to stop scrolling, so it does not always worth it.

      In addition, I think that most of our searches end on the first page, as usually we find there what we were looking for. If we don’t, we become very skeptic that it would show up at a later page. That’s why we don’t feel motivated to click the next page button. There are times that we search for something that we can’t define perfectly, or not sure exactly what it is; then, we’re less expecting it to appear on the first page anyway, and come better motivated to check the second page also.

      Thanks a lot for the kind words, Jamie :)

  17. 34

    Benjamin Milde

    May 3, 2013 12:02 pm

    Infinite scrolling has another weakness. The scrollwheel on my mouse is broken, so I got used to use scrollbars again. In Firefox if you want to scroll on an infinite page you always got jumped to a deeper part of the page, if you’re dragging the scrollbar, while the autoload hits. Luckily Chrome doesn’t behave like that. But no matter what, from an accessibility it’s quite bad to break the use of scrollbars for your users.

  18. 35

    Delicious implemented infinite scrolling on their new site design some months ago. They made a feedback forum with the ability to give points to a specific user question/problem with the new design. And one of the most voted one was that they should make infinite scrolling optional. They didn’t. And every good argument for at least giving this new list view some good navigation patterns, where just ignored.

    In fact it’s not so bad at all, that this site has an infinite list. You just can’t navigate through it. At least they could make the tag-sidebar sticky.

    So I’m still using the previous version of it (thankfully they kept the old paginated design), but looking for an alternative…

  19. 36

    Yes, infinite pagination has some cons but most of the problems you are describing can be solved from programmer’s point of view.

    > Analytics show that when users search for information on Google, only 6% advance to the second page. So, 94% of users are satisfied with receiving only 10 results, which suggests that users find Google’s ranking of results to be relevant.
    The conclusion could be wrong. The analytics could also mean that 94 % of users are just lazy.

    > Temptation – When you’re looking for that perfect search result and are tempted to continue scrolling into a wasteland of irrelevant results, time is wasted.

    Yes this is true, pagination works like laziness barrier. Maybe we could even remove pagination and show only the first ten results.

    > Optimism – Even more annoying is that scroll bars do not reflect the actual amount of data available.

    They can. You could set the element with data being loaded as you scroll some fixed height (which could be calculated, little harder for items with different heights though but it can be done). Of course this can’t be done on sites like Twitter or Facebook without utilising the ‘limited’ infinite scrolling from Google images.

    > Exhaustion – Infinite scrolling overwhelms users with stimuli.

    For some users pagination is the same thing, for most it is laziness barrier.

    > Pogosticking – Infinite scrolling often causes your position on the page to get lost.

    This can be solved quite easily. You can update URL using javascript’s pushState every virtual page you scroll.

    > Loss of Control – Infinite scrolling leaves you with the feeling that you might be missing out on information.

    > Distracting

    Essentially the same thing as Exhaustion.

    > Unreachable – Have you tried reaching the footer of Facebook lately?

    Like mentioned in other comments, position: fixed serves just right.

    > Not Exclusive

    Exclusive posts are on top. Add some red line bellow which there would be non-exclusive ones if you want to distinct them. But there is usually no point where you can say “OK, these were exclusive ones and now these are just some uninteresting junk.”
    Or you can have some slight white space between them, or different background or other ways of distinction.

    The additional point mentioned in discussion that infinite scrolling can be quite resource consuming can be solved by removing the posts from DOM when they disappear out of screen (for not having to redownload them when you scroll back, they could be stored into localstorage or something.)

    I quite like how infinite scrolling is implemented in steam.

  20. 37

    When you have a slow computer the infinite scrolling becomes a performance nightmare.

    • 38

      case in point: the new Awesome Flickr- justified pages and infinite scrolling- an absolute nightmare, it loads about 200 pics per page, by page two we see ‘fetching, fetching… after that just grey squares…. the footer is almost impossible to reach….new should be better- it isn’t.

    • 39

      if done properly performance isn’t an issue at all. see


↑ Back to top