• Build a landing page in the Unbounce Builder's new Preview mode
  • Infinite Page Scrolling – How it Affects Users & Conversions

    “Which page was that black sweater I liked on? Was it page 5?… No?… Maybe 6?… Shoot. Ok, maybe it was on the first page after all… Ugh, it takes so long to load… Dang it, not on page one, either!… Oh, forget about it, I’ll just look for it some other time.”

    The conclusion the customer above just arrived at signals a lost sale for your ecommerce website. Has it happened to you? Even with a high speed internet provider, it takes time to load page 1, then page 2, then back to page 1, then on to page 3. By the time the customer gets to page 5, he can’t even remember what you saw on page 1.

    This is where infinite scrolling comes in. To see an example of infinite scrolling, visit the Google Images site and do a search. Instead of having to click the next arrow when you get to the bottom of a page of results, the images just keep scrolling, and scrolling, and scrolling – hence the “infinite” in “infinite scrolling”.

    This is a guest post. The author’s opinions are entirely his or her own and may not always reflect the views of Unbounce. David Murton has been helping companies build and maintain their online relationships with customers since 2006. He is also a professional writer and blogger, with a particular interest in the open source Drupal platform.

    Benefits of Infinite Scrolling

    Infinite scrolling has two main benefits:

    1. It doesn’t confuse visitors by forcing them to jump around between different pages
    2. It’s much faster to load one infinitely long page than multiple pages

    Infinite scrolling, therefore, is perfect for ecommerce sites with a large inventory of products. For example, if your site offers 300 different types of sweaters, instead of displaying them on ten different pages, you could set up infinite scroll so that when the customer got to the bottom of the results from page 1, the results from page 2 would load automatically and begin to display.

    Compared to clicking each individual pages and viewing 20 or 30 sweaters at a time, this method makes it much easier for customers to scroll back and forth between items they like. (“Hmmm…. do I want the baby blue sweater with the sequin, or the orange one with the rhinestones?”) When the customer has to remember which page an item he liked was on, he’s far less likely to go back and buy it than if he can simply scroll back up to it.

    Furthermore, every time a customer clicks on a new page, an HTTP request is sent to the server, and the browser has to load up new information for the viewer. Infinite scrolling preloads this information so that it doesn’t take nearly as long to load the next part of the search results or the next page.

    Here are a few nice examples of sites using infinite scrolling:

    Disadvantages of Infinite Scrolling

    However, every solution seems to invite its own obstacles, and the same holds true with infinite scrolling. One thing infinite scrolling does not allow the user to do, for example, is skip over certain results. If the user wants to skip the first 900 results and go first to the 901st result, there’s no way for him or her to do that when infinite scroll has been implemented onto a page. A customer service response also couldn’t send a link to a particular page of items if a customer were to email in the question, “Where are the baby blue sweaters with the sequin located on your site?”

    Another disadvantage of infinite scrolling is that it can potentially lead to a browser crash, especially if the user has an older browser. Even though the browser doesn’t have to load each page in a sequence individually, it’s still loading more data into the window, and that is still going to use up resources. With a slow connection or an out-of-date browser, this could definitely detract from the user experience.

    Additionally, since infinite scrolling is a relatively new technology, it’s still a little buggy. At the moment, some infinite scroll users have noted that it doesn’t work well – or at all – on their mobile devices.

    Conversion Rates, SEO, and Infinite Scroll

    The main question for the ecommerce site owner is a simple one: to infinite scroll, or not to infinite scroll – which will lead to more sales?

    Unfortunately, there’s not a black and white answer to this. Truly, it depends upon what you’re selling and what your users want. To find out what your users want, why not run an experiment? Take two products that sell at about equal rates. Make one product display on an infinite scroll page, and keep the other one on an old-fashioned pagination display. After running it for a month or two, evaluate the sales. Did it make a difference? Did you get complaints or compliments about the infinite scroll?

    Another concern ecommerce owners have is the question of SEO. Google and other search engines tend to read the beginning of a page, but not the end of it. Therefore, there’s a risk that content “below the fold” on an infinite scroll page – which could be hundreds of items – will not be registered by search engines. Other infinite scroll plug-in designers insist that at least their infinite scroll plug-in is totally SEO friendly.

    Try It Yourself

    The best way to find out if infinite scroll will work for your website is to dip your toes into the water. Take a look at the sites mentioned above, and decide if it would work for your site or not.

    One thing to note is the different ways in which infinite scroll sites tell you or don’t tell you that there’s more content yet to come. Some sites, like CSSline.com, explicitly tell the user “Loading more sites…”, while others simply freeze for a moment, then suddenly more content appears. Which of these would work better on your site?

    Infinite scroll may also encourage you to change your CSS code so that there is a stationary footer or header with your site’s contact information. For instance, at the moment you may have a Facebook Like badge situated underneath your “Next” and “Previous” links. If you do away with pagination, where will you put that Facebook Like badge? You can’t put it at the bottom of the page anymore, because the user might never see it. You will need to think through this and the many other caveats that come with infinite scroll should you decide to implement it for your site.

    In short, infinite scroll, like so many other design trends, it is what you make of it.

    David Murton

    About David Murton
    David Murton has been helping companies build and maintain their online relationships with customers since 2006. He is also a professional writer and blogger, with a particular interest in the open source Drupal platform. On a more personal note, David is an avid piano and accordion player, drawn especially to music of the classical and romantic periods.
    » More blog posts by David Murton