Use of decorative fonts in regard to label in name: a request for discussion, and suggestions for definition updates

[mbgower]

A proposed rule in ACT for Visible Label is Part of Accessible Name contains a pass example (Passed Example 6) where a decorative font is used to transform a text string into an image (in this case a magnifying glass) while the aria-label assigned is "Find".

The explanation reads:

This button element has the text “search” rendered as an magnifying glass icon by the font. Because the text is rendered as non-text content, the text does not need to be contained within the accessible name.

Investigating this, we identified a few considerations we would like reviewed by the working group.

Inconsistent rendering

First, the Materials Icon font family used has the ability to respond to text in a number of ways:

• if text characters used equal a reserved pattern, it can transform those characters
• if text characters used does not equal a reserved pattern, it will not render those characters
• if it is a combination of characters it does and does not recognize, it will do a partial rendering
• if there are multiple strings used it recognizes, it will render multiple results
• investigation shows that ANY capital letters and numbers will be rendered; however lower case letters that do not form a recognized string will be ignored

The example shown takes the string "search" inside the button and transforms it into a magnifying glass icon.

Remove the "h" from the string ("searc") and nothing is rendered.

Add "123" before "search" and a magnifying glass will be rendered with a small 123 preceding it.

Replace the numbers with "IBM" and it will be rendered (much larger than the numbers)

Replace the whole string with a "U" and it will be rendered

Add a "p" to make it "Up" and only the U will be rendered, although the button will widen as if more has been rendered

Replace "search" with "SEARCH" and it will render the text, not the magnifying glass

Normative text and definitions

The normative text for Success Criterion 2.5.3 Label in Name reads

For user interface components with labels that include text or images of text, the name contains the text that is presented visually.

Test is defined as:

sequence of characters that can be programmatically determined, where the sequence is expressing something in human language

Images of text is defined as:

text that has been rendered in a non-text form (e.g., an image) in order to achieve a particular visual effect

We see a problem with the definition of image of text, since it actually says nothing about what is meant by a "particular visual effect". The intention is clear -- a situation where text is rendered as an image that looks like text but is not copyable text; however the language seems to allow text that is transformed with any visual effect to pass. That means the magnifying glass would still count as an image of text (and thus this would fail label in name, since the aria-label "find" does not equal or contain "search"). Possibly it also means that the blank and partially rendered text is also an image of text, also representing a failure in this example.

Proposed change to image of text definition

This could be at least partially addressed by altering the image of text definition to read:

text that has been rendered in a non-text form (e.g., an image) where the text’s sequence of characters is still retained

This would ensure that a scan of a page with writing will meet the definition (which is debatable with the "particular visual effect" wording), as will an image of a text heading; however, when the text is transformed through decorative fonts to the point where they are no longer a sequence of characters, they would not be considered images of text.

---

Looking back at the explanation in the example, they also mention non-text content, which is defined as:

any content that is not a sequence of characters that can be programmatically determined or where the sequence is not expressing something in human language NOTE This includes ASCII Art (which is a pattern of characters), emoticons, leetspeak (which uses character substitution), and images representing text

[to be continued; just submitting before I accidentally delete or something]

[detlevhfischer]

@mbgower Not sure if it is too early to comment (since you said "to be continued") - but I have problems understanding this bit:

We see a problem with the definition of image of text, since it actually says nothing about what is meant by a "particular visual effect". The intention is clear -- a situation where text is rendered as an image that looks like text but is not copyable text; however the language seems to allow text that is transformed with any visual effect to pass. That means the magnifying glass would still count as an image of text (and thus this would fail label in name, since the aria-label "find" does not equal or contain "search").

I do not see how the magnifying glass would count as image of text. I would never think of a transposition of a text string into an icon as a "particular visual effect" (like glow, 3D look, whatever). Visually, an icon is clearly an image. I guess it will be rare seeing those weird renderings you list for the Materials icon font family but if "1 2 3 [Magnifying glass icon]" came to pass, I think the accname would need to include "1 2 3". And I do not see how it could fail 2.5.3, since the string "search" is nowhere to be seen, and therefore cannot be required to mach the accname in aria-label.