search

UniversalViewer / universalviewer

A community-developed open source project on a mission to help you share your 📚📜📰📽️📻🗿 with the 🌎
http://universalviewer.io
Other
491 stars 191 forks source link

Accessibility issue: insufficient label on attribution box close button #1075

Open scoutb-cogapp opened 2 months ago

scoutb-cogapp commented 2 months ago

UV version: universalviewer@4.0.25

I'm submitting a: bug report => please fork one of these codesandbox examples with a repro of your issue and include a link to it below

Page area

close button for attribution box

Issue description

The accessible label for the close button for the attribution box is "close". It is hard for a screenreader user to assess what this button is meant to close. Even having the text above and below the button read out by the screenreader will not make it 100 percent obvious what the button closes (especially as the button appears to be positioned between the heading of the box and its content).

Steps to reproduce

To observe what a screenreader user experiences:

  1. activate a screenreader
  2. open this manifest
  3. navigate to the attribution box by tabbing and listen to what is announced
  4. attempt to find out more about the close button by further navigating using the keyboard and screenreader

Expected behaviour

Button should be announced in a way that a non-sighted user would understand its context and purpose.

Possible fix

Change accessible label to something along the lines of "close attribution box"

WCAG criterion

2.4.4 Link Purpose (In Context) (Level A)

Related code

<button type="button" class="close" aria-label="Close"> <span aria-hidden="true">×</span> </button>
LlGC-mag commented 5 days ago

I'll have a crack at this one

LlGC-mag commented 5 days ago

Code should be ready for this one, I just need translations for "Close attribution panel" in French, Polish, and Swedish before committing

demiankatz commented 5 days ago

@LlGC-mag, do you have a PR for this one open yet, or are you waiting for the translations first?

LlGC-mag commented 4 days ago

@demiankatz James kindly got in touch with his friendly Swede so I'm just waiting for French and Polish.

Not sure what's preferred with UV translations - would you normally submit the PR / merge and add translations later or wait for the translations so it's complete before merging?

demiankatz commented 4 days ago

Not sure what's preferred with UV translations - would you normally submit the PR / merge and add translations later or wait for the translations so it's complete before merging?

Yes, I'd suggest opening the PR right away but putting it in "draft" mode so it doesn't get merged prematurely. That way, if any code review is needed, that can happen in parallel with the translation work.