Alt text for the image featured above: Cartoon purple dinosaur with empty thought bubble in pop art style
Alternative text is a short description for images used online or in documents. It’s a way of describing visuals for people who are unable to see them, usually because they have a vision-related disability. Alt text is generally not visible on the page like my ‘purple dinosaur’ example above, but it’s an essential requirement for people who use assistive technology such as screen readers.
A screen reader conveys content on the screen in a non-visual way. As it cannot convert an image into text, it will read out the alt text description. If the alt text is missing, it will only read out the file name – not very insightful!
Everyone is going to write alt text differently, so there’s no 100% correct way of doing it. It might initially feel cumbersome to accurately describe an image, but with some practice it will become second nature. It’s also worth taking the time to get it right when it results in everyone having a shared experience in understanding and appreciating your image.
Here are 3 interlinked things to keep in mind so you can quickly and effectively write alt text for your images.
1. Be specific with its purpose…
What is it you need to know about the content of the image? Close your eyes and imagine what description would summarise its intent. The shape of an infographic or texture/colour is not as beneficial to know about an image as the core information or emotional feeling an image may invoke. If the image is more of a motif or graphic without any clear purpose, it may be marked as a ‘decorative image’.
2. …in context…
How does the image work within the page it features? Keep in mind the bigger picture. Help your users to connect the overall content of the page with the images you include, ensuring that they do not miss out on any important details.
3. …with a manageable character count
Providing sufficient detail is important, but there is a risk of being too detailed. If you have applied the two tips above, then there’s every chance you have managed to stick to the essential information. But it’s worth checking that the text falls within 100 characters (approx 20 words). If it’s too long, it may not get picked up by the screen reader.