20

I code a website which is online classifieds similar to craigslist. We are working on the pagination for the list of classified ads and we use regular pagination.

enter image description here

Is there any reason to use infinite scroll instead? I like both approaches but I don't know which is preferred in this case.

  • 1
    Do you think most of the users will be looking at the website on mobile devices? Not sure how easy it is to click versus scroll for the average mobile phone or tablet user. – Michael Lai Mar 31 '17 at 11:20
  • 3
    Not sure if you've ever used imgur.com but I yearn for more websites to implement swiping left/right. I hate sniping the pagination buttons but I love the feeling of being able to provide a link to something reliably. It's minimal effort for the user and they are able to reference a precise location on your site. – MonkeyZeus Mar 31 '17 at 14:19
  • 5
    Do you have a footer? In that case infinite scroll is not an option. – Džuris Mar 31 '17 at 19:01
  • 3
    You can definitely infinite "scroll" with a footer, even if you have to add a "load more" button – Kenyon Mar 31 '17 at 19:38
41

Both solutions have their pros and cons.

Pagination

  • Pro: Users can easily orient where they are and go back directly to the page they were before in cases like: browser restarts, swictching from device to device etc. ("John, I have found some interesting ads, gone through the first five pages of them, can you continue, darling?")
  • Con: a lot of them will not make it to page 2.

Infinite scroll

  • Pro: "Page 2 barrier? What barrier!?"they will keep scrolling.
  • Con: Once they get to the place that in case of pagination would be on page five and they close the page, they will not continue their journey. Or if they send the link to someone (a lot of people do that – they share link to the list, not to the particular offer) – the recipient will not be able to get to it.

Solution? Combine both, providing a navigable, storable navigation that will auto-advance upon scrolling:

  • Make it work like it is an infinite scroll.
  • Display an indicator to show how far they are in the list (1 - 2 - 3 - 4 - [5] - 6).
  • Make this indicator auto-advance as they scroll.
  • Store this information in the URL so that they can easily bookmark, share the link to the exact place in the list etc.
  • Provide them with means with getting back to this place (e.g. clicking page 6 in the indicator).

I believe this approach is almost bulletproof.

  • 6
    When combining both you can also use the History API to update the users history as they scroll. So if they go back they move back through the pages and not away from your site developer.mozilla.org/en-US/docs/Web/API/History_API – Markus Tenghamn Mar 31 '17 at 14:20
  • 22
    My (current) UX pet peeve is clicking a link in an infinite scroll list, then navigating back and having to infinitely scroll to find where I left off in the list. That combined approach sounds great. – Harrison Paine Mar 31 '17 at 15:25
  • 6
    @HarrisonPaine One reason why I hate Facebook. I see a link, click on it, and lose my feed. Even worse, Facebook's feed algorithm almost guarantees I won't ever see the post that I missed ever again. – phyrfox Mar 31 '17 at 17:10
  • 3
    This is why I always Ctrl + click to open in a new tab. – Nathan Osman Apr 1 '17 at 6:14
  • 1
    This is a great idea. Are you aware of any sites that already do this? – jamesdlin Apr 1 '17 at 20:10
9

I suggest you go with Infinite Scrolling because we see it ourselves everyday that the number of times we click on the page 2 of Google Search.

When we don't find what we are looking for on page 1 - we simply change the search keyword. But that doesn't happen with Facebook, we just keep scrolling down and down and suddenly realize we are spending too much time on it and should stop now.

So to boost business and keep the users engaged Infinite Scrolling will work better over paginations.

Read the Pros & Cons of these two patterns here

  • 1
    I agree with Dipak. If you're afraid of showing too many ads at once, you can show the newest only (say, from the last week) and on the bottom put a message saying "show older than 1 week". This could display more classifieds, like all from last month and change the message accordingly. – Mike Mar 31 '17 at 9:56
  • 9
    But this is a classifieds page. This is a different case than searching online via google. The reason being because we trust google to serve up what we want to find on the first page, vs we're looking for something that caters to use in an unfiltered list. This is a pretty big distinction. It's like looking for a job, and you're going to keep digging because you know that the first page wont possibly have what you're looking for. – Majo0od Mar 31 '17 at 12:34
  • For completeness of the answer, perhaps you should summarize the pros and cons of the two patterns, I'd give you a +1 for that. – Michael Lai Mar 31 '17 at 12:47
  • @MichaelLai he has included a link at the end - has some good info BTW... – Diego Mar 31 '17 at 13:03
  • @Diego I just thought it would be a much better answer (like Dominik did) to just answer it directly rather than simply providing a link. Or at least point out if there's anything different or in addition to Dominik's answer. That would be a better user experience don't you think? – Michael Lai Mar 31 '17 at 13:26
6

Let me just answer as a user of web pages. I don't have UX designer research to back me up, just this personal raw emotion and experience as an (admittedly maybe unusual) end user:

