2.5.3: Must the visible label of site logos linking to the start page be included in the accName?

[detlevhfischer]

The question has cropped up here a couple of times if the visible label of site logos linking to the site's start page must always be included in the accName (e.g., the alt attribute) of that logo element.

There is a convention that site logos placed in the header link to the start page, so speech users may try "click home", "click start" or (German) "Klick Startseite" etc. to activate that label, regardless of (possibly obscure) label text. So do "start" or "home" (or equivalents in other languages) fail?

The other issue is the success of interpreting speech input if the string is an aconym like VDEK - some users may say "vee-dee-ee-kay" others "veedeck" etc. If the logo graphic then also contains a strapline of varying length (in this case, "Die Ersatzkassen") the question arises whether this strapline would also need to be included in the accName in order to meet 2.5.3. Common sense says that it probably shouldn't necessarily be included (even though inclusion would not be a failure). There is a trade-off between the length of the accName that non-visual users will be presented with, and covering visible label text to meet 2.5.3. My hunch is that site logos might, for the reasons mentioned, better be excluded from 2.5.3. The logo angle is, it seems, not covered in the current 2.5.3 understanding text. Thoughts? @mbgower ?

[awkawk]

There's never any guarantee that the speech tool will respond to a label that is properly represented in the accessible name if the speaker doesn't state the name in the way that the tool recognizes it. This will certainly impact logos with acronyms or initialisms where the user and the tool may not treat them the same, and will also affect people who have trouble speaking clearly (e.g. a typical speech user who has a stroke, or who just doesn't speak very clearly).

I don't think that we can control for that, but I do think that 2.5.3 does apply to logos.

[jake-abma]

Agree with @awkawk comment on recognition issues with AT and speech although the last comment is debatable:

... but I do think that 2.5.3 does apply to logos.

Not sure if this strokes with other SC when talking about logo's, we might (have) except(ed) them for 2.5.3 for the following reason:

• We except logo's for contrast, but demand logo's for 2.5.3 (while contrast may be very low)
• Logo's of text can be quite "weird" with letters crossing each other
• blending in other visual aspects or embracing each other
• distorted for (aesthetic...) reasons
• or... all kind of other design reasons
• Logo's may contain characters from another language

We may demand Logotypes, but not all text (characters) in logo's per se

[jake-abma]

take one from Wiki, must add all text in ACC name or fail?

https://upload.wikimedia.org/wikipedia/commons/8/84/Wikipedia-logo-tracescan.svg

:-)

[jake-abma]

http://www.mixedmethods.org/uploads/8/7/5/2/87520800/fm-m3rs-logo-reverse-no-name_orig.png

[awkawk]

@jake-abma there isn't an exception for logos in 2.5.3 but there is for 1.4.3, 1.4.5, 1.4.6, and 1.4.9 - I don't know how we would make the case that an exception exists.

[awkawk]

@jake-abma for that logo I would feel like I conformed with alt="Michigan Mixed Methods" as I would treat the other characters as decorative and not part of the label for that control.

[jake-abma]

@awkawk I know, so what about a logo like this? http://www.mixedmethods.org/uploads/8/7/5/2/87520800/fm-m3rs-logo-reverse-no-name_orig.png

A minor 'flaw' in the creation and ready for Silver?

[detlevhfischer]

@KimPatch what's your take on this, Kim? What are your speech input expectations when faced with logos like VDEK or the ones referenced by Jake?

[jake-abma]

https://i.etsystatic.com/8804575/r/il/4b90ba/1061302103/il_794xN.1061302103_fw72.jpg

https://mir-s3-cdn-cf.behance.net/project_modules/disp/b5aaf88482395.560be30c59e8c.jpg

https://i.pinimg.com/originals/f0/60/1c/f0601c976c4931b5f2ad33ebb832b06d.jpg

https://botw-pd.s3.amazonaws.com/styles/logo-thumbnail/s3/0009/4128/brand.gif?itok=SbOEJgdx

