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.