Navigation pagination
Pagination allows long sets of data or content to be divided into multiple pages with controls to navigate between these pages.
Guidelines
When content will take a long time to load or is better viewed in smaller sets, pagination can be used to divide this content into multiple pages. Pagination only loads one page at a time.
Don’t
- Do not lazy load content as the user scrolls when using pagination.
Variations
There are three variations of pagination to use: Page numbers, Total + page numbers, Switcher + total + page numbers.
Interaction
The active page number always stays in the middle, shifting the previous numbers. For example, in pagination with five page buttons but ten pages—pages 1, 2, 9, and 10 will not be able to be centered when they are active, but the rest will be.