How to create accessible text

When I researched how to write accessible text for images, the first recommendation that came up was to not give any description to decorative pictures and to create easy-to-understand text for the others.

I find this explanation a bit confusing since a lot of visual content in a website is used, in my opinion, for decoration. As someone with sight, I don’t spend a lot of time reflecting on which information I get by seeing those images. But to be able to write this text properly, this is exactly what we should do.

Let’s take the famous advertisement for the squatty potty:

If I describe what I see it will give this description:

A man, disguised as a prince, is holding a squatty potty next to a plush unicorn sitting on a toilet. We can see plants, flowers, and a castle surrounded by a forest in the background.

Now, I think this would correctly describe the picture above. Let’s try to write this text again, after thinking about the context of this advertisement and its main goal.

This is an advertisement for the squatty potty product. A small accessory for bathrooms, which helps you sit in the right position, to poop in a healthier way. As you can imagine, the company had a lot of trouble promoting its product. They decided to take a shot by posting a silly video showing a unicorn pooping ice-creams. Knowing this, we can know that the most important aspect of the picture is not that there’s a prince charming with a unicorn. It’s the surprise and shock the ad wants to give while amusing the viewer.

Having this in mind, the image description should fulfill 2 main goals:

• Making it understandable that we are talking about a product (this is the main goal of the advertisement)
• Use humor to make this product more attractive

The new description would then sound something like:

Unicorn teaching a prince charming how to poop with a squatty-potty.

A copywriter would probably do a much better job, but hopefully, you can tell the difference: in the 1st version, we’re describing some elements of the picture randomly, leaving a confused user, who doesn’t know what to do with all this useless information. In the 2nd however, we focus on transmitting the original message, in the way it was intended.

The more information we have about the picture and its goal, the easier this task becomes. This is why while developing a website, it will be easier to create accessible text together with the ones in charge of the concept, to make sure the text fulfills its original intent.

In fact, there are multiple occasions where it will be unclear whether a description is useful or not. What about a picture showing visually what’s already written in the text next to it? Always ask yourself if there is an added value, maybe the image gives an alternative, easier way to understand the content. In which case it might be worth writing a description for it, which fulfills the same purpose.

I find YouTube thumbnails can have good examples of alternative text. The authors know they have only one line of text to describe the most interesting part of their video, and we end up with text describing the image while highlighting its main goal.

Coffee Lovers! Amazing Turkish Sand Coffee Making Process — Turkish Street Food (Alaa Starves)

Of course in this case we would also need to be aware of the context: if there was no description at all for the picture, then the text about sand coffee making process would be useful, but if the title is there, you could start thinking about how to best complement it.

Since the highlight is clearly the sans making process, then the description of the visual element should provide more details on it.