https://i.kym-cdn.com/entries/icons/facebook/000/014/657/2000px-Unicode_logo.svg.jpg

https://image.spreadshirtmedia.net/image-server/v1/mp/products/T1313A1MPA3343PT10X5Y0D136436450FS4627/views/3,width=378,height=378,appearanceId=1,backgroundColor=F2F2F2,version=1549917618/love-letters-mixed-enamel-mug.jpg

[jake-abma]

Just wondering where the line is with logo's

[detlevhfischer]

@jake-abma I think most of your examples would not be considered legible label text - some are decipherable and so might qualify (creative, love). I think it is still another issue whether the conventional position (mostly top-left, repeated across pages) and character of site logos qualifies for an exception - a logo somehow seems to say "home" regardless of its arcane or not so arcane content. But I can equally live with a line like "If the logo renders legible text (IBM, Nasa, whatever) then that text must be part of the accname". It just means some re-naming effort for quite a number of sites. And it would be good to cover that case in Understanding.

[jake-abma]

@detlevhfischer some facts:

Definition label:

label
text or other component with a text alternative that is presented to a user to identify a component within Web content

Here the "other component with a text alternative" is fine for a label, no need to add the text / description of the picture per se. (example is a pencil icon for edit button where "edit" would be fine for a ACC name, no need to add "pencil" in there)

For SC 2.5.3 Label in Name we have:

For labels that include images of text... the ACC name contains the text that is presented visually.

Clear demand, if "images of text" definition matches the image conditions it's a must

Definition image of text:

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

With Note:

NOTE
This does not include text that is part of a picture that contains significant other visual content.

Ok, so according to this definition and the Note there's a (fine/grey) line somewhere which possibly excludes many logo's like: http://www.mixedmethods.org/uploads/8/7/5/2/87520800/fm-m3rs-logo-reverse-no-name_orig.png

What is interesting here are, again, the edge cases where the "particular visual effect"can cause confusion like in the following:

https://image.spreadshirtmedia.net/image-server/v1/mp/products/T1313A1MPA3343PT10X5Y0D136436450FS4627/views/3,width=378,height=378,appearanceId=1,backgroundColor=F2F2F2,version=1549917618/love-letters-mixed-enamel-mug.jpg

Is this ACC name "Love" or "Velo"? Or do we need to add both?

At Web Accessibility Tutorials - Guidance on how to create websites that meet WCAG it says:

An alt Decision Tree:

Is the image used in a link or a button, and would it be hard or impossible to understand what the link or the button does, if the image wasn’t there?

Yes:
Use the alt attribute to communicate the destination of the link or action taken. See Functional Images.

Functional Images
https://www.w3.org/WAI/tutorials/images/functional/

Example of Logo DOES contain text but suggests only as an "extra" on top of the "primary function"

Note 1: In this situation, the logo is also an image of the text “W3C”, but in this case, its primary function is to link to the homepage, so the word “home” was added to the text alternative.

and

Functional images are used to initiate actions rather than to convey information. They are used in buttons, links, and other interactive elements. The text alternative for the image should convey the action that will be initiated (the purpose of the image), rather than a description of the image. For instance, as shown in examples below, the text alternative should be “print this page” rather than “(image of a) printer”, “search” rather than “magnifying lens” or “Example.com homepage” rather than “Example.com logo”.

Here is says "should" and " purpose of the image" rather than a description.

So in conclusion we have:

• A sort of global convention that the top left image/picture/logo, when clickable, goes to the "home page" (this is not always true, not always to the home page not always clickable!)
• The logo/image of text might be excepted (too much other visual content)
• The logo text has no other visual content but may be blended / scrambled / twisted
• The Logo is clear and adding to ACC name is no problem at all

A clear line is not always present, some do, some don't and seems like a judgement call from an auditor. Also it seems it's best practice but not required but I could be wrong.

[awkawk]

