WebAIM - Web Accessibility In Mind

E-mail List Archives

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

for

From: Moore,Michael (Accessibility) (HHSC)
Date: Mar 27, 2020 7:46AM


We have noticed the same type of behavior in multiline headings in MS Office documents and PDFs where we use a soft break to separate the lines. The solution it to remember to put a space either before or after the soft break and then the screen reader will not run the words together. I would imagine that a similar solution would work within HTML by using a nonbreaking space but don't have the bandwidth right now to set up an experiment.

Stay safe,

Michael Moore
EIR Accessibility Supervisor
Civil Rights Office
  
  #TeamTexasHHS
  #TeamHHSProud
 
  
I am currently working remotely. Please use 512-574-0091 to reach me by telephone.

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Steve Green
Sent: Friday, March 27, 2020 8:40 AM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip" technique for hiding text

WARNING: This email is from outside the HHS system. Do not click on links or attachments unless you expect them from the sender and know the content is safe.

I added an example that should be read as "Delete odd numbers". It should be easy to hear the concatenation of the first two words.

I tried a few more things and found that the concatenation occurs with <div>, <span> and <h3> elements, and presumably all other heading elements. It also occurs if the words are not enclosed in any element at all if they are followed by a <br> element. The whole thing is so weird that I am not going to bother doing any more diagnosis.

Steve


-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Birkir R. Gunnarsson
Sent: 27 March 2020 12:35
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip" technique for hiding text

Steve

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
>> <EMAIL REMOVED>
>> www.testpartners.co.uk
>>
>> Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2
>>
>> >> >> archives at http://webaim.org/discussion/archives
>> >
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >


--
Work hard. Have fun. Make history.