WordPress.org

Make WordPress Core

Opened 2 months ago

Closed 6 weeks ago

#41589 closed defect (bug) (fixed)

Add aria-current="page" to the admin menu current item

Reported by: afercia Owned by: afercia
Milestone: 4.9 Priority: normal
Severity: normal Version:
Component: Administration Keywords: aria-current has-patch
Focuses: accessibility Cc:

Description

See also #40833.

The aria-current attribute is a simple, effective way to communicate to assistive technologies users which is the current item within a set of items. It can take different kind of values, depending on the nature of the set of items. Reference: https://www.w3.org/TR/wai-aria-1.1/#aria-current

For a navigation menu, the appropriate value is page. All the major screen readers support it in their latest versions. Code examples, support table, and demo videos by Léonie Watson: http://design-patterns.tink.uk/aria-current/

I'd propose to add aria-current="page" to the current item in the admin menu. The only issue there is that the top-level item is repeated also as a sub-item:

https://cldup.com/k_GYp6VZ03.png

In this case, I'd propose to add aria-current="page" to the sub-item, so it's on the same item that has the current CSS class. This would work well also in the responsive view, where the active group of items is always expanded. Worth noting the menu in the responsive view could be further improved for accessibility, but that's a bit out of the scope of this ticket.

Attachments (1)

41589.diff (2.2 KB) - added by afercia 2 months ago.

Download all attachments as: .zip

Change History (6)

@afercia
2 months ago

#1 @afercia
2 months ago

  • Keywords has-patch added
  • Milestone changed from Awaiting Review to 4.9
  • Owner set to afercia
  • Status changed from new to assigned

41589.diff is a first pass and uses the already existing $aria_attributes variable to set the aria-current attribute. Tested also with some plugins that add their menu items and sub-items: of course, it works if plugins use the methods that core provides, it doesn't when plugins use custom methods. In that case I'd say it's a plugin authors responsibility.

#2 @Cheffheid
2 months ago

Should this apply to any link that goes to the "current" page, or is that a bit out of the scope of this ticket?

Example: The "Add New Post" link that's both in the left sidebar and the top bar. Or the Comments and Updates links.

Looks good to me so far though :)

#3 @afercia
7 weeks ago

@Cheffheid no, the aria-current attribute is meant to distinguish the active link within a set of links. See https://www.w3.org/TR/wai-aria-1.1/#aria-current

#4 @SergeyBiryukov
6 weeks ago

Tested 41589.diff, looks good to me.

#5 @afercia
6 weeks ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 41359:

Administration: Admin menu: Use aria-current for the current active page.

The aria-current attribute is a simple, effective way to communicate to assistive
technologies which the current item within a set of items is. While the admin menu
structure isn't 100% ideal (the top-level item is repeated also as a sub-item)
adding aria-current="page" to the sub-items gives an important feedback to
assistive technologies users.

This change introduces aria-current for the first time in core. Worth noting
there are other places where it can be used to improve accessibility. These should
be addressed in separate tickets and patches.

Fixes #41589.

Note: See TracTickets for help on using tickets.