WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Text concatenation fault with Chrome and the "clip" technique for hiding text


From: Birkir R. Gunnarsson
Date: Mar 27, 2020 6:34AM


Can you change the examples so that the second word starts with a
vowl? That makes the problem much more noticeable (because screen
readers try to make up a new word).
I've noticed this problem too but thought it had to do with use of
inline elements (<span> elements) that do not insert space.
E.g. a screen reader only <span> with the text "opens in new tab" for
links with target="_blank".
But based on your examples this problem also appears with use of block
level elements and has to do with the CSS not the underlying element.

On 3/27/20, Steve Green < <EMAIL REMOVED> > wrote:
> Which browser are you using?
> Steve
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
> Jonathan Cohn
> Sent: 27 March 2020 12:11
> To: WebAIM Discussion List < <EMAIL REMOVED> >
> Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip"
> technique for hiding text
> Just as an FYI, on Macintosh Voiceover reads change and password as separate
> phrases.
> Best wishes,
> Jonathan Cohn
>> On Mar 26, 2020, at 10:03 PM, Steve Green < <EMAIL REMOVED> >
>> wrote:
>> I have just encountered a weird issue with hidden text, which I have never
>> seen before. These days we recommend using the "clip" technique to hide
>> text rather than hiding it off-screen, because it works with both LTR and
>> RTL languages. However, with JAWS 2019 and 2020 and Chrome, I am getting
>> concatenation of the hidden and visible words, which is causing
>> mispronunciation.
>> This does not occur with Firefox, Internet Explorer or the old version of
>> Edge, but it does occur with the new version of Edge based on Chromium.
>> I have created a test page at http://tpl1.com/hidden_text.htm if anyone
>> wants to take a look.
>> You can hear the mispronunciation easily enough, but you can also check by
>> reading word by word or letter by letter. There appears to be no space
>> character between the concatenated words, even though there are spaces in
>> the source code.
>> The "solution" is to remove the "position:absolute" style rule, but the
>> layout then breaks, which means we can't do that.
>> Has anyone else encountered this, and does anyone have a solution? Has
>> this always happened or has something changed in Chrome? I may be wrong,
>> but I don't think this is a JAWS bug because it only happens in
>> Chromium-based browsers.
>> I have seen several variants of the "clip" technique and I tested my test
>> page with a couple of them. In both cases the only thing that made a
>> difference was the "position:absolute" style rule, so I expect that will
>> be the case with all the variants.
>> Regards,
>> Steve Green
>> Managing Director
>> Test Partners Ltd
>> 020 3002 4176 (direct)
>> 0800 612 2780 (switchboard)
>> 07957 246 276 (mobile)
>> 020 7692 5517 (fax)
>> Skype: testpartners
>> www.testpartners.co.uk
>> Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2
>> >> >> archives at http://webaim.org/discussion/archives
>> >
> > > http://webaim.org/discussion/archives
> > > > > >

Work hard. Have fun. Make history.