Opened 2 years ago

Last modified 22 months ago

#34041 assigned Cleanup/optimization

Accessibility improvements for admin breadcrumbs — at Version 7

Reported by: Thibaud Colas Owned by: Florian Perucki
Component: contrib.admin Version: dev
Severity: Normal Keywords: accessibility, landmarks, ARIA
Cc: Tom Carrick Triage Stage: Accepted
Has patch: yes Needs documentation: no
Needs tests: no Patch needs improvement: yes
Easy pickings: no UI/UX: yes

Description (last modified by Mariusz Felisiak)

There are two nice and simple accessibility improvements we could make to the Django admin’s breadcrumbs:

  1. (fixed in 872b61193b013a700ff88cf50f0eb2cf2c266ff7) Wrap them in a <nav aria-label="{% translate 'Breadcrumbs' %}>"> region, so they can be identified as a navigation landmark by screen reader users.
  2. Structure the links as a <ol> list with <li> items for each crumb, so screen reader users know how many items there are (visually they don’t need any changes)
  3. Switch the last item to also be a link, with a aria-current="page" attribute, so semantically the last item is marked as "current page" (again doesn’t necessarily need any visual change). Technically this would also work as a span but I believe switching to a link would be a nicer experience (consistent tabbing through all items in the breadcrumb)

All three improvements are based on the Breadcrumb ARIA authoring practices pattern. All can technically be done separately if desired.

Change History (7)

comment:1 by Mariusz Felisiak, 2 years ago

Triage Stage: UnreviewedAccepted

comment:2 by Mariusz Felisiak, 2 years ago

Type: New featureCleanup/optimization

comment:3 by Florian Perucki, 2 years ago

Owner: changed from nobody to Florian Perucki
Status: newassigned

comment:5 by Mariusz Felisiak, 2 years ago

Triage Stage: AcceptedReady for checkin

comment:6 by Mariusz Felisiak <felisiak.mariusz@…>, 2 years ago

In 872b6119:

Refs #34041 -- Added navigation landmark to breadcrumbs in admin.

Thanks Thibaud Colas for pair programming.

comment:7 by Mariusz Felisiak, 2 years ago

Description: modified (diff)
Has patch: unset
Triage Stage: Ready for checkinAccepted
Note: See TracTickets for help on using tickets.
Back to Top