WebAIM - Web Accessibility In Mind

E-mail List Archives

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

for

Number of posts in this thread: 14 (In chronological order)

From: Steve Green
Date: Thu, Mar 26 2020 8:03PM
Subject: Text concatenation fault with Chrome and the "clip" technique for hiding text
No previous message | Next message →

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 ADDRESS REMOVED =
www.testpartners.co.uk
 
Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2

From: Murphy, Sean
Date: Thu, Mar 26 2020 8:12PM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

Steve,


Just tested using NVDA and Chrome. Below is what was spoken:

Changepassword
Make me a hamsandwich

I am assuming " Changepassword" is the concatenated word.

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

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

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 ADDRESS REMOVED =
www.testpartners.co.uk

Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2

From: Steve Green
Date: Thu, Mar 26 2020 8:42PM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

Thanks for checking that out. Changepassword is one of the concatenated pairs of words. Ham and sandwich are also concatenated, but it is less obvious.

I have updated the test page not only to make the fault more obvious, but with examples showing the surprising finding that the concatenation occurs when the hidden text is in a <p> element, but it does not occur when identical content occurs in <li> elements.

Steve


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Murphy, Sean
Sent: 27 March 2020 02:13
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip" technique for hiding text

Steve,


Just tested using NVDA and Chrome. Below is what was spoken:

Changepassword
Make me a hamsandwich

I am assuming " Changepassword" is the concatenated word.

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

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

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 ADDRESS REMOVED =
www.testpartners.co.uk

Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2

From: Murphy, Sean
Date: Thu, Mar 26 2020 8:44PM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

Steve,

This looks like a Chrome issue, not a screen reader issue. As I tested in NVDA and we saw the issue before you made the changes. If I get time today I will check again.

Sean

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

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

Thanks for checking that out. Changepassword is one of the concatenated pairs of words. Ham and sandwich are also concatenated, but it is less obvious.

I have updated the test page not only to make the fault more obvious, but with examples showing the surprising finding that the concatenation occurs when the hidden text is in a <p> element, but it does not occur when identical content occurs in <li> elements.

Steve


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Murphy, Sean
Sent: 27 March 2020 02:13
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip" technique for hiding text

Steve,


Just tested using NVDA and Chrome. Below is what was spoken:

Changepassword
Make me a hamsandwich

I am assuming " Changepassword" is the concatenated word.

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

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

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 ADDRESS REMOVED =
www.testpartners.co.uk

Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2

From: Birkir R. Gunnarsson
Date: Thu, Mar 26 2020 8:44PM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

Have you put an &nbsp; character at either the end of the visible word
or start of screen reader text?



On 3/26/20, Murphy, Sean < = EMAIL ADDRESS REMOVED = > wrote:
> Steve,
>
>
> Just tested using NVDA and Chrome. Below is what was spoken:
>
> Changepassword
> Make me a hamsandwich
>
> I am assuming " Changepassword" is the concatenated word.
>
> Sean
> -----Original Message-----
> From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Steve
> Green
> Sent: Friday, 27 March 2020 1:03 PM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] Text concatenation fault with Chrome and the "clip"
> technique for hiding text
>
> [External Email] This email was sent from outside the organisation – be
> cautious, particularly with links and attachments.
>
> 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 ADDRESS REMOVED =
> www.testpartners.co.uk
>
> Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2
>
> > > http://webaim.org/discussion/archives
> > > > > >


--
Work hard. Have fun. Make history.

From: Steve Green
Date: Thu, Mar 26 2020 8:48PM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

I did try adding &nbsp; characters, but it made no difference. There are not currently any &nbsp; characters in the test page, but you can obviously experiment using developer tools.

Steve


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

Have you put an &nbsp; character at either the end of the visible word or start of screen reader text?



On 3/26/20, Murphy, Sean < = EMAIL ADDRESS REMOVED = > wrote:
> Steve,
>
>
> Just tested using NVDA and Chrome. Below is what was spoken:
>
> Changepassword
> Make me a hamsandwich
>
> I am assuming " Changepassword" is the concatenated word.
>
> Sean
> -----Original Message-----
> From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of
> Steve Green
> Sent: Friday, 27 March 2020 1:03 PM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] Text concatenation fault with Chrome and the "clip"
> technique for hiding text
>
> [External Email] This email was sent from outside the organisation –
> be cautious, particularly with links and attachments.
>
> 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 ADDRESS 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
> >


--
Work hard. Have fun. Make history.

From: Steve Green
Date: Thu, Mar 26 2020 8:50PM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

I agree that it's a Chrome issue. Our software library contains all the old versions of Chrome, so I will see if I can find out when this issue was introduced.

Given that this is such a common way of hiding text and that Chrome has pretty much become the default browser for testing, I am very surprised that neither we nor anyone else appear to have encountered this before.

Steve


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Murphy, Sean
Sent: 27 March 2020 02:44
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip" technique for hiding text

Steve,

This looks like a Chrome issue, not a screen reader issue. As I tested in NVDA and we saw the issue before you made the changes. If I get time today I will check again.

Sean

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

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

