Images of text when text is on page

[selfthinker]

1.4.5 Images of Text says that any images of text (unless they fall under the exceptions) are generally always a fail. But what if the same text is available above or below the image? It is my understanding that that would meet the spirit of the SC because people can change "font size, foreground and background color, font family, line spacing or alignment" of a text that repeats the text of an image of text.

A common example would be a branded teaser image, like the "breaking" white on red image that the BBC uses for breaking news.

I can see how an image of text can still be a minor accessibility issue even with the same text underneath. Someone who cannot fully perceive the image or cannot change its appearance doesn't get an experience that is as close as possible to the original text on the image. But they are not lacking any information or functionality either.
I would say images of text that have the text repeated nearby should only be a fail under AAA (so, for 1.4.9).

The Understanding document says (emphasis mine):

If an author can use text to achieve the same visual effect, he or she should present the information as text rather than using an image.

That makes it clear (to me) that text from an image repeated underneath it is strictly still considered a fail.
I presume from a thread on the WebAIM mailinglist that @patrickhlauke sees 1.4.5 as problematic in that respect as well.

Could this be clarified in the Understanding document?

[patrickhlauke]

i have quite fundamental concerns that 1.4.5 really lacks nuance, and it fundamentally feels like it should just be a AAA requirement. It's handwavy in how it says "If the technologies being used can achieve the visual presentation" because yes, of course, nowadays technologies like HTML+CSS, or SVG, can achieve almost anything...but saying that as a result any use of text in image (with only those two exceptions) is then a failure is rather harsh. And the understanding document tries to walk this back by being more of a nudge (but by that point, the normative damage is done).

