Loading component...
Usage
Pages are shown in sets of five. Pages can be shown with buttons or links. Use buttons when the search page’s URL doesn’t change and the search results content is replaced in the page. Use links when the search page’s URL does change.
Pagination is usually paired with filter selects for results per page and sorting options.
Do:
- Use to show a large set of content in a series of smaller sets
- Pair with a results per page select
- Use buttons when the search page’s URL doesn’t change
- Use links when the search page’s URL does change
Don't:
- Show too many pages at the same time, the component will show pages in sets of five
- Use to show linear content, such as a stepped flow
- Mix page buttons and links
User research
Key takeaways
First and last pages
Pagination was introduced specifically for search results. Due to users’ tendency to search for a new term or filter results rather than page through results, we have omitted the ability to jump to the first of last page of results. If you have a use case in which these actions are necessary, please review how to contribute a new use case.
Study links
Primary sources (BSC user research)
No BSC sources
Secondary sources
Accessibility
This component passes AAA WCAG standards. However, changes made by the content owner or implementer could impact accessibility compliance. Be sure to follow code standards, usage guidelines, and content guidelines to ensure that the text input is fully accessible.