Skip to content

Blog

Stylized Boxes
A New Take on the Infinite Scroll Trend

A New Take on the Infinite Scroll Trend

Have you noticed a trend of placing content with individual URLS on a single page? We have, and it can be categorized as a type of infinite scroll.

Many media outlets are getting on board with this trend, which may look familiar to social media users. Similar to your Twitter, Facebook, or Pinterest feed, these pages auto load as you reach the bottom. For that reason, we are classifying it as part of the “infinite scroll” trend. Examples can be seen at:

However, there is a difference between these pages and Twitter. The difference is that the URL displayed changes as you reach the bottom of each article, and the next story begins. It may sound complex, but it is simply a matter of fetching URLs with a newer form of pagination.

What is Pagination?

Pagination is the word used to describe how content is split into individual pages. In print media, this requires setting discreet pages where content will end. Typically in web design, pagination has followed suit. The two main types of pagination are used on web pages today are:

  • A standard < 1 2 3 >
  • The [Load More] button.

How does the URL Update?

At a high level, the pages in our examples seem to be launching off of the latter approach. There are some obvious technical differences in the page code, but the resulting user experience is very similar. Most sites implementing this are using some form JavaScript to sense when new story is beginning. Usually a marker is inserted into the code (say, for the new story title) to indicate when the JavaScript should rewrite the address displayed in the URL bar.

It is being fetched from a predefined set of URLs for the stories that live on a page. This is similar to anchor linking using hashes. This method is sometimes used on longer pages where users would click a link to jump down to a part of the page much further down, and a # is appended to the end of the URL.

The Benefits of Infinite Scroll

Infinite scroll can hold some significant benefits for user experience in certain cases. But like many other trends we have seen online since mobile browsing increased, this trend may not be the best option 100% of the time.

However, in this case, most users today are accustomed to scrolling. In fact, most prefer it now. It seems for content-heavy sites, there is no cost for using infinite scroll: it engages the user and takes them on a journey as they scroll down the page.

In fact, infinite scroll has some real benefits in these cases: it allows primary content to be shown dynamically, rather than statically. That means users no longer have to click multiple times to explore content. This has particular UX benefits for visitors browsing on mobile devices.

The Daily Beast and Quartz both benefit from this, since their content consists mainly of ad-supported articles.  Generally, people who visit these sites are there to consume media. So making it easier for them to do so is in the site’s best interest. Yet the added feature of the URL changing benefits both the user and site owner.

A primary benefit of the URL changing as a new article takes focus is that the site owner can track where people are landing, clicking, and engaging. It would be far more difficult to zero in on this information if every story was contained within a single URL. But the updating URL is also handy for users who would like to share an individual story.

About the Technical Side of Infinite Scroll

As long as infinite scroll doesn’t affect the performance or loading of the site, then it is a good UX design choice if you want to encourage your users to spend a lot of time browsing. The activities happening behind the scenes to make this happen may sound complicated. But it is likely they wouldn’t add much to page load time, especially if the site uses lazy loading. That means the site is not loading all the stories on a page, but rather calling up each story and corresponding set of ads when you scroll near the end of the preceding story.

The Drawbacks of Infinite Scroll

For Users

The main losses in usability with the infinite scroll come in the area of user control. Unless there is some sort of navigation on the side of the page, users will have no idea how to access specific stories. The Daily Beast does this better than Quartz with their sidenav and fast-scroll animation that reflects the anchor link.

And unless you’re using a bar graph-like indicator (like the one on The Daily Beast), users will not be able to gauge the length of the article or how far along they have read. Standard pagination that indicates a user is on page X out of Y pages usually makes this quite clear.

Infinite scroll also holds the potential to slow down a site’s page load time. One way to get the best of both worlds with infinite scroll is to load some initial content, and then offer users the option to view more results.

For Site Owners

If users do not like the infinite scroll results on a site, page views and conversions will likely drop. And there are some pretty big cases where using infinite scroll negatively affected sales and was quickly dropped.

Source: http://mcfunley.com/design-for-continuous-experimentation

In addition, sites that want their users to take action will need to optimize their content and calls to action in order benefit from infinite browsing. Otherwise, users will simply continue exploring content without:

  • Clicking on advertisements – This is another practice the Daily Beast addressed by making their advertisements fixed on the page.
  • Subscribing – Perhaps advertising clicks aren’t the growth metric of choice on the site.
  • Performing some other action of value to the site owner – not all conversions are comprised of advertising clicks.

Should You Use Infinite Scroll?

Whether or not you should implement infinite scroll on your website ultimately depends on your goals for the site. Infinite scroll encourages browsing and exploring more than actual clicking (think window shopping vs. actual purchasing). If you manage an eCommerce site, then you’ll may want to avoid this type of pagination. Choice paralysis for users will likely take over when there are an infinite number of stories to read or products to review.

For article-heavy sites the trend works, and benefits both users and owners. However, for action-based sites it may not be the best choice. UX designers will likely only recommend implementing infinite scroll when they have data about the site’s target audience, as well as the typical content presented.

Related Articles

  • User Experience

    Discovery Research and AI

    What is Discovery Research? Discovery research is at the forefront of the double-diamond design process. The discovery phase of a project aims to understand...

  • User Experience

    The Purpose & Value of UX Research Part 2

    The Value of UX Research In the previous article The Purpose & Value of UX Research Part 1, we discussed how a bad user...

  • User Experience

    The Purpose & Value of UX Research Part 1

    The Purpose of UX Research In a growing digital world, technology has been integrated into our daily lives. From using our phone to check...