RE: Problem with definition of "label" linked in SC 2.4.12

Hi Brooks,

Both of the code snippets below are 1.1.1 failures - you cannot have an image without a text alternative (unless it is purely decorative and explicitly hidden from AT via alt="" or aria-hidden="true").  It's not decorative if it's a label.  So the first snippet should be something like:
<label><img src="go.jpg" alt="Go"><input ...></label>


And yes there is a means to providing alternative text via CSS inserts using ARIA (although this is also documented as a failure for using CSS to insert non-decorative content, although most developers do it anyway):
<label><span class="go-graphic-via-css" role="img" aria-label="Go"></span><input ...></label>

PS - If the CSS is using the content property, you can also insert alternative text like this:
class::before {  content: url(...) / "alt text"; }
Steve

From: Brooks.Newton@thomsonreuters.com [mailto:Brooks.Newton@thomsonreuters.com]
Sent: Friday, September 29, 2017 2:23 PM
To: w3c-wai-gl@w3.org
Subject: Problem with definition of "label" linked in SC 2.4.12

Hi All,

I separated this comment out from the CFC thread at Andrews request, but I do think it is relevant to the discussion of the language used in SC 2.4.12.

I'm not OK with the definition of "labels" we are linking to in the text of SC 2.4.12<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#label-in-name>.

Here's the SC language from 2.4.12:

"For active user interface components<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-user-interface-component> with labels<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-label> that include text, the name<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-name> includes the text of the label."

Here's is the linked definition of "labels" from the previous sentence:

label
text<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-text> or other component with a text alternative<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-text-alternative> that is presented to a user to identify a component within Web content<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-content>
A label is presented to all users whereas the name<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-name> may be hidden and only exposed by assistive technology. In many (but not all) cases the name and the label are the same.
The term label is not limited to the label element in HTML.
If you go back to David's basic example of an inline "Go" graphic without alt text next to a search input with aria-label text of "Search," we've got a situation that passes SC 2.4.12 because there is no "component with a text alternative."
David's example scenario code:
<img src="go.jpg"><input aria-label="search" ...>
Want to pass S.C. 2.4.12 and still have a fundamental disconnect between what's visible onscreen and what's announced by AT as the "name" of the "user interface component," just leave out the alt text!  The go.jpg graphic in David's example doesn't have a text alternative, and under the definition of "label" we are using, shouldn't be considered part of the label.  What would happen in the "Go" graphic were implemented into the page via CSS, which has no direct means of apply alternate text?
<span class="go-graphic-via-css"></span><input aria-label="search" ...>
In my opinion, the definition of "labels" needs to be adjusted to make it clear that images of text, whether they have alternative text or not, should be considered part of a label.
Brooks


* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Brooks Newton
Sr. Accessibility Specialist, Legal UX

Thomson Reuters
the answer company

Mobile: +1(918) 316-3949

brooks.newton@tr.com<mailto:brooks.newton@tr.com>

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *