accessibility:pagination
Pagination
The US Web Design System's usability guidance on pagination is very thorough. Some brief highlights:
- Wrap the list in
<nav>
and use an unordered list for individual items. The<nav>
tag should have anaria-label
attribute, and the label should serve to distinguish this from the main navigation menu. - User
aria-current="page"
on the current page link. Do not write the current page as plain text without a link; this breaks the ARIA labeling pattern. - On each page number link, use
aria-label="page [N]"
to prefix the numeric page number with the word "page" (that is, do not allow the page numbers to be read as a sequence of numbers without context) - Use
aria-label="last page, page [N]"
on the link to the last page - Always show the complete number of items in the paged set ("Search results 1-10 of 73"). This should be part of the pagination component itself even if it is also announced elsewhere.
accessibility/pagination.txt · Last modified: 2024/02/05 16:53 by scl