Infinite Scroll vs. Load More Buttons: Which is better?

Ben Morrisroe
January 12, 2021

Recently, we’ve seen a trend across our publisher group transitioning away from infinite scroll pages towards load more buttons in an effort to increase ad performance.

So it begs the question, what is the difference between infinite scroll pages and load more pages? What are the pros and cons of each feature and which sites are they more suited towards? We’ll explain all this and its importance for publishers.

Let’s dive in.

What is Infinite Scroll?

Infinite scrolling is a web-design technique that allows a user to keep scrolling a page without reaching its “end.” An infinite scroll setup loads content continuously as the user scrolls down the page, providing an ever-growing and seemingly never-ending amount of material and eliminating the need for pagination.

It is normally implemented with JavaScript, which asynchronously loads fresh content, triggered by the user scrolling beyond a page or pixel point. In order to maintain ideal loading times, the new content begins background loading before the user reaches the load more scroll point.

Infinite scroll has been made popular due to its success on social media platforms like Twitter, but the technique isn’t advantageous for all types of content. Not having to click “next page” is ideal for content that has a relatively flat structure, but is not recommended for goal-oriented finding tasks, such as those requiring users to locate specific content or compare options.

Why implement infinite scroll?

Infinite scrolling is most commonly used on content formats where the user is browsing without necessarily looking for something specific, say for the infinite feeds of social media or entertainment content sites where content can be evergreen. The advantage of not having to click “next page” is great for time-killing activities because it keeps audiences engaged with content and less focused on navigating to the next page. By not providing the user with an end, they are more likely to continue scrolling and browsing through your content.

This continual browsing leads to more impressions on ads you have on the page. It means you can have more ads per page as most are not in view until the user has scrolled to a certain point. More impressions usually means more revenue. For other ideas, check out our guide on how to improve user time on page.

The downsides of infinite scroll

Continuous scrolling can be great for content that streams constantly, but should be applied with caution. With eCommerce sites, for example, finding products by feature would be difficult to accomplish if all the products are presented linearly on one continuous page. Since different units of content belong at different levels of hierarchy, sorting or other filtering or navigation techniques should be employed to help the user isolate the intended item.

When infinite scrolling is implemented well, users should be able to scroll the list of products or results without interruption. However, as a result, users tend to scroll more and focus less on individual products on the list. Therefore, while infinite scrolling is great for showing the breadth of a category, it’s not necessarily conducive to site interaction.

In short, infinite scrolling is not an ideal solution for site visitors who want to achieve goal-oriented activities. People who need specific types of information expect content to be accessible in a coherent and easily navigable structure. Users don’t mind clicking links if each link is meaningful and leads them closer to an end goal.

Infinite scroll and ad viewability

Apart from infinite scrolling being seen as a bit of a UX nightmare by designers, infinite scroll may not always mean more money. Ads loading below the fold that may never be in the view of a user can have a dramatic impact on the CPMs you receive.

Viewability is one of the key metrics today in determining CPM. If all of your ads are located all the way down the page where few users are going to see them, your viewability percentage is going to be substantially lower than if these units were front and center on the page. Advertisers just aren’t going to pay for wasted ads that are rarely seen.

Not only that, but there is an optimal number of ads that can be on a page before your inventory starts to become saturated. There just won’t be as many buyers willing to bid on your users and so CPMs will fall.

Viewability is one of the key metrics today in determining the CPM you will receive. If all of your ads are located all the way down the page where few users are going to see them, your viewability percentage is going to be substantially lower than if these units were front and centre on the page.

What is Pagination?

Not all websites can have their information on a single page. Pagination is a sequence of pages which are connected and have similar content, thereby delivering structure and feedback for the user. If you scroll to the bottom of a webpage that uses pagination, you will either see a row of page numbers or next/previous links.

In contrast to infinite scroll, pagination presents content in controllable chunks that can be accessed by moving back and forward via navigation controls. As a result, pagination typically results in reduced load times.

A great example of pagination is a search engine results page. The navigational controls on the bottom of each paginated page let users know which content is the most relevant, which page is currently selected, and how many more pages of information are available for the specific query. This makes it easier for the user to find what they are looking for, while giving them a precise idea of how big the data set is for their particular query.

Ecommerce sites also frequently use pagination since there are typically so many products offered that it would be impractical to list them all in one category on one page.

For websites with large amounts of data that cannot reasonably be presented as a single page, pagination is the most popular way to load new items on a website.

Why use pagination?

Pagination, and shorter pages in general, can help in terms of user experience and overall site navigation. Webmasters can present a lot of information in small and manageable chunks, making it easier for a user to find the information that they are looking for.

What Are Load More Buttons?

With web design, there are three ways to organize content: infinite scroll, pagination, and “load more.” Load more buttons offer a middle ground between infinite scrolling and classic pagination. It consists of a button at the bottom of the page that will feed more content when clicked, giving the user the simple decision to see more results or to reach the page end.

“Load more” is a simple design that doesn’t burden the user with having to navigate across a series of pages, but rather plainly asks, “Do you want to see more results?” Interestingly enough, because loading additional products requires an active choice and click, users tend to read displayed content more closely on websites with load buttons than on those with infinite scrolling.

