An image isn't worth a thousand words... without 420 characters

Did you know you could be the difference between an accessible social network or not for the visually impaired? Yes, you! Learn to describe media on Twitter and Mastodon and make your content accessible!

How to opt-in the alt text feature

Important: Have in mind this feature isn't similar to the Facebook implementation of alt text, where image description is made automatically by object recognition technology and you have no say in how it is described. On both Twitter and Mastodon you have to describe images manually using no more than 420 characters.


On the desktop version of the website: This option is on the "Accessibility" tab from the "Settings" menu. You can access it directly here.

Screenshot showing the Accessibility settings on the desktop version of Twitter's website. There's a option called "Image descriptions" opted-in, described as "Compose image descriptions". A smaller text explains it better: "Adds the ability to describe images for the visually impaired. Learn more." The "learn more" link redirects the user to a article on their blog about the alt text feature.

On mobile apps: This option is also available on the "Accessibility" tab from the "Settings and privacy" menu.

Screenshot showing the Accessibility settings on the official Android app for Twitter. Under "Vision" there is a option called "Composite image descriptions" which is opted-in. It is described as "Adds the ability to describe images for the visually impaired."

On the mobile version of the website: This feature isn't available.


There isn't an option to turn this feature on and off; it was made available for everyone by default from version 2.0.0.

How to describe images?


On desktop: As you upload an image, you'll notice a black strip on it saying "Add description". Click on it.

Screenshot showing a tweet in production. On the text box, an image was attached. In this image there is a black stripe with the phrase "Add description".

This will open a the image description tool. Make a proper description and click on "Apply".

The image description window was opened by clicking on the black stripe. The image is displayed as well as a box where the description should be made. On the right, a button with the word "Apply" which saves your description.

And it's done! Now this image has a description attached.

Mobile apps: The same process applies.

Third party apps: This feature is included on the REST API according to Twitter. If the app you use doesn't have it yet, talk to its developers and ask for it!


In both the desktop and mobile version of the website the image description feature looks and behaves the same way. Rest the mouse on the image attached or make a single touch on it to reveal a black strip saying "Describe for the visually impaired". Click on it to begin describing the media.

Screenshot showing the mobile version of Mastodon's web interface. I wrote a toot about Animal Crossing: Pocket Camp and attached an image showing my friend code.

The writing takes place on the strip itself, without opening an additional window. Once you are done writing, the description will be applied.

Apps: Mastodon doesn't have a official application, but has an open API which makes it easier to develop great third party apps. If the app you use doesn't have it yet, talk to its developers and ask for it!

What is the best way to describe media?

Sidney Andrade, the wonderful person behind the Instagram profile @descrevepramim, wrote an article in Brazilian Portuguese called "How to make your timelines more accessible to blind people". Since he gives some amazing tips, I'll translate some of them:

How do I know if an image has a description attached?


  1. Using a screen reader. When the image is selected (moving your fingers through the screen on mobile devices or using the mouse or keyboard shortcuts on computers), the software will read the description for you.
  2. Inspecting the image attributes. This can be done two ways:
    a. Looking for it on the HTML code:
    A screenshot of the HTML code from Twitter highlighting the image attached to my post. Using an attribute called "alt", the description "Screenshot of Focos's homepage showing one of its features. On the left, a mockup of a phone screen showing a photograph of some flowers, demonstrating the difference between focus on different objects. On the right, the website describes this process: "Tap focus after shooting. Portrait photo with depth data allows you to focus after shooting like the hacker technology." "like the hacker technology" is highlighted." is assigned.
    b. Viewing the image information:
    Screenshot of the image info window from Firefox showing the image description under the "Associated text" label.


While the three methods described above also work on Mastodon, it has a simple way to view the associated text: resting the pointer on the image.

Screenshot of my toot about Animal Crossing. The pointer is resting on the image and the alt text is displayed: "Screenshot from Animal Crossing: Pocket Camp. My character, a white girl with pixie haircut, brown hair and eyes, mint glasses and a dandelion in her hair, is displayed above the text "Anna e só ID: 7545 9867 751".

What about GIFs? Does this feature work with them?


No, you have to describe them on a different tweet. I recommend you use some sort of indicator so the description is easier to identify, such as:

[Image description: [your description here]]

Screenshot from Mastodon showing a toot with a Pikachu GIF attached. Answering it there's another toot of mine with the description "Image description: GIF. Pikachu Pikachu swimming while visibly worried"


Eugen actually tried to implement a way to do it, as you can see on the attributes of this GIF I tried to describe:
Screenshot of the HTML code related to a Pikachu GIF with the description "GIF. Pikachu swimming while visibly worried" under the aria-label tag

Unfortunately, it doesn't work as intended so I advise you to follow the method I explained above. But if you have any ideas about how to implement it effectively, make a suggestion on the project's repository.

Now that you know what can be done and how, I hope this motivates you to change your habits and to describe any media you share. Thank you for reading and please, pass this information on!

Anna e só

Goiânia, Goiás, Brazil |

That disabled user you need to think about — and is willing to help you out. Works with localization (l10n) & internationalization (i18n). Want to talk? You can reach me at contraexemplo@protonmail.ch