Twitter has an image accessibility feature that I missed when it was introduced this summer, so while I play catch-up and learn how it works, I’ll fill you in, too.
First, what does this feature do?
It gives you the option to compose a description of the images you add to your Tweets. The description can be read aloud for visually impaired users and will appear whenever images fail to load, which is useful for everyone on a mobile device when their internet connection is a little slow.
Take a moment to experience Twitter from the point of view of a Twitter user who is blind. Either play the whole video, or to just experience a Tweet with an image, start at 49 seconds and stop at about 1 minute:
https://player.vimeo.com/video/15880427
The Screenreader Experience Part One from NAPCS on Vimeo.
In the video, the file name “normal.jpg” is read when the image is encountered. If alternative text had been provided, a useful description would have replaced the file name.
So how do you turn the feature on?
Log into your Twitter account on the web, select Settings and privacy from your profile icon, and select Accessibility from the list of settings (it’s at the bottom). From there, check the Compose image descriptions checkbox and Save changes. (Twitter also provides instructions for your iOS or Android device.)
After you turn this setting on, what next?
Using Twitter on the web
On the web, when you add an image while writing a Tweet, you’ll see an Add description prompt overlaying your image.
When you click the prompt, an Image description dialog showing your image and a text field for the description will come up. Enter your description in the text field.
Once applied, your actual description shows in place of the Add description prompt.
When your Tweet goes live, it will be encoded with the alternative text (or “alt text” attribute. I confirmed this by inspecting the HTML code. For example, my tweet below says “Transitioning between two intensive projects often feels like,” followed by a photo, and the alternative text for the photo reads “sitting on the edge of a cliff contemplating the abyss.”
Using the browser trick of turning images off and loading the web page confirms that my text description replaces the image if the image fails to load.
Using the Twitter mobile app
On the iOS Twitter app, the process is similar. When you add an image to a Tweet, you tap the Add description prompt that overlays the image.
You can then type your description in a text field while viewing the image.
Once applied, your description shows in the image overlay in place of the Add description prompt.
If you use an alternative mobile app instead of the Twitter app, it should have a way to access this feature. For example, using Twitterific, tapping the attached image brings up a text field for adding the image description.
So what do I say to replace an image?
I recommend using the “phone test.” If you were reading your Tweet to someone over the phone, what would you say when you get to the image? You want a short description that works seamlessly within the context of your Tweet. If the image works a certain way with the text of your tweet, try to maintain that in your description (like if the image is a set-up, and your Tweet text is the punch line or vice versa).
Further information
I owe a hat tip to my friend Alan Levine for writing an enjoyable rant about Describing Tweeted Photos. If it weren’t for him, I still wouldn’t know Twitter added the image description option.
And for all you ever wanted to know about how to describe images for the Internet, look no further than Jukka Korpela’s definitive-since-1998 Guidelines on alt texts in img elements (which has been kept updated as recently as 2012).