Pagination

Notes on Implementation

We implement Bootstrap’s Pagination component, with some tweaks to the visual appearance. The documentation for Bootstrap Pagination is applicable.

Accessibility Notes

To meet accessibility standards, it is recommended to provide a descriptive aria-label for the navigation elements to indicate its purpose. For example, if pagination is used to navigate between lists of search results, the appropriate label could be aria-label="Search results pages". Also, adding aria-current="page" to the active/current page is helpful for assistive technology to inform users of the currently selected page.

Examples

With Active States

Without Active States