How to create impactful alt text for your images

By Posted in - Accessibility on November 23rd, 2020 0 Comments A person with headphones. Text reads "How to create impactful alt text for your images".

Let’s try something.

Describe the image below to a friend.

Ask your friend to draw what you describe. Does their drawing resemble the image?

A happy student wearing a graduation cap, peering over the top of a large book, in a sunlit university library.

I’m willing to bet that it’s pretty close. You accepted the challenge with relish. You did your best to be descriptive.

Because of your efforts, your friend now has a clear idea of the image in their head, without ever having accessed the screen themselves.

In that activity, your friend took the role of a screen-reader user. They tried to understand an image that they didn’t have access to.

And you acted in the role of a good content professional. You provided a detailed, accurate description of an image to make it accessible to your friend.

Now…

Imagine if you simply described the image as “student” or “woman with book” or “image1.”

What sort of image would your friend have drawn? How could they even begin to understand an image with such little information?

Descriptions are important. Accessibility is important.

Your images need alt text.

What is alt text?

Alt text describes images.

It is a text alternative, as the name suggests.

Alt text is added to images in HTML to describe their content and context for:

– Users
– Screen readers
– Search engines

And it’s not just webpages.

Alt text can also be provided for images on:

– Facebook
– Instagram
– LinkedIn
– Twitter

It takes a little extra time and thought, but it’s very worthwhile because…

Alt text improves accessibility

Alt text is an important accessibility requirement.

Screen readers use alt text to describe images to their users. Without alt text, these images would be inaccessible.

This could affect a significant proportion of your audience. Lots of people use screen readers, including:

– Blind people
– Dyslexic people
– People who are partially sighted
– People who wish to lighten their reading load
– People who like the experience of using a screen reader.

And it’s not just screen-reader users.

Alt text will display if the image is struggling to load.

That means alt text benefits any user who has ever experienced a slow internet connection.

And that’s all of us.

I hope accessibility is the only reason you need to use alt text.

But if you need another reason…

Alt text improves SEO

Search engines are robots. They can’t see images. But they can read alt text.

Search engines use the information offered by your alt text when indexing your page. They are more likely to favour your page in search results if you provide alt text.

And you will rank even higher if you provide good alt text.

How to write good alt text

It is simple to add alt text to images in your CMS.

It is equally simple to add alt text to images on FacebookInstagramLinkedIn, and Twitter.

But what you add requires a little more thought.

Good alt text is:

– Specific – Describe the image itself, not the topic it represents. Test the effectiveness of your description using the activity at the beginning of this post.

– Short – Aim for around 100 to 125 characters. A brief description is more impactful, nor does it waste the valuable time of your audience. Google is also more likely to index concise alt text.

– Lean – Remove any unnecessary words, such as “Image of…” or “Photo showing…” or the name of the photographer. This doesn’t add value to the description and eats into your precious character count.

– Relevant – Incorporate keywords that relate to the page on which the image is featured. This will help your Google ranking. It should be easy, never forced, provided the image is relevant to the page.

– Authentic – Avoid keyword stuffing, as ever. Google doesn’t approve of such underhand tactics. Your ranking will drop.

With all of that in mind…

Let’s return to our opening image

What alt text could we provide to describe the graduate in the library?

Bad alt text would be:

– Image1
– Graduation 2020
– Alumna with book
– 20200715_122019
– Photo of university graduate captured by Darley Dale-Stone via www.dalestonephotography.com
– Student undergraduate alumni alumna graduate graduand graduation mortarboard degree ceremony university library

Try drawing one of those. Impossible.

Better alt text would be:

– A happy student wearing a graduation cap, peering over the top of a large book, in a sunlit university library.

Much easier to understand, right?

Improve your accessibility

Pickle Jar Communications would love to partner with you to improve your web and social media accessibility.

There are a variety of services that we can provide:

– Delivering accessibility training for your staff
– Conducting an accessibility audit of your website and channels
– Providing recommendations to help you address accessibility issues
– Writing an accessibility strategy for your institution
– Creating accessible content for your channels: copy, images, audio, video.

If you want to commit to creating an online presence which supports accessibility, then we would love to explore this with you. Please do get in touch.

Until then, remember to use alt text for your images.

Together, we must provide accessible content.

Alt for one and one for alt.

Please leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.