Problem/Motivation

If you are using the rotor in VoiceOver on MacOS each of the top level menu items has an abbreviation of the menu items label prefixed. Which makes it sort of confusing and harder to skim for screen reader users.

the navigation sidebar with the voiceovercurosr on the toplevel menu item for appearance and the rotor showing the links section next to it

Steps to reproduce

  • Install Drupal core on the latest 11.x
  • Enable Navigation module
  • Add a custom menu item to the Administration menu under "Administration"
  • Open the rotor in VoiceOver on MacOS while on any page in the Admin UI

Proposed resolution

Hide the prefixes to screen readers. The prefix is meant to be decorative, for sighted users when there is no icon.

Remaining tasks

Research https://dev.to/whitep4nth3r/hide-text-in-css-pseudo-elements-from-screen...

User interface changes

Hide decorative abbreviation text which is used when there is no icon.

CommentFileSizeAuthor
#10 with_MR.jpg80.35 KBrkoller
#10 without_MR.jpg84.72 KBrkoller
prefix.jpg111.31 KBrkoller

Issue fork drupal-3475979

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

rkoller created an issue. See original summary.

ekorzen2 made their first commit to this issue’s fork.

finnsky’s picture

finnsky commented
Status: Active » Postponed

We will remove when we will have clean icon management https://www.drupal.org/project/drupal/issues/3432173 until this it looks impossible.

finnsky’s picture

finnsky commented
Issue summary: View changes
finnsky’s picture

finnsky commented
Status: Postponed » Active

We need to apply this here for items which does not have icons.
Should be enough imo.

https://dev.to/whitep4nth3r/hide-text-in-css-pseudo-elements-from-screen...

m4olivei’s picture

m4olivei
he/him
Primary language English
Location Grimsby, ON
commented
Issue summary: View changes

m4olivei opened merge request !11374

m4olivei’s picture

m4olivei
he/him
Primary language English
Location Grimsby, ON
commented
Status: Active » Needs review

This was a tiny bit tricky b/c we need PostCSS to not mess up the form that is required to provide the empty alt text. Should be OK now. Needs browser testing, but Can I Use shows 91%: https://caniuse.com/?search=content%20alt%20text

m4olivei’s picture

m4olivei
he/him
Primary language English
Location Grimsby, ON
commented
Issue summary: View changes
rkoller’s picture

rkoller
he/him
Primary language German
Location Nürnberg, Germany
commented
Status: Needs review » Reviewed & tested by the community
StatusFileSize
new without_MR.jpg84.72 KB
new with_MR.jpg80.35 KB

thank you! i've manually tested on macOS Sequoia 15.3.1 with Safari 18.3, latest Firefox, and latest Edge - the voiceover output is the same in all three browsers. it looks like the prefixed abbreviations got already removed for default menu items with icons without the MR applied, but menu items without an icon still show the abbreviation:

the navigation sidebar on the left and the rotor showing the links section on the right with the voiceover cursor on the menu item test and the link with a te suffix

With the MR applied those abbreviations get also hidden/removed for menu items that do not have an icon:

the navigation sidebar on the left and the rotor showing the links section on the right with the voiceover cursor on the menu item test , the link shows no te suffix

so overall that looks good to go. since the MR is following the approach suggested by @finnsky in #5 i think it would be ok to set the issue to RTBC.

nod_ made their first commit to this issue’s fork.

nod_ closed merge request !11374

  • nod_ committed 7257036e on 11.x 
    Issue #3475979 by m4olivei, rkoller, finnsky: Remove prefixed...
nod_’s picture

nod_
Primary language French
Location Lille
commented
Status: Reviewed & tested by the community » Fixed

thanks for the extra check

Committed 7257036 and pushed to 11.x. Thanks!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.