Despite its ethical controversy, there are reasons why infinite scrolling is so popular in interface design. Especially on e-commerce and social media platforms, infinite scrolling is a feature that has proven to be so good for engagement that it’s considered a necessity more often than not.
But like most things in this finite world, the infinite scroll has its own set of drawbacks despite being a powerful tool. And for that reason, design best practices do exist for infinite scroll pages, and that’s what we’ll be covering here.
In this article, we explore:
- What it is, who invented it, why it was invented, and why it works
- The pros and cons of infinite scrolling
- Design essentials on an infinite scrolling page for better UX
- Where and when to implement infinite scrolling
The What, Who, and Why of Infinite Scrolling
What is infinite scrolling? Infinite scrolling was aptly named after what it does. It allows content to automatically load when users scroll down a page, leading to the endless, infinite act of scrolling.
Who invented infinite scrolling?
Aza Raskin, now an advocate for ethical technology, first designed this approach in 2006 to optimize interfaces for ease of use. He believed that the absence of a Next Page button and the need to perform extra clicks to view more content, can create a more seamless browsing experience. And by the early 2010s, that simple bud of an idea had blossomed into a standard design practice.
Why is infinite scrolling so popular?
The core of its effectiveness is that it plays on our psychological need for reinforcement or reward. What makes it addictive isn’t that we get rewarded every time we scroll, but that there is a possibility that we will be rewarded (with something that intrigues or interests us).
This psychological theory is known as the variable ratio reinforcement schedule, and is the reason why slot machines, gacha games, and other such games of chance are highly addictive. We are less likely to quit browsing on an infinite scroll because the chances of our next “reward” might just be a scroll away. And that’s easy to do.
Raskin himself had agreed that social media companies use such tactics like “behavioural cocaine” to keep users coming back for more. It’s dark and to some extent, unethical, but it works. And that’s why it’s used so often in designs today.
The Good and the Bad of Infinite Scrolling
Implemented in place of pagination, infinite scrolling allows for less clicks and more low-maintenance browsing. For every click a user doesn’t have to perform, they save 2-5 seconds for content discovery, and that is where the bulk of the benefit lies.
The Positives of Infinite Scrolling
1. Content Discovery
Users tend to spend more time on an app or website with infinite scrolling. Why? Aside from the addictive possibility of reward, infinite scrolling pages work especially well with content algorithms that emphasize discovery, where users browse for new content instead of searching for specific items. The odds of a user discovering something they like on a platform is higher with auto-loading content than if it were hidden in the next page.
2. Lower Bounce Rates
The fast-paced world that we live in is mirrored in our browsing behaviors. Research shows that 53% of mobile users will not wait longer than 3 seconds for a web page to load, and clicking Next Page buttons takes up a fraction of our browsing time. With auto-loading content and little to no waiting time, infinite scrolling irons out waiting frustration and keeps users from leaving for the wrong reasons.
3. Effortless on Mobile
Scrolling is easier than tapping and opening new tabs on mobile and touch interfaces, and infinite scrolling accommodates that. It’s effortless and intuitive. No extra gestures.
The Negatives of Infinite Scrolling
As much as infinite scrolling is a win for engagement, there are losses that one must be aware of before enabling it. Unfortunately, the infinite scrolling cons list is a little longer than the pros.
1. Longer Loading Times
Loading new content with infinite scrolling may cut down on waiting time, but as more and more content loads down a page, a site may start to visibly decrease in loading speed. Especially when bulks of large media files are being loaded simultaneously, one should only expect lower speeds with the increasing content.
2. Backtracking is Difficult
Unlike with pagination, users can’t hit back to return to a previous page. It’s easy to remember where a post or item is with page numbers; but with infinite scrolling, it’s easy to get lost. Once a user has scrolled past an item, it’s difficult to get back to it later if they decide they want a second look. They might need to take another deep dive into the ocean of content to return to where they were, and not often are many willing to do that.
3. Footers Can’t Be Used
4. SEO and Crawling Issues
Crawlers cannot properly access and index websites with infinite scroll pages because its content only appears as a user scrolls. This is pretty bad for metrics because search engines often rely on indexes to create accurate search results. If a site is not accessible in its entirety, it may not show up at all in searches.
5. Lack of Accessibility
It’s easier for users who rely on assistive technologies like screen readers and keyboard commands to navigate with pagination than it is for them with content that keeps loading without prompt. Because there’s no end to the page, the CTRL+End keyboard command is inapplicable, footers are unreachable, and keeping track of where one is on a page becomes challenging.
7 Must-Haves on Infinite Scrolling Pages
Being aware of the disadvantages of the infinite scroll is the first step to understanding the art of overcoming them. Despite the longer list of negatives, with good UX design, a website with infinite scrolling pages can still offer a pleasant experience.
And on that note, here are 5 sine qua non features that complement infinite scrolling.
1. Sticky Navigation Bar
If a top navigation bar isn’t sticky, and a user is somewhere far down the site, the only way to get to it is to scroll all the way back to the top and lose their scrolling progress entirely. Now that’s a lotta damage. Having the navigation bar follow users as they scroll can save them from ever having to experience that on your site.
2. See More or Expand Buttons
See More or Load More buttons can solve the absent footer problem. Placed at the bottom of the page, users need to interact with the button to trigger new content to load. It’s a double win. They gain a sense of control over their browsing activity, and retain access to the footer. So if you’re on the fence about using pagination or infinite scrolling, your third option is to go hybrid with an expand button.
3. Bookmarks, Likes, or Saves
Backtracking is a huge hassle with infinite scrolling, but it isn’t a dead end. Providing the option to bookmark, like, or save content items allows users to easily revisit content they had taken interest in.
4. Visual Feedback for Loading
When more content is loading, it’s important to make that clear. A false bottom, where a user thinks they’ve reached the end but are blindsided with more content appearing unexpectedly, can be frustrating for the user. To prevent this, displaying visual feedback such as a simple loading animation or pulsing blank content blocks can be helpful while content is loading.
5. Jump-to Buttons
With pagination and numbers, it’s easy to recall and locate an item. With infinite scrolling, we can borrow the idea to help with locating past content. Having sticky jump-to buttons that divide a page into sections can help users vertically position themselves better. They can also easily return to where they were after jumping to a previous spot.
6. Back Buttons that Retain Progress
We’ve all been there. Clicking on a link and going back only to find out that you’re back on the top of the page, and all your scrolling progress is gone. Making sure back buttons on content items don’t erase the user’s browsing progress and scrolling position is an absolute necessity. No one wants to scroll through a long page of content they’ve already seen, all over again, every time they click on an item.
7. Search Engine Optimization
As mentioned before, SEO and website crawling are major disadvantages of infinite scrolling. But Google caught on quickly on the issue. Webmasters can now refer to Google Developers’ guide to developing search-friendly infinite scrolling pages. Some of their recommendations are to chunk infinite scroll page content into accessible component pages, and structure URLs for search engine processing.
When and Where to Use Infinite Scrolling
Infinite scrolling can be a boon or a bane to your website or app. A website may look fancy without pagination but what looks good doesn’t always mean the best experience for your users. Weigh these odds before enabling the infinite scroll:
- Does your site focus on user-generated content?
- Does your content rely heavily on visuals?
If you tick both boxes, then infinite scrolling might be effective for your site.
As a rule of thumb, pagination works best on goal-oriented websites where users search for specific content; while infinite scrolling works better for discovery and exploration where users are open to new and recommended content.
But at the end of the day, the choice is yours to make. To click or not to click? That is the question.
We’re Here for You
If you’re unsure about how you’d like your website or app designed and would like further help, you’ve come to the right place.
Snappymob is a team of experienced UI/UX experts who craft quality user experiences for our clients. Got infinite ideas for your next project? Talk to us and we’ll explore them together!