1211117 - [Browser] Capitalize text using CSS instead of using capital letters

Status: RESOLVED WONTFIX

(Firefox OS Graveyard :: Gaia::Browser, defect)

Description

[Julien Wajsberg [:julienw]]

When using the browser app with the screen reader, the short words in capital letters are spelled instead of read as a word. For example "TOP SITES" is spelt as "Te Oh Pe Sites".

The reason is that the text is written in the markup "TOP SITES" instead of for example "Top sites" with a CSS style "text-transform: capitalize".

See also http://webaim.org/techniques/fonts/#caps

Comment 1

[Théo Chevalier]

We should use a separate string for a11y, written in lower case (e.g. "Top sites") and keep the current string for the UI, because using text-transform is against l10n best practices.

https://developer.mozilla.org/en-US/docs/Mozilla/Localization/Localization_content_best_practices#CSS_issues

Comment 2

[Julien Wajsberg [:julienw]]

Got it, thanks. Then do you think that adding an aria label would be the solution ?

Comment 3

[Yura Zenevich [:yzen] (please use "needinfo")]

(In reply to Julien Wajsberg [:julienw] (away Oct 1st, 2nd) from comment #0)
> When using the browser app with the screen reader, the short words in
> capital letters are spelled instead of read as a word. For example "TOP
> SITES" is spelt as "Te Oh Pe Sites".
> 
> The reason is that the text is written in the markup "TOP SITES" instead of
> for example "Top sites" with a CSS style "text-transform: capitalize".
> 
> See also http://webaim.org/techniques/fonts/#caps

I think this is due to the current speech synthesis engine we use. This might change when we switch to a different one. I would suggest not having separate a11y string as an alternative for existing strings.

Comment 4

[Gregor Wagner [:gwagner]]

I don't think we can block 2.5 for this.

Comment 5

[BMO Automation]

Firefox OS is not being worked on