Approved WG Response:
Logos are not exempted from 2.5.3 Label in Name. A logo that contains text that serves as a link to a home page would need an accessible name, and in most situations that name should incorporate the text in the logo. However, there are nuances to consider.

• Text in a logo may well be symbolic. Companies can incorporate stylized lettering, where the letters themselves do not convey meaning. In such a case, as noted in the Understanding document, "the accessible name should be the function the button serves."
• Logos are a form of marketing, which is very close to being decorative. As such, 1.1.1 does not require alternative text. But where the logo is a link, for the purposes of 1.1.1 Non-Text Content, it falls under the situation where "if non-text content is a control or accepts user input, then it has a name that describes its purpose."

So when creating ALT text (which is part of the accName calculation) for logos with text serving as homepage links, it is advisable to include in the name any text which users would consider part of the company name, and also append the function (e.g., "IBM home").

Logos will sometimes include additional text that is secondary, and that additional text may not be needed as part of the label for the component. Label is defined as "text or other component with a text alternative that is presented to a user to identify a component within Web content" and authors should evaluate whether all text in an image is intended to identify the component or if some may be excluded. For example, in this image (http://www.mixedmethods.org/uploads/8/7/5/2/87520800/fm-m3rs-logo-reverse-no-name_orig.png) an author may decide that the primary text used to identify the component is "Michigan Mixed Methods" and the additional images of text are decorative and therefore can be excluded from the accessible name.

[jake-abma]

These kinds are interesting, although characters can be recognised, ignore?!

http://www.duijghuijzen.nl/uploads/nieuws/nieuwsbericht/dghzn150x150.jpg

[patrickhlauke]

These kinds are interesting, although characters can be recognised, ignore?!

http://www.duijghuijzen.nl/uploads/nieuws/nieuwsbericht/dghzn150x150.jpg

that's really more like a word art / vector shape that hints at characters. the alt for that image, and therefore the label, would be whatever the name of the company actually is. i think this is really a question more about 1.1.1 than 2.5.3, as satisfying 1.1.1 here should not conflict with 2.5.3 (provided the author doesn't override or otherwise change the accessible name of the control/link that's made up of just that image). and 1.1.1 does, of course, have a certain element of subjectivity/common sense, which i don't think we should try to eliminate by wholesale making exceptions here.

[mbgower]

So, a few things.

1. Images of Text excludes logos (defining them as essential). So it's okay to have a a logo with images of text. I think we'd all agree on that.
2. Within Image of Text, the example for a logo is explicit: "The image has a text alternative." I think we'd all agree it needs one -- and ALT text is part of the accname calculation.
3. In 1.1.1 Non-text Content, a logo which is a hyperlink matches:

If non-text content is a control or accepts user input, then it has a name that describes its purpose.

So the discussion is really about what the purpose of a company logo is. If it wasn't a hyperlink, it would arguably be decorative, but Detlev_ has already stated that the usual scenario is that it serves as a link to the homepage, so to me it seems clear that the accname should be either "[company name]", "home" or "[company name] home".
As has been pointed out, whether a logo made up of letters is treated as an acronym or an initialism -- and in the case of the latter, whether it is spelled out or just given as letters -- is at the discretion of the author.
For instance "IBM home" , "IBM" and "International Buisness Machines" would all be acceptable ALTs for the logo, with my preference being the first one (which would also work as a trigger for Label in Name with most speech recognition systems). I'd consider just "home" to be a weak fourth option, because it doesn't match the main visible text.

[mraccess77]

I would agree that "IBM Home" would be best. In the case of a linked logo the purpose is most important and the logo is dependent on whether that information is communicated else where on the page. Often it's not and thus "IBM home" combines both of those. This is aligned with the Trusted Tester recommendations.

[alastc]

I'd note that, in Dragon at least, if there is a link for "Home", saying "Click home" will take you to the browser home page, it doesn't follow the link. The company name would be important for a logo-link.

Also, the proposed response above has changed quite a bit, so worth re-reading.

[awkawk]

Response above approved by the WG on July 30, 2019.