Views using pagination must have a meaningful machine name

Context

By default, pagination <nav> are named as just "pagination" (API code snippet). If a page has multiple paginations, especially due to multiple view blocks with pagination, it becomes harder to know which "pagination" <nav> element is the desired navigation to use.

To make each label distinct, we've updated the template to be more dynamic based on the view's machine name, so it says "Pagination for [machine name]". However, by default view blocks/pages are named as "block_1", "page_1", etc., which means the name of the <nav> becomes "pagination for block 1/block 2/etc." or "pagination for page 1", which is too vague to understand the purpose of the navigation.

Decision

If using a pagination on view displays, we must update the machine name setting in the view's config to a meaningful name so the <nav> aria-label can update accordingly.

Example: policy search

The view's machine name under Advanced --> Other is updated to "all_policies" (note each word in the name must be separated by an underscore):

The view settings contains three panels of content, highlighting the machine name value under Advanced

The pagination's <nav> element then gets an aria-label value of "Pagination for all policies":

<nav class="pager" aria-label="Pagination for all policies"> 

For assistive technology that rely on page semantics, such as screen readers, this gets conveyed as "pagination for all policies, navigation". This label is much clearer in its semantic purpose and identifies what the pagination is for.

Status

Consequences

  • The machine name is an easy setting to miss in the view config, so view builders/site authors will need to be mindful of remembering to adjust that setting if the display uses pagination.
  • When adjusting the machine name, the view will often break the display on the page. Authors and view builders will need to re-add the display/block to the page after they've updated the machine name.