Component

Pagination

Pagination is the process of dividing information between multiple pages instead of showing it all on a single page; also the name usually given to the interface used for navigating between pages.

Updated: April 3rd, 2019

1 min read

14 examples

Description

Pagination is the process of dividing related content between multiple pages. Like pages in a book, these pages are ordered in a sequence. The term pagination is also used for the interface controls used to navigate between pages.

The most basic pagination controls are simple 'next' and 'previous' buttons.

Usage guidelines

Markup

  • As pagination is a form of navigation you should put them in a <nav> element.
  • Add a meaningful label such as aria-label="Pagination" to the <nav> element to differentiate it from other navigation landmarks.
  • Add the aria-current="page" attribute to the item which represents the current page.