Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

UI: A11y: Use the lang= attribute to help screen-readers recognize localized aria attributes #1860

Open
joeyparrish opened this issue Apr 3, 2019 · 3 comments
Open

UI: A11y: Use the lang= attribute to help screen-readers recognize localized aria attributes #1860

joeyparrish opened this issue Apr 3, 2019 · 3 comments
Labels
component: UI The issue involves the Shaka Player UI priority: P3 Useful but not urgent type: enhancement New feature or request
Milestone
Backlog

Comments

@joeyparrish
Copy link
Member

Have you read the FAQ and checked for duplicate open issues?
Yes

Is your feature request related to a problem? Please describe.
It is not clear that our translated aria attributes will be correctly read by screen readers.

Describe the solution you'd like
First, we should test this using the localized UI and a screen-reader that understands a language other than English. For example, I find that this W3 page about lang attributes (appropriately) renders in German for me (based on my browser preferences) and uses lang="de" in the HTML.
If a screen-reader can correctly pronounce a non-English version of this page, then we know how things should work.

Second, we should test our demo page with a non-English UI. If the non-English aria labels are not correctly read, we should try adding lang= to the video controls container when the locale changes. Alternately, we could add lang= to the individual divs and spans to handle the case where some translations are missing. This should work, but hasn't been tested.

Describe alternatives you've considered
I don't know of any alternatives to lang=.
@joeyparrish joeyparrish added the type: enhancement New feature or request label Apr 3, 2019
@joeyparrish joeyparrish added this to the v2.5 milestone Apr 3, 2019
@joeyparrish joeyparrish self-assigned this Apr 3, 2019
@joeyparrish joeyparrish added the component: UI The issue involves the Shaka Player UI label Apr 3, 2019
@joeyparrish
Copy link
Member Author

The ChromeOS screen reader (ChromeVox) seems to read the whole page to me in German, including the English text. So the UI's German aria labels are correctly read in German. But since the demo app itself is not localized, it may make sense to tag the entire page with <html lang="en"> for now and then change the lang= attribute on the video controls when we change locales in the video controls.
@joeyparrish
Copy link
Member Author

We actually already have <html lang="en"> on the demo app. It doesn't seem to affect the pronunciation in ChromeVox, at least on ChromeOS. It is probably still worth checking with other screen readers or on other platforms. I've seen ChromeOS have unique behavior with regards to language in other areas.
shaka-bot pushed a commit that referenced this issue Apr 3, 2019
@joeyparrish
Fix aria-pressed in text selection menu
7ea43bc 
During a screen reader pass for #1860, I noticed that the state of
this button never changed.  The aria-pressed attribute was calculated
when the UI was created, but never updated.  This fixes it to update
whenever the caption state changes.

Change-Id: I742aa54278a0bd2ebdcb4b1b32189dabfe940c48
@joeyparrish joeyparrish removed their assignment Apr 11, 2019
@joeyparrish joeyparrish self-assigned this May 2, 2019
@joeyparrish
Copy link
Member Author

It looks like we can set lang= on individual elements based on which locale we used when we localized that string.
@joeyparrish joeyparrish modified the milestones: v2.5, Backlog May 7, 2019
@joeyparrish joeyparrish removed their assignment Jul 10, 2019
@joeyparrish joeyparrish modified the milestones: Backlog, Backlog 2 Jan 28, 2020
@joeyparrish joeyparrish added the priority: P3 Useful but not urgent label Sep 29, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: UI The issue involves the Shaka Player UI priority: P3 Useful but not urgent type: enhancement New feature or request
1 participant
@joeyparrish