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 navigate between, while infinite scroll loads more content as you scroll down. Pagination gives users control and lets them know where they are; infinite scroll offers a smooth, continuous 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 isn’t important. 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.