WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: can you make a native <select>/<option> honor the LANG attribute?


From: Steve Green
Date: Dec 17, 2020 2:04PM

There is another curious twist. If you put a "lang" attribute on the <select> element, JAWS ignores it if you press the spacebar to open the list of options and arrow through them. However, if you go into forms mode and arrow through the options while the list is closed, JAWS does honour the "lang" attribute.

Steve Green
Managing Director
Test Partners Ltd

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Birkir R. Gunnarsson
Sent: 17 December 2020 20:14
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] can you make a native <select>/<option> honor the LANG attribute?

Yeah, this is a tricky one.
So, ideally, (and not everything is ideal), changing the langauge should be a click action, as opposed to a select/focus action.
If possible, I'd code it as a series of links (if it loads a different
page) or toggle buttons (if the content on the page is updated).
Activating the button would update the langauge of the page.
I know the lang attribute works on a link, I'd have to test if it works on a button.
So, if you have control and if you don't have hundreds of languages, I'd use links or buttons for language change, not a dropdown.
For the rest, well, I think you'd have to use a custom dropdown and see if that works. If the native one cannot update the language, it'd be a good enough reason for creating a custom one.
I'm also curious what the behavior is like for radiobuttons.

On 12/17/20, glen walker < <EMAIL REMOVED> > wrote:
> I love to demo how JAWS will switch voices/accents when it encounters
> language changes on a webpage. (I have not been able to get NVDA to
> do that, even when I have different languages installed.)
> When there's a feature to change the language, and the feature is a
> custom element, it's easy to put the LANG attribute on the different
> language elements. But if we want to honor semantic html and
> encourage the first rule of ARIA use and recommend the use of a native
> <select> over a custom combo, how do you get the language honored?
> For example, if you go to the UPS home page,
> https://www.ups.com/us/en/global.page (if you've been to UPS before
> and already selected a language, you'll have to bring up a private or
> incognito browser window to get the language selection again), there
> are options to choose your location. The list of languages has the
> LANG attribute on the <li> elements. JAWS switches accents just fine.
> But if you go to Thoughtexchange,
> https://my.thoughtexchange.com/scroll/693698427, they have a native
> <select> for the languages. I tried putting the LANG attribute on the
> <option> elements (via the code inspector) but it didn't cause JAWS to
> change languages. (On other pages where I add LANG dynamically via
> the code inspector, it works, so this isn't an issue with JAWS not
> updating its buffer or anything. I also tried adding LANG before
> starting JAWS.)
> LANG is a global attribute (
> https://www.w3.org/TR/html53/dom.html#global-attributes-2) so
> technically can be used on any element and in theory should work on <option>.
> Perhaps this is a bug in the browser not surfacing the language to
> assistive tech. I tried it on Firefox, Chrome, and Safari. VoiceOver
> is similar to JAWS in that it'll switch voices based on the language.
> The UPS page works with Mac/VoiceOver but a <select>/<option> with the
> LANG attribute does not.
> Is this a case where we would recommend a custom element instead of a
> native one?
> > > archives at http://webaim.org/discussion/archives
> >

Work hard. Have fun. Make history.