It is unrealistic to expect that authors, and particularly content editors (in situations like CMS' that just give them an image upload field, e.g. for a book cover or the teaser image for the latest promotion in the online store, or whatever), will start building complex HTML/CSS/SVG files rather than just uploading a ready-comped and laid out image.

And absolutely, if the same information is also available nearby in actual text, I do fail to see any particular rationale for failing.

Noting also that the ability to change font etc in SVG is theoretically feasible, but extremely brittle. Assuming a user knows how to set custom CSS or uses some plugin/extension, and assuming that this correctly targets text elements inside the SVG, it's most likely that the end result will fall apart visually since SVGs will have been carefully laid out for a particular font, unless authors have spent even more time building their SVGs to be responsive and adaptive.

Long story short, I think 1.4.5 is one SC that most auditors have evaluated in a much more subjective way than the normative text of the SC would have you believe. I know that certainly I have, particularly keeping in mind the context / technical feasibility / effort involved in changing a particular image that contains text into something that can (theoretically?) be adapted by end users.

[mraccess77]

I receive an image of a table or image of a flier pretty much every day from our school system and from our local city. These are clearly things where alt text is not sufficient and actual text needs to be provided. There are certain aspects where an image is likely needed because email or other clients won't allow proper formatting of the text in the desired way. So I believe this SC is important - however, it could use a better decision tree and guidance for helping people make informed decision of what is a pass and fail and why.

If the same text is available else where I'd say that is a pass as long as it's associated or directly before or after it would seem to pass the alternative requirements.

[JAWS-test]

But what if the same text is available above or below the image?

Then the text would possibly be a conforming alternate version to the graphic and thus the SC would not be violated

[bruce-usab]

i have quite fundamental concerns that 1.4.5 really lacks nuance, and it fundamentally feels like it should just be a AAA requirement.

@patrickhlauke we have 1.4.9 at AAA, so demoting 1.4.5 is a non-starter IMHO. That said, I am all for deliberating better phrasing for the Understanding document, or even the SC text. I agree with everything you wrote after your opening sentence in this thread!

@selfthinker can you provide a live BBC link or similar? As you describe it, the dramatic image presentation of breaking is not a fail against 1.4.5 IMHO because I understand that the opening caveat If the technologies being used can achieve the visual presentation should be read quite broadly and liberally. It is not a question if the latest version of CSS / SVG / web browser / skilled developer can achieve the visual presentation. It is a question about what technologies are available to the author.

[patrickhlauke]

It is not a question if the latest version of CSS / SVG / web browser / skilled developer can achieve the visual presentation. It is a question about what technologies are available to the author.

how is an auditor to know what is available to an author? and how can that be part of normative text for a pass/fail evaluation?

[selfthinker]

When I have discussed images of text when that text is on the page with a couple of colleagues, all of us said we would pass it although with the caveat that we thought that interpreting WCAG strictly should fail it.

Then the text would possibly be a conforming alternate version to the graphic and thus the SC would not be violated

@JAWS-test, good point. I completely forgot about that.
I still think it's worth mentioning this and elaborating on it in the Understanding document.

@selfthinker can you provide a live BBC link or similar?

@bruce-usab, I've learned after I mentioned the BBC 'breaking' teaser image that this image never stays up longer than a couple of minutes before it gets replaced with a proper image. That makes it a bad example because that makes it a temporary placeholder image. But here is the 'breaking' image on its own (as getting it in context is difficult).

A better example is the teaser images at the bottom of gov.uk's homepage. The first of those three is a stylised image which has the Covid-19 'slogan': "Stay at home > Protect the NHS > Save Lives". It's certainly possible to do that with real text and CSS, although it would be unreasonable additional work for a one-off effect.
The real text underneath repeats the words: "Stay at home. Protect the NHS. Save Lives.", which I suspect counts as a "conforming alternate version".

As you describe it, the dramatic image presentation of breaking is not a fail against 1.4.5 IMHO because I understand that the opening caveat If the technologies being used can achieve the visual presentation should be read quite broadly and liberally. It is not a question if the latest version of CSS / SVG / web browser / skilled developer can achieve the visual presentation. It is a question about what technologies are available to the author.

Interesting, I don't interpret 1.4.5 that way.
The SC says "technologies being used" while the Understanding document clarifies "the technologies that the author is using" which is a bit more specific. I guess it depends on how you define "author". Is the author the developer or designer authoring the visual aspects? Or is it the editor using a CMS?
You can interpret it both ways and neither the SC nor the Understanding document are clear enough on that.

[bruce-usab]

Thanks for those examples @selfthinker. The Covid slogan has very tight spacing. Even the Check/Change/Go graphic would be hard to replicate using only CSS, and then there is designers intent to have a series of buttons (all the same size) which can be swapped out as needed.

how is an auditor to know what is available to an author?

My recommendation to auditors is that, in absence of evidence to the contrary, they should be giving all due deference to content owners. If an auditor is considering flagging something on a technicality, almost certainly that something is not in actuality much of an accessibility barrier. It may be worth mentioning in the comments/notes section of a report, but it is almost always counter-productive to fail content for trivial reasons.

and how can that be part of normative text for a pass/fail evaluation?

I think one can look to the intent. Who benefits from when 1.4.5 is followed? From Understanding:

• People with low vision (who may have trouble reading the text with the authored font family, size and/or color).
• People with visual tracking problems (who may have trouble reading the text with the authored line spacing and/or alignment).
• People with cognitive disabilities that affect reading.

Those are all applicable to body text and menus. None of those are relevant to a large graphical button.

[patrickhlauke]

My recommendation to auditors is that, in absence of evidence to the contrary, they should be giving all due deference to content owners.

interesting idea. but how does that shake out in practice when you're doing an audit?

If an auditor is considering flagging something on a technicality, almost certainly that something is not in actuality much of an accessibility barrier.

there are lots of situations where something fails on "a technicality" (say a contrast ratio of 4.4999999:1). but a fail is a fail. in this case, it seems that the SC's normative text is quite hardline, but then tries to walk it all back in the understanding?

None of those are relevant to a large graphical button

not necessarily. what if a large graphical button uses text, prebaked into an image, that uses a very unusually-shaped font that makes it exceedingly difficult for certain users to read? or if the graphical button contains multiple lines of text?

this discussion here seems to be adding further ambiguity, handwaving, and exclusions that are simply not present in the normative text, which to me suggests that text is...not ideal.

[bruce-usab]

interesting idea. but how does that shake out in practice when you're doing an audit?

I will confess that I almost always have the luxury of working with the client and not in adversarial circumstances. But I am of the opinion that this should not be a difficult call for an experienced auditor.

there are lots of situations where something fails on "a technicality" (say a contrast ratio of 4.4999999:1). but a fail is a fail.

With such an example, and I have had them, the developer has been able to quickly tweak one of the colors.

it seems that the SC's normative text is quite hardline, but then tries to walk it all back in the understanding?

I respectfully disagree with that characterization. The SC normative text has some ambiguity, which is resolved by resolved the Understanding.

what if a large graphical button uses text, prebaked into an image, that uses a very unusually-shaped font that makes it exceedingly difficult for certain users to read?

The very unusually-shaped font would probably not be possible using CSS so, for better or worse, that does not fail 1.4.5.

if the graphical button contains multiple lines of text?

If the text was not large (as WCAG2x uses the term), I would probably fail it.

this discussion here seems to be adding further ambiguity, handwaving, and exclusions that are simply not present in the normative text

I respectfully disagree with that characterization. I would characterize this discussion reflecting that there exists auditors that are much too literal with the SC.

which to me suggests that text is...not ideal.

I agree that the text is not ideal. I don't myself have a suggestion for how to improve the phrasing.