Images that contain text create accessibility barriers, because text that is embedded in an image can’t be read by screen readers or text-to-speech software. Images of text also can’t be enlarged or copied like actual text and links won’t be clickable, which makes this information more difficult to use for many users.
It’s best to avoid images of text if you can, but if you do use them, here are some tips for making them more accessible.
Types of Images of Text
Here are some examples of common images with text, and how to avoid them or offer alternatives.
Screenshots
- Instead of taking screenshots of emails, Teams messages or documents and sharing them as images, copy and paste the text or forward the message to your recipient.
- If you share a screenshot to demonstrate something visual, add brief alternative text or describe the important details of the screenshot in a caption.
Social Media
- If using memes or GIFs in web pages or social media posts, add alternative text, descriptive captions, or a transcript of text.
- Memes and GIFs are often used humorously, so it’s helpful to explain the joke or humor in the alternative text.
Example alternative text: "Meme of an engineering professor standing in front of a whiteboard with complex drawings. Come on guys, it’s not rocket science. Punchline: it is. QuickMeme.com"
Invitations and event flyers
If you create an image with important event details or links, make sure to add those details in text nearby. This makes the information more accessible, and many users will appreciate being able to copy and paste event details and click on a working link.
For example, if you were sending the image below by email or adding it to a web page, you should also include all the details in text before or after the image.
Network @ Mines! Join us for a free networking event! Friday June 5 at 10:00 AM in the Student Center. More details at mines.edu.
Using Generative AI to describe images of text
Microsoft Copilot and other generative AI tools can extract text from an image and create text that you can copy and reuse. Upload an image and try a prompt such as “extract the text from this image.”
Generative AI can also create descriptions of an image or alternative text. You can include prompts such as “write alternative text for this image that is less than 50 characters” or “write a description of this image, including all the text that appears.”
Tips for using generative AI to describe images
- Make sure to check the generative AI text against the original image to ensure that no inaccuracies were introduced and that the text is complete.
- AI-generated descriptions tend to be wordy. You may want to refine your prompt or edit the generated description to be more concise.
- Alternative text and descriptions should explain the image in context and provide important details that a sighted user would recognize, such as names of people or buildings. Generative AI descriptions tend to be generic and you may need to add or correct specific details.