The very thought of infinite scrolling invokes visceral rage as a first reaction for me [rage-rant omitted for brevity]. When I find that a page has infinite scrolling my immediate thought is "Oh great, I sure hope I never ever need to actually go 'down' very far".

I think infinite scroll doesn't inherently have to be bad, but I think the following questions are worth asking:

  1. How likely are your users to want to go back to a specific point in the content? If so: Do you have a good search feature (specific to your content, for example, a search by time range for content that has a clear chronological ordering) that can fulfill such needs? Do you have a way to bookmark a specific spot in your infinitely-scrollable content?

  2. How big is your content, in terms of screen real-estate? Sometimes, I'll be on a social media site, wanting to catch up on all new things in my feed/watches/subscriptions/whatever: If the content is large, just the sheer scrolling gets annoying, and it also makes it harder and more time consuming to find exactly the thing I'm looking for it I want to come back to it.

  3. How big is your content, in terms of actual computer memory consumption? One time I wanted to go back through a couple of years of posts on someone's Instagram account: Halfway through, my reasonably high-end computer was starting to lag on that web page, because when you infinitely scroll, you probably aren't unloading the content at the top (Instagram sure wasn't) so my browser was accumulating gigabyes of image data in memory.

In summary: Is your common usecase overwhelmingly in favor of a casual perusing of some data-set larger than a single page, but not substantially larger?

Disclaimer: I know I'm weird. My personal preference will almost always be pagination. The way I browse the web pagination is more pleasant to me than scrolling. I don't expect the world to align with me. I just would like an option to use pagination on pages that matter to me (sadly I often don't), or at least some way to go back or find a specific spot in the infinite-scroll if that's what I must contend with.

P.S. Do you care about users who browse with limited or no JavaScript enabled? It's worth remembering people like this exist, and there are various good reasons (accessibility needs and computer security awareness being primary among them, though there are also others) for browsing with scripts disabled by default. Infinite scrolling can only work with JavaScript enabled, while pagination can be made more user-friendly with JavaScript, but can more directly gracefully degrade to plain HTTP requests as needed.

  • 2
    I should note that I +1'ed Dominik Oslizlo's answer suggesting combining both - it addresses some of my concerns, and if implemented well, my intuition is that it can address all of them (for example by also unloading sufficiently distant "pages" in the infinite-scroll from memory, and graceful degradation to pagination is scripts are disabled). – mtraceur Mar 31 '17 at 14:03
  • I've run into cases where infinite scrolling was a problem too. In my opinion if your site has a TON of records to display, as in over 500, I recommend allowing users to show a "details list" view capable of showing hundreds of items at once, with some sort of filter field that they can type into to narrow down their results. I wish Youtube had something like this, it's a real pain to try to find a video somebody has uploaded on an account with hundreds of videos sometimes. – jrh Apr 1 '17 at 23:09
  • You're not weird. – Medinoc Apr 7 '17 at 9:00
1

There is no need of pagination in this case as the user is not reaching to a particular ad i.e., he doesn't know what ad will be in page 3 as the ads are not sorted in any manner.

so you can provide a carousel similar as left and right arrows. which is similar to infinite scroll.

1

A question should be asked before choosing pagination or infinite scrolling. Does user tend to find yesterday's list item and you provide a relevant filtering options? If yes go with the infinite scrolling. If not, user may want to find older items and this becomes headache in infinite scrolling.

You need to seek habits of your users in this case. If users only concentrate on what is recent or it is a timeline like list than infinite scroll can be applied.

1

Classifieds? Hmmm... Seems to me pagination is the best way to go because...

What if you wanted to share the page you were on with someone else? How do you do that with infinite scrolling? You can't really do that...

Also, pagination allows people to see how long the list goes VS not knowing when it ends.

Something to think about.

  • What if you wanted to share the page you were on with someone else? How do you do that with infinite scrolling? The user would click on the 'View Details' button and share the link. – Brian Mar 31 '17 at 18:13
  • @Brian there's a difference between sharing the details page and the search results page. – Majo0od Apr 3 '17 at 13:00
  • That's true, but why would a user want to do that? Have you ever shared a specific page of a paginated website (other than the first) or had one shared with you? I haven't. Also, job listings go up and come down frequently, so any page that was shared would likely be different shortly after being shared. – Brian Apr 3 '17 at 13:58
  • @Brian that's not necessarily true. I have definitely shared pages especially when it comes to classifieds or job boards. You might not be sharing the exact page, but could potentially be sharing the criteria you chose to search by. Also, the real question should be what do his users commonly do? Do they share the pages with others? Is this valuable to have? etc. – Majo0od Apr 3 '17 at 14:13
  • You can share the search criteria just as easily with both designs. – Brian Apr 3 '17 at 16:09
0

I do agree for using infinite scrolling, but the loading should be according to user need (put a load more button), instead of automatic loading when user is reaching the end of the page.

Regular pagination i believe is a feature that will disappear soon enough..

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.