Images in a blog post, website or social media platform enhance a reader’s visual experience. They provide us with an excellent content experience and make it easier for them to relate to your content better.
But simply adding an image is not enough. You need to add an alt text to make it accessible to every individual, regardless of their abilities.
What is an Alt Text?
Alt text, also known as an alternative text/alt tag/alt description, on an image is a written copy that describes the appearance and the purpose of the image in words. It is the first thing a developer and designer should remember when discussing digital accessibility. This element must be included in every image of a website or document so screen readers can accurately dictate the image description to people using the technology.
A screen reader or other assistive technology cannot read elements that do not have text. So, if you do not add a description of the image, these technologies cannot read it. This leaves the user with incomplete information and makes your document/website inaccessible to everyone.
Why is an Alt Text Important?
There are several reasons why an alt text is necessary for every non-textual element you add to your document or website. Here are some of the three reasons that make them crucial addition:
- Accessibility:
An alt text can improve your content or website’s accessibility when written well. As mentioned earlier, screen readers cannot translate any non-textual content and convey it to their users. An alt text can assist this kind of technology in helping users understand the information and purpose being served by the image. This allows the image content to be accessible to everyone, regardless of their abilities. People with sensory processing and learning disabilities can benefit greatly from an alt text as their assistive technology can help them process what the image wants to convey. Besides, people who voluntarily turn off the automatic image loading option on their browser to save data can also understand what the image has to say and what it is contributing to the document/website.
- SEO Purpose
If you run a business website, you might already know the importance of conducting good search engine optimization (SEO) to reach a maximum audience by ranking on the first page of a search engine. In fact, a survey suggested that more than 2.4 million searches happen every minute on Google, making it essential to make your content more SEO-friendly to reach your relevant public.
When integrated with best SEO practices, meaningful and accessible-to-all content makes a website rank well on the SERP (Search Engine Result Page). An alt text adds semantic meaning to an image so that search engines get better and more accurate information, making your website rank higher.
- Visitor Experience
Apart from having accessible and fully optimized content for the search engine, your website must also provide an excellent visitor experience. People who visit your website expect to access every information mentioned, but individuals won’t be able to see the image if they fail to load. When such mishaps happen, an alt text ensures your audience has the information an image wants to convey so that they can relate to it more.
How to Write a Meaningful Alt Text
Now that you know the importance of an alt text, it’s time to craft one that serves its purpose.
Here are six tips for writing an alt description that is meaningful, informational and clear.
- Be Precise
Describe what you see. Don’t become too editorial when writing an alt text because you have to think from the viewer’s point of view and understand how they will interpret the image. Avoid making assumptions regarding the individual’s race, ethnicity or gender or what’s happening outside the image. This is only going to add more confusion. Instead, be descriptive, as if you are talking to the reader on the phone and explaining what’s happening in your surroundings. Add as much information as possible – the hair color, outfit description, skin tone, the setting where the image is taken, any object around, etc., to help your reader imagine the entire setting. - Keep it Short
It is important to add every relevant information describing the image, but ensure that you do this by keeping your text short. A lengthy description containing creative and flowery words will confuse your readers. A rule of thumb to keep in mind is that screen readers cut off a sentence around 125 characters, so you need to keep the alt description short and clear. - Add Context Related to the Content
Tying in the content on your page with a generic image is important for readers to understand its relevance. For example, if you are writing an article about business school and have an image of a woman pointing to a person’s computer screen, create an alternative description that goes like “a professor of a business school pointing to her student’s computer screen” will produce a descriptive yet precise alternative text that helps the reader understand the image better.
Include Alt Text Even in Button Images. Button images are call-to-actions that urge readers to take action; for example, fill a form, click to attain more information, get redirected to another page, etc. Adding alt text in them makes their purpose clear to the reader and you can also expect them to take the required action. - Do not Copy the Image Caption:
Alt texts and closed captions are two different things that add different values. An image caption is displayed on the screen and is viewed by everyone regardless of their abilities, while an alt text is read aloud by assistive technology and is hidden from sighted users. So, if your image includes both, be more descriptive about what you see in the image in its alt text. - Avoid Writing the Obvious
Starting your alt description with “image of” or “photo of” is frustrating for an individual using assistive technology. The HTML code in the website will be able to identify non-text content, so there is no point in including these terms in the beginning. Moreover, someone using an assistive technology knows they are accessing an alt text, so they would not prefer “image of” at the beginning of every alt text.
A Well-Written Alt Text Makes Content More Inclusive!
An alt text improves user experience and makes your content more accessible and inclusive to everyone. Not only will it help people with visual impairments, but it will also make sure to feed a user the necessary information and enhance their experience when the images on the webpage or document fail to load.
