alphagov / govuk-frontend

GOV.UK Frontend contains the code you need to start building a user interface for government platforms and services.
https://frontend.design-system.service.gov.uk/
MIT License
1.18k stars 325 forks source link

Pagination `aria-label="results"` does not inform the user of the purpose of the region #3684

Closed CharlotteDowns closed 1 year ago

CharlotteDowns commented 1 year ago

This issue is from May 2023 external accessibility audit report.

Usability issue

Issue ID: DAC_Usability_Pagination_02

URLs: https://govuk-frontend-pr-3503.herokuapp.com/full-page-examples/search-three-pages

Screen shots

Pagination component options

The pagination region has been marked up within a <nav> element. However, this <nav> has been provided with an accessible name of ‘results’. This does not inform the user of the purpose of the region and does not convey that it contains the pagination options. As screen reader users will often navigate via regions, it is important that they are labelled adequately.

Current code ref(s)

#main-content > form > div.govuk-grid-row > div.govuk-grid-column-two-thirds > nav

Solution

All labels should be descriptive and inform users of screen reading assistive technologies of the purpose of the region, allowing them to easily discern what content is contained within the said region. Consider changing the value of the ‘aria-label’ to ‘Results pagination’.

querkmachine commented 1 year ago

I'm happy with that change to the default.

In the case of the block links (the stacked previous and next links), I believe the expected case here is for related content that has been split over multiple pages, rather than a list of results. Is there a reason we shouldn't use a more generic 'Pagination' label to cover both bases?