Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I'm currently making a dating site, my choice for pagination is between the traditional:

[<< Prev] [1] [2] [3] [Next >>]

vs

[ Load More ]

The 2nd is the "load more" bar or button that is on a couple of popular sites now like twitter and facebook. Either way the results will be delivered via ajax without page reload.

Being a developer and not a ux person I was wondering what you guys think would be more appropriate and user friendly for a site like this? Basically there is a search form with lots of filters at the top of the page and when the user chooses their options and hits submit the results and pagination will appear on the same page underneath the form.

If I do go with the load more type pagination, would it be better to make it auto loading (i.e. when the user reaches the bottom of the page more results load without them having to do anything) or load more only on click?

I personally find auto loading annoying but I have no idea how the majority of audiences feel about it.

share|improve this question
3  
I don't see how 'dating site' is a relevant criteria. WHAT are you actually paginating? –  DA01 Jan 10 '12 at 23:30
3  
Is there any reason they would need to directly access page 2? Are the pages always dynamic (IE at any given time page 2 can not be sure to have the same content)? If the answer to both is no I'd seriously consider a simple load more or infinite scrolling –  Ben Brocka Jan 10 '12 at 23:40
    
@DA01 I'm paginating member profiles. The results feature boxes with a pic of the member, their username, age, sex, etc. which when clicked leads to their profiles. –  Sammy Jan 10 '12 at 23:50
6  
"Dating site" suggests to me that it is member profiles being paginated. It also suggests to me that they are likely presented in some order of (magical) relevance, and thus there isn't much value in having the facility to random-access deeper pages. The user will want to start at the top, and then progress until they either find what they want, get bored, or reach some limit of quality. –  Erics Jan 11 '12 at 0:22
5  
Some useful answers posted to a similar question on ux.se here: ux.stackexchange.com/questions/2020/… –  JonW Jan 11 '12 at 9:09

6 Answers 6

up vote 23 down vote accepted

[ Load More ] is certainly more "friendly" than a set pagination links, but there is no indication of how much more data there is that could be viewed, unless you add something else that gives that information - assuming it's available. If you don't know the total number of matches (thanks @Erics) then [ Load More ] is ideal.

So, is it important for the user to know that there are 3 (or 5) pages of possible matches or will they be happy to keep clicking [ Load More ] until they either a) find a match or b) get bored?

I think whether you use auto loading is a personal preference. Personally I find it annoying as I expect to scroll to the bottom of the page and see an indication of how much data there is still left to view.

share|improve this answer
4  
I find it annoying as well, especially on Google Image Search since my browser starts slowing down when there are hundreds of images loaded in memory on a single page. And it's also a pain when I have to refresh the page (e.g. return to the search page from a result, restart the browser, etc.) and have to slowly load 200 images just to reach the result I'm looking for. Terrible UX IMO... –  Lèse majesté Jan 11 '12 at 8:01
6  
On the other hand [load more] is well suited when there is an unknown number of matches. –  Erics Jan 11 '12 at 12:38

I have the same opinion as you: I am not fond of infinite scroll. Tough, with time, this might change.

In his blog post The End of Pagination, Jeff Atwood makes the point that

Above all else, you should strive to make pagination irrelevant because the user never has to look at more than a few items to find what they need
This satement does not quite holds in the context of online dating where the user is likely to go back and forth quite a bit with the search results.

So my advice would be: whatever choice you end up with, make it easy to the user to browse a profile page, go back to the results page, browse a new profile page, go back to results, and so on. I would also try different browsing habits: either do this scenario with only one tab open, or by opening a new tab when checking a profile page. (this opens two questions. One: is it easy to open a profile link in a new page by middle clicking. Watch out for this kind of behaviour. Two: should you be able to go back with a link to the results page once you opened a profile in a new tab? Because in this case you cannot hit the browser back button.)

Jeff Atwood also points out some of the drawbacks of endless pagination, or infinite scroll:

  • The scroll bar, the user's moral compass of "how much more is there?" doesn't work in endless pagination because it is effectively infinite. You'll need an alternate method of providing that crucial feedback, perhaps as a simple percent loaded text docked at the bottom of the page.
  • Endless pagination should not break deep linking. Even without the concept of a "page", users should be able to clearly and obviously link to any specific item in the list. Clicking the browser forward or back button should preserve the user's position in the endless scrolling stream, perhaps using pushState.
  • Clicking the browser forward or back button should preserve the user's position in the endless scrolling stream, perhaps using pushState.
  • Pagination may be a bad user experience, but it's essential for web spiders. Don't neglect to accommodate web search engines with a traditional paging scheme, too, or perhaps a Sitemap.
  • Provide visible feedback when you're dynamically loading new items in the list, so the user can tell that new items are coming, and their browser isn't hung – and that they haven't reached the bottom yet.
  • Remember that the user won't be able to reach the footer (or the header) any more, because items keep appearing as they scroll down in the river of endless content. So either move to static headers and footers, or perhaps use the explicit "load more" button instead of loading new content automatically.
share|improve this answer

I think of it this way:

  • If you want for users to see more and more pages non-stop you should use auto-pagination (not just appending at the end of the content after manual clicking). You can set threshold of showed pages, limit to unviewed results or give user corresponding setting for this mode to prevent informational overload on their side. Don't use manual [Load More] button before reaching that threshold n-th time because it gives this method shortcomings of classic pagination without giving additional benefits. You can do periodical history.pushState so user can continue from the last results viewed if page gets slow or crashes.
  • If you want people to concentrate their attention only on a several first pages (some kind of promotion system in place) or it's natural result of the search algorithm (later results are less and less relevant), offload server or have simple possibility to return to a certain subgroup of results (like around certain dates) it's time for classic pagination.

In any case nobody prevents you from adding personalized option for users to chose what they like more and even use (temporary) A/B testing with its default setting to see what people really like in your case.

share|improve this answer

Either way the results will be delivered via ajax without page reload.

One thing to consider is that a user may be inclined to user their back button if you go the pagination route. Something like "Hey, I should go look at that person on page 2 again..." If the results are added via ajax the browsers back button isn't automatically going to take them to the previous results.

**

http://danwin.com/2013/01/infinite-scroll-fail-etsy/

Found this just a couple days after posting my answer. Interesting read on why infinite scroll failed at etsy. I haven't checked out the presentation/slides yet but plan to.

share|improve this answer

One thing I don't think many people think about with infinite scroll is it essentially makes any UI elements you have in the footer area unreachable.

If you have a fat footer with useful links across many/all pages of your site, an infinite scroll will create a jarring experience. The user scrolls to the bottom, sees the footer for a second or two, and then sees the new result set push the footer down out of view.

It turns into a game of hide and seek and for some users that can become very frustrating.

share|improve this answer
1  
I was able to solve this problem by floating the footer after the first set of results: github.com/Hawkers/scrollAppend –  Hawkee Dec 24 '12 at 15:56
    
Also you can add a control (that is scrolled with page) to temporary disable pagination. –  DitherSky Jan 9 '13 at 15:39

You should consider the problem the user might try to solve when he is looking at your list. Is he browsing like we do in Twitter or Facebook streams, then use "load more". Is he trying to find certain information he might want to revisit again later you should go for pagination - for reasons already pointed out by all those smart people here. :-)

share|improve this answer
    
+1 - Not having used a dating site, I'd first want to know how the user is browsing. Do they want a fast scanning system where they can see and comapre possible matches or are they more in a window shopping type mentality? –  TheSaint Apr 10 '13 at 9:35

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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