WordPress / playground-tools

GNU General Public License v2.0
127 stars 38 forks source link

Playground block: A11Y: Powered by link needs spacing #291

Open alexstine opened 3 weeks ago

alexstine commented 3 weeks ago

Test page: https://learn.wordpress.org/test/wordpress-playground-block-plugin-test-page/

Please correct this link.

Powered byWordPress Playground

Should be:

Powered by WordPress Playground

Or:

Powered by: WordPress Playground

This will avoid the created run-on sentence for assistive tech.

brandonpayton commented 2 weeks ago

This one is interesting. The actual HTML has newlines (whitespace) between separate spans making up the "Powered by" label, but assistive technology (specifically VoiceOver) does not spell out the implicit space between "by" and "WordPress". Let's look at restructuring the markup around that notice to get a better result.

brandonpayton commented 1 week ago

I'm trying to understand what is going on here because, if one duplicates the link text and icon to a local test page, VoiceOver includes spaces when spelling out that link text. But it does not include spaces between "by" and "WordPress" when working with the Playground block.

brandonpayton commented 1 week ago

@alexstine, what assistive technology would you suggest using to reproduce this? I have been using VoiceOver on macOS and getting a little more experienced with it. Originally, when looking at this issue I was navigating letter-by-letter and was getting strange behavior with sometimes omitted spaces and duplicated letters that were not duplicated in the content itself. In at least some of these cases, I'm sure the problem was user error on my part. But after learning the command to have VoiceOver spell what is under the VoiceOver cursor and having it pronounce and spell out the powered-by link, it pronounces properly, and the spelling correctly mentions a single space to separate each word.

alexstine commented 1 week ago

I am using NVDA on Windows.