Thanks for checking that out. Changepassword is one of the concatenated pairs of words. Ham and sandwich are also concatenated, but it is less obvious.

I have updated the test page not only to make the fault more obvious, but with examples showing the surprising finding that the concatenation occurs when the hidden text is in a <p> element, but it does not occur when identical content occurs in <li> elements.

Steve


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Murphy, Sean
Sent: 27 March 2020 02:13
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip" technique for hiding text

Steve,


Just tested using NVDA and Chrome. Below is what was spoken:

Changepassword
Make me a hamsandwich

I am assuming " Changepassword" is the concatenated word.

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

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

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 ADDRESS REMOVED =
www.testpartners.co.uk

Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2

From: Murphy, Sean
Date: Thu, Mar 26 2020 8:53PM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

I think I have, but wrote it up as a Jaws issue. A real good finding.

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

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

I agree that it's a Chrome issue. Our software library contains all the old versions of Chrome, so I will see if I can find out when this issue was introduced.

Given that this is such a common way of hiding text and that Chrome has pretty much become the default browser for testing, I am very surprised that neither we nor anyone else appear to have encountered this before.

Steve


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Murphy, Sean
Sent: 27 March 2020 02:44
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip" technique for hiding text

Steve,

This looks like a Chrome issue, not a screen reader issue. As I tested in NVDA and we saw the issue before you made the changes. If I get time today I will check again.

Sean

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

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

Thanks for checking that out. Changepassword is one of the concatenated pairs of words. Ham and sandwich are also concatenated, but it is less obvious.

I have updated the test page not only to make the fault more obvious, but with examples showing the surprising finding that the concatenation occurs when the hidden text is in a <p> element, but it does not occur when identical content occurs in <li> elements.

Steve


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Murphy, Sean
Sent: 27 March 2020 02:13
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip" technique for hiding text

Steve,


Just tested using NVDA and Chrome. Below is what was spoken:

Changepassword
Make me a hamsandwich

I am assuming " Changepassword" is the concatenated word.

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

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

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 ADDRESS REMOVED =
www.testpartners.co.uk

Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2

From: Jonathan Cohn
Date: Fri, Mar 27 2020 6:10AM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

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 ADDRESS 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 ADDRESS REMOVED =
> www.testpartners.co.uk
>
> Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2
>
> > > >

From: Steve Green
Date: Fri, Mar 27 2020 6:15AM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

Which browser are you using?

Steve


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Jonathan Cohn
Sent: 27 March 2020 12:11
To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS 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 ADDRESS REMOVED =
> www.testpartners.co.uk
>
> Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2
>
> > > archives at http://webaim.org/discussion/archives
>

From: Birkir R. Gunnarsson
Date: Fri, Mar 27 2020 6:34AM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

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 ADDRESS REMOVED = > wrote:
> Which browser are you using?
>
> Steve
>
>
> -----Original Message-----
> From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of
> Jonathan Cohn
> Sent: 27 March 2020 12:11
> To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS 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 ADDRESS REMOVED =
>> 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.

From: Steve Green
Date: Fri, Mar 27 2020 7:39AM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

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 ADDRESS REMOVED = > On Behalf Of Birkir R. Gunnarsson
Sent: 27 March 2020 12:35
To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS REMOVED = > wrote:
> Which browser are you using?
>
> Steve
>
>
> -----Original Message-----
> From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of
> Jonathan Cohn
> Sent: 27 March 2020 12:11
> To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS 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 ADDRESS 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.

From: Moore,Michael (Accessibility) (HHSC)
Date: Fri, Mar 27 2020 7:46AM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | Next message →

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 ADDRESS REMOVED = > On Behalf Of Steve Green
Sent: Friday, March 27, 2020 8:40 AM
To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS REMOVED = > On Behalf Of Birkir R. Gunnarsson
Sent: 27 March 2020 12:35
To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS REMOVED = > wrote:
> Which browser are you using?
>
> Steve
>
>
> -----Original Message-----
> From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of
> Jonathan Cohn
> Sent: 27 March 2020 12:11
> To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS 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 ADDRESS 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.

From: Steve Green
Date: Fri, Mar 27 2020 11:56AM
Subject: Re: Text concatenation fault with Chrome and the "clip" technique for hiding text
← Previous message | No next message

That was the first thing I thought of, but it doesn't work. You can have as many spaces or no-break spaces as you like, inside or outside the <span> element, but the words still get concatenated.

Steve


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Moore,Michael (Accessibility) (HHSC)
Sent: 27 March 2020 13:46
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Text concatenation fault with Chrome and the "clip" technique for hiding text

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 ADDRESS REMOVED = > On Behalf Of Steve Green
Sent: Friday, March 27, 2020 8:40 AM
To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS REMOVED = > On Behalf Of Birkir R. Gunnarsson
Sent: 27 March 2020 12:35
To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS REMOVED = > wrote:
> Which browser are you using?
>
> Steve
>
>
> -----Original Message-----
> From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of
> Jonathan Cohn
> Sent: 27 March 2020 12:11
> To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS 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 ADDRESS 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.