wet-boew/GCWeb

[BUG] Canada.ca Menu - aria-label exceeds 250 characters

alfredoscaini opened this issue · 1 comments

Required information

Description
There is currently an aria-label attached to the 'Menu' button. The attribute length exceeds 250 characters. This is cumbersome for a screen reader user and really redundant. Persons who use these tools are aware of how keyboard navigation works.

The issue is this text which is intended to assist users who are blind but sighted users use keyboard navigation as well. Keyboard users are also persons with mobility or cognitive disorders. We cannot assume only a blind user would need this information.

It forces a user to listen to this text every time they go to the main navigation very cumbersome and not really effectively required.

To Reproduce

  1. Go to Canada.ca's homepage https://www.canada.ca/en.html
  2. Observe the Menu (aria-label)
  3. Scroll down to '....'
  4. See error

Expected behaviour
Consider shortening this label text (or removing). It is not providing an equal experience for all users. It also is not required for screen reader users they already know how keyboard navigation works.

Who shall do the work?
I am asking for Principal publisher to please do the work

Additional information (optional)

Desktop/Smartphone (please complete the following information)

  • Chrome Version 100.04896.127 (Official Build) (64-bit)
  • Firefox Version 91.9.0esr (64-bit)
  • Tool used: Keyboard / Screen reader / ANDI

Screenshots
If applicable, add screenshots to help explain the bug.

Additional context
WCAG 2.0 Success Criterion 2.1.1 Keyboard (Level A)

Moved this over to GCWeb since it's unrelated to WET (not to mention WET's mega menu doesn't have similar behaviour).

On a side note, I find aria-label to be kind of an odd choice as things stand. That setup causes screen readers to announce the button's description instead of its actual label ("Main menu"). On my end, Firefox + NVDA end up announcing "menu button" somewhere along the way... but I'm not sure where it's picking up "menu" from :S (still says that even when I rename all "menu" content and menu-related markup in devtools).