WordPress.org

Make WordPress Core

Opened 3 years ago

Last modified 19 months ago

#33002 new defect (bug)

List table: avoid redundant Edit links and reduce noise for screen readers

Reported by: afercia Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version: 4.2
Component: Administration Keywords:
Focuses: ui, accessibility Cc:

Description

Splitting this out from #32254.

In all the List Tables (except Comments) there are redundant adjacent "Edit" links. They have different text and they point to the same resource (the edit screen). For example, in the screenshot below "Scheduled" and "Edit" (the row actions one) serve the same purpose.

https://cldup.com/jY65ziCiL4.png

As pointed out in #32254 the row actions "Edit" link may represent some sort of feedback given to users about what they can do, specifically if they have permission to edit and I see the potential confusion in removing it.

On the other hand, that's completely redundant and confusing for screen reader users who will just hear the same information twice, multiplied for the default 20 items per page makes a total of 40 "Edit" links. Considering also the title attributes, screen readers will read out something like this:

Scheduled link  Edit “Scheduled”
Edit link  Edit this item

We should try to find a way to hide the redundant link just for assistive technologies. Would be a bit tricky since aria-hidden would silence screen readers but wouldn't remove the tab stop. Any thoughts more than welcome.

Attachments (1)

33002.diff (919 bytes) - added by iworks 3 years ago.

Download all attachments as: .zip

Change History (9)

#1 @afercia
3 years ago

  • Summary changed from List table: avoid redundant Edit links to reduce noise for screen readers to List table: avoid redundant Edit links and reduce noise for screen readers

#2 @rianrietveld
3 years ago

#31370 was marked as a duplicate.

#3 @iworks
3 years ago

  • Keywords has-patch added; needs-patch removed

Patched link title and added a aria-hidden (true). [Contributor Day WC Poland]

@iworks
3 years ago

#4 @afercia
3 years ago

Thanks very much Contributor Day WC Poland people and welcome :) Tested a bit the patch and unfortunately aria-hidden=true on links does silence screen readers (the link text is not read out) but the link itself is still a tab stop so it will be read out as "blank" when focused. Tested with Firefox + NVDA:

Hello world! visited  link  Edit “Hello world!”  <-- the post title
out of table blank                               <-- the row actions "Edit" link

Notice also NVDA lose the context and announces "out of table". We can't use tabindex=-1 cause keyboard users need to get to that link. We should strive to find a better solution, not so simple I guess. Also, this should be done in all the relevant screens, not just the Posts screen.

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.


2 years ago

This ticket was mentioned in Slack in #accessibility by rianrietveld. View the logs.


2 years ago

#7 @joedolson
2 years ago

  • Focuses ui added
  • Keywords has-patch removed
  • Milestone changed from Awaiting Review to Future Release

We discussed this ticket in the #a11y meeting, and concluded that there is no way to hide a link only to screen reader users that's a) complete and b) avoiding confusion for sighted keyboard users.

As such, what we recommend is addressing this in a UI redesign that would eliminate the edit link and add a visual indicator (perhaps an icon) that clearly indicates that the post title is a link to edit the post.

This ticket was mentioned in Slack in #accessibility by afercia. View the logs.


19 months ago

Note: See TracTickets for help on using tickets.