Why implement load more buttons?

Load more pages have increased visibility as ads will often pop up in view as a user loads the page. There is less opportunity for an ad unit to be left below the fold unseen and thus useless.

Based on a recent eCommerce usability experiment, subjects generally browsed the most products on infinite scrolling pages, followed by load more pages and standard pagination. However, users engaged and viewed the content for longer periods of time on the load more pages than on infinite scroll. This is obviously the priority when building an eCommerce page and may translate over to other forms of content where you wish to keep the user’s attention for a longer period of time.

Advantages of load more buttons

Load more buttons help with site speed, a critical aspect in user experience and SEO rankings. With infinite scroll, a large chunk of content is housed on a single page, taking a long time for the page to load. Load buttons offer a way for less content to need to appear upfront for the user, allowing pages to generate quickly. It is only once a user clicks the load more button that the page must generate.

Load more buttons also give the user access to the footer, which is pushed out of view and thereby impossible to access with infinite scroll. Footers house important information like contact information, social media links, cross-navigation, and other vital links to help and category content.

A final advantage of the load more button is that the product list grows, instead of results being replaced. In the case of an eCommerce site, “load more” allows the user to compare more products across an entire list, thus increasing the overall product discoverability rate.

The downside of load more buttons

If you are switching from an infinite scroll setup, impressions will decrease. Users are just less likely to view as much of your site’s real estate and thus potential impressions will be lost.

A man scrolling on a laptop

What is Lazy (On-Demand) Loading?

Lazy loading (also called on-demand loading) is a JavaScript feature that only calls for data from the server to be displayed on the page when demanded. Instead of loading an entire web page in one go, lazy loading renders only the required section and delays the remaining content, until it is needed by the user.

Infinite scroll uses lazy loading and executes its demand to load more data (products or content) at the bottom of the page, without requiring an action such as the click of a button.

On-demand loading is used to optimize content delivery by reducing time consumption and memory usage. Since only a fraction of the web page is loaded first, the time taken is less and the loading of the rest of the content is delayed, saving storage. This enhances the user’s experience as the requested content is fed quickly as the user scrolls down the page.

Both infinite scroll and the load more button use lazy loading, but one doesn’t require a user action to execute data loading whereas the other does.

Infinite Scroll vs. Load More Buttons: Which Setup is Right for Me?

As with everything in ad layout optimization, it is all about testing to find the optimal layout and format for your site.

You must always remember the end goal and overarching metric you are always looking at should be revenue. CPMs will take a hit from infinite scroll pages as you are more at risk of unviewed impressions and you have far more inventory per page. But if this still means you can generate more income through more impressions and a slightly lower CPM, then this should be what you are looking at.

On top of this, you want to take into account the type of content you have and how users are going to interact and consume this content. Social media platforms know they can keep users engaged on the site longer by providing them with endless content. A news site or article-based site where users may be looking for a specific story or piece of information may need to be built around pages or load more buttons so users can easily find what they are looking for and navigate to specific areas of the site that interest them.

Your Advertising Strategy

Based on the pros and cons of each of these page types, they can be more suited to certain advertising strategies.

Sites which are looking to be a premium, brand-safe commodity with a sales team looking to attract premium advertisers and agencies will want to protect the performance of their ad units. They will want to have the maximum viewability and view time they can in order to satisfy these buyers and make them willing to pay a premium over the open exchange.

If you are selling a large proportion of your advertising directly or in private marketplace deals, then protecting the value of your impressions will be very important and will be more beneficial to you than maximizing the potential impressions you could serve.

If you are going for a heavier programmatic strategy where all inventory is sold on the open exchange, then your CPM metric and viewability will be of less overall importance. Yes, they are good indicators of performance, but the overall goal will be maximizing revenue and minimizing your unfilled rate.

Can I have the Best of Both Worlds?

Yes, you can! (For the most part.) Lazy loading ad units with infinite scroll does help to maintain a high level of viewability. You will see a decrease in served impressions but will see a spike in CPMs due to the improvement. It is not an easy process to get right however. See how else we’ve improved 50 of our clients’ CPMs by 40 percent in collaboration with Google via exchange bidding in this Publift case study.

There is a lot of tinkering in finding the correct page point at which to begin loading the ad unit to ensure you maintain page speed whilst making sure ads appear in time for users to see them as they scroll down the page.

This is something our Account Managers at Publift spend a large portion of time on when onboarding sites with infinite scroll pages as it can have a real impact on the CPM you are able to achieve.

Piggy bank

Publift Lazy Loading Case Study

We recently added lazy loading to mobile ad units on one of our client sites, OverSixty.com.au. We requested ads to appear when a user scrolls to within 400 pixels. With infinite scroll, we would look to try this implementation with every ad unit on the page.

This implementation resulted in an overall 20% decrease in ad impressions on the site as units that are not in view were not called. The result of this, though, was a 25% increase in CPM with viewability increasing from 45% to 78% and overall revenue increasing by 5%!

Overall, the key is finding the right recipe. If you think you might need some help, that’s what our team of Ad Tech experts are here for.

Calculate your potential