ui patterns
Pagination vs infinite scroll
Pagination or infinite scroll - which should you use?
Two ways to handle a long list: pagination splits it into numbered pages you can jump to, while infinite scroll loads more as you scroll. Pagination shows your position and lets you skip to any section; infinite scroll offers a seamless flow without a clear end.
Also known as: infinite scroll vs pagination, load more vs pagination
Prefer to watch?
Watch the recap 0:42
The demo
A list of results, handled two ways. Try to reach the footer, or get to item 30 - then switch modes and see how differently each pattern treats you.
Scroll the list, or jump to a page, and watch how the footer behaves.
What this demo shows (text version)
A scrollable window containing a list of results. In pagination mode it shows one page of eight items at a time with numbered page controls beneath, and a footer (contact, terms, settings) sits directly below the pager, easy to reach. You can jump straight to any page, so reaching item 30 takes one click.
In infinite-scroll mode, scrolling to the bottom loads another batch of items automatically, which pushes the footer further down every time, so it becomes practically unreachable. There are no page numbers to jump with, and leaving and returning would lose your place. The demo lets you feel the trade-off: pagination gives control and a reachable footer; infinite scroll gives uninterrupted flow but orphans the footer and your position.
Use pagination when users need to find, compare, or return to a specific item; use infinite scroll for open-ended browsing where the end doesn’t matter. You can see and try both approaches in action on this page.
With pages you could jump straight to item 30 and the footer sat right there waiting. With infinite scroll you drifted happily for a while - then the footer kept fleeing and you lost any sense of where you were. Neither is better; they buy opposite things, and the demo lets you feel exactly what each costs.
Match the pattern to the task. Infinite scroll suits open-ended browsing with no target - a feed, a gallery - where flow matters and nobody wants to click "next". Pagination suits finding and returning: search results, tables, anywhere people need to judge how much there is, jump to a spot, or come back to the same place later.
Infinite scroll has two stings worth naming. It orphans the footer - links to contact, terms, settings become almost unreachable - and it breaks "back": leave and return and you are dumped at the top, your place lost. A "load more" button is the honest middle ground, keeping the flow but handing control back. Whatever you choose, never trap the footer.
Try ux pagination or infinite scroll in this live demo to see how each affects user flow and context. When users need to jump to or compare specific items, pagination wins; for open-ended browsing, infinite scroll feels more natural.
When deciding between ux pagination or infinite scroll, consider whether users need to jump to specific items or browse seamlessly. You can test both approaches interactively on this page - no screenshots or external tools required.
When deciding between pagination vs infinite scroll, consider whether users need to jump to specific items or browse without interruption - you can test both approaches live here. Pagination vs infinite scroll isn’t just about load speed - it’s about user intent, content structure, and how users navigate long lists - try them both on this page.
When choosing between pagination vs infinite scroll, consider whether users need to jump to specific items or browse seamlessly. You can test pagination vs infinite scroll in action on this page - interact with the live examples to see how each affects user flow.