Synonyms: Page navigation

See also: Scrollbars

Pagination is used to navigate through pages or sequential elements (for example, with tables).

The requirements for the individual control elements are described for the respective control element.

Figure 54: Pagination
817ContrastThe highlighting for the current page must have a contrast ratio of at least 3:1 with respect to the background and the other pages.MustEN 301 549:,
818Use of the keyboardIt must be possible to access, operate and exit the page navigation with the keyboard (see Use of the keyboard table, below).MustEN 301 549:,,,
819UpdatesWhen focusing and using the control elements for the page navigation, no unexpected change of context

Use of the keyboard: page navigation

Permalink "Use of the keyboard: page navigation"
Focusing of the first element of the page navigationTABRequired
Exiting the page navigationTABRequired
Navigating within the page navigationTAB or ARROW buttons (depending on the used elements)Required
Operating interactive elements in the page navigationCorresponding to the respective elementRequired
Navigating to the previous or next page (if the focus is in the element which is controlled by the page navigation)PAGE UP, PAGE DOWN
ARROW keys
Navigating to the first or last page (if the focus is in the element which is controlled by the page navigation)POS 1, ENDRecommended
821NameEach control element of the pagination must have a concise and expressive Accessible Name<” and “>”, the Accessible Name should be called
  • either “page 1”, “page 2”, “page 3” and/or “previous page” and “next page”, or
  • “1”, “2”, “3” and/or “back” and “forward”, and the buttons should be located in a group
-@ @- Note 2: If the context of the pagination is visually clear but programmatically unclear (because the pagination might refer to a page or table on the page, for example), this context should be communicated the Accessibility API (with the Accessible Name, the Accessible Description, or the labelingElement status

Information about this article

You are welcome to send feedback by email about our handout!