mecha’s image description & visual accessibility reference post:
disclaimer: This is mostly a reference for myself for the image descriptions I write in the future, including common things I see that I want to avoid. Some are with screenreader users in mind, some are with non-screenreader users in mind. I’m not claiming this is where describing images should begin or end, and i’m not the only low vision person out there. if you want to have better reference guides, i find here to be helpful.
Image description in alt text: Not all people who need image descriptions can or do use screenreaders. Alt text is hard to access without a screenreader on most browsers and versions of the app. Just put it in the post. If you don’t, it’s just showing that you don’t actually care about accessibility.
Image description under a read more, in a reblog, in small print, etc: This is a big one, and I’ve seen a ton of posts about it, but it can’t hurt to restate. This is inaccessible, and shows that your “accessibility” is performative.
If the image description is under a readmore, if anything happens to your blog, then it will no longer be accessible. If a description is long, that’s ok. Just tag the post as long instead of using a read more.
If you post art (or anything) with an image description in the reblog, people will have to go searching through the replies for it. It also makes it easy to separate the ID from the rest of the post.
If the description is in small print, or otherwise formatted not in plain text, it’s inaccessible. Not all people who need image descriptions use screenreaders.
Put the most important info first: This is so someone can skip the screenreader to the next paragraph once they get the idea of the post.
“Image ID”: ID stands for “image description.” It is a common misconception that ID in this context means “identification” instead.
Capitalization (id vs ID): Maybe you’re going for aesthetics, or maybe you don’t capitalize letters very often. Keep in mind that screenreaders tend to read “id” (lowercase) as a word, like Freudian psychoanalysis, while “ID” (uppercase) is read as the individual letters. Hopefully you’re aiming for the individual letters, since that’s what Image Description is short for in this context.
Bold, Italicized, and Strikethrough text: I don’t know about others, but the screenreader I use doesn’t tell you which text is bold, italics, or strikethrough. If that is in any way relevant to understanding text in the image you’re describing, please specify what sections are bold.
Example of how to do that: The text says: “My favorite color is green.” The word green is bolded.
Colored text: Similar to the above, colored text on Tumblr is not registered as different than plain text with a screenreader. It would be helpful if you made a note of colored text. You can use the same format I specified above.
Colored text, the sequel: Provide plain text when you‘re making posts that use colored text. Some people don’t use screenreaders, and they don’t need to justify that for you to make your posts accessible to them. Colored text on its own is inaccessible because it simply cannot be seen well by some people.
Video descriptions: Don’t separate video and audio descriptions. I don’t understand why this would make sense to anybody to do, but I’ve seen people do it regardless. In most videos, the audio and video are relevant to each other, and separating them makes it really confusing. I know it seems obvious, but think: is the content of the video actually understandable given the description you’ve provided?
Note when the image description is done, in a way that can be understood with or without a screenreader: The commonly used square bracket ] is not sufficient, because screenreaders do not read them aloud. Doing this well is most commonly achieved by putting “End ID” at the end of the description.
Sorry if this is too long, but if you do use this I hope it’s helpful. Have a good day!💗
