Do you see a problem? With the image?
Maybe you don’t. You know, people who can’t see still can use the software, browse the Web, and work with electronic documents. Screen Readers is a technology that makes it all possible.
But a screen reader can’t “see” this image of an apple, either. It would be able to say a text alternative if it was provided. But I didn’t use alt = “apple” for img tag to illustrate the point.
Now I do. Inspect the HTML if you want – the 1st image has alt=””, the 2nd has alt=”apple”.
Do you see a problem?
Oh… That’s another apple? Another image of another apple, to be more accurate?
Is that a problem? We can think of contexts where it is, and it isn’t.
How did you know? You saw?
But screen readers can’t see. Neither can checking tools. So called “accessibility testing tools” that scan HTML of the page and check for pre-programmed patterns most likely will report an image without alt attribute, but as long as it has some text it’s a “pass”.
Let’s try again. Inspect the HTML.
Do you see a problem? We do have alt text now. Except.. it says “another apple”.
How to report these? I suppose, we can describe that an image of a pear has invalid text alternative. But how to describe a difference between the first and second apple? What would be a valid text alternative? We may describe that one has leaf turned right and another – turned left. “A red ripe apple with green leaf turned right”.
Keep in mind, we’re dealing with relatively simple objects. Now think of a web site of a clothing store. Shirts and shirts.
How can you describe THAT?
Let’s try. “Shirt with image printed – moon, 2 wolves”. I didn’t mention it’s a full moon. I didn’t mention that it’s partial images of wolves. I didn’t mention about what they do. Nor that I could. I can guess they’re not fighting. Anything more specific would be subjective and imaginative. It’s just a picture, after all.
Now, let’s say we came up with a 100 words long paragraph of textual description as alternative. Go back to our imagined clothing web site and try to navigate through a page showcasing 10 shirts. How long will it take to listen to every detailed description?
Apparently, detailed text poses a problem, too..
So, checking whether an image has an alternative text or not, is easy. WCAG also has a straight forward definition:
1.1.1 Non-text Content: All non-text content that is presented to the user has a text alternative that serves the equivalent purpose.
But the devil is in the details..
Let’s sum up the problems we’ve identified.
- Non-textual Web content needs textual description to be conveyed to the users who can’t see, and testers must learn to look behind the image
- We cannot trust checking tools with truly reliable verification for the purpose. Best they can is to find an absence of alternative text.
- Even with a text present, distinguishing between similar objects might be a problem.
- We don’t know how much text is good enough text alternative, not without a context that includes both the software and the user.
- Going with very detailed text is another problem. Not always non-sighted users need all these details, same as sighted users may or may not need to take a close look at the picture. Listening to long descriptions all the time becomes a slowing down barrier.
This is the post on problems with accessibility problems. Patterns, anti-patterns, and advocacy.
Stay tuned and follow the series.