The first day of the advent calendar is all about alt text, which is one of the biggest problems on the web.

There are at least the following issues with alt text:

• Missing alt text
• Misleading alt text
• Keyword stuffing in alt text
• Decorative images with alt text

So in this post, I want to shed some light on how to write good alt text and when to write alt text at all. But first, why does alt text matter?

Alt Text Matters

Alt text is crucial for accessibility. It helps users with visual impairments understand the content and context of images. Additionally, it can improve SEO by providing search engines with more information about the image. But this is sometimes overemphasized and people stuff keywords into alt text, which is not helpful for anyone, since the purpose of communication is to help users, not only search engines.

Let’s take a look at the following image:

Bad: Image of a dog.
Good: Golden Labrador playing with a red ball in the park.

Tip: Avoid writing “image of” or “picture of” in the alt text. Screen readers already announce it’s an image.

However, we do NOT have to always write alt text.

When Should I Use ALT Text?

Images can usually be grouped into two types: informative and decorative.

1. Informative Images

These contribute meaningful content to the page. You should always provide a descriptive ALT text that conveys the image’s purpose.

Let’s say we spend some time on LinkedIn and we see an image of an avatar. The image is used to represent a person, so it is important to know who that person is. A good alternative text could be: “Smiling young woman with short hair and glasses, wearing a dark blue jacket.”

2. Decorative Images

These don’t add any important information. For decorative visuals, you should use empty ALT text (alt="") so screen readers skip over them.

Example: Icons used purely for visual flair or background images.

Let’s say you use a cute visual divider image to separate sections on your page. It’s visually nice, but it doesn’t add real meaning. In this case, ALT text should be empty, even if the image looks great.

The Problem With Missing ALT Text

The real issue comes when ALT text is missing from informative images. If a user needs the image to understand the content or context, it must have an appropriate description.

But here’s a question: Is the same description always right for the same image? Let’s talk about that next.

Adapting ALT Text Based on Context

Remember that cool picture we saw before with the dog playing? Let’s say that that image is used in an article about dog breeds. In that case, the breed of the dog is important information that should be included in the alt text. If the image is used in an article about playing fetch with dogs, then the action of playing fetch is more relevant. The context of the image matters when writing alt text.

Let’s try another example.

If you saw this image on a travel website, you might write:

Bad: Image of a landscape.
Better: Sunrise on the beach in Cancún with the sun reflecting on turquoise waters.

That works! It gives the right impression to someone dreaming about their next vacation.

Now, imagine the same photo used in a photography magazine. Here, the audience cares about lighting, color, and technique. The ALT text should reflect that:

Not ideal: Sunrise on the beach in Cancún with the sun reflecting on turquoise waters.
Better: Warm morning colors with pink and orange clouds blending over the ocean horizon.

The image hasn’t changed, but the context has, and so should the ALT text.

Do this today: Audit your homepage images. For each, ask: What does this add? Write one clear sentence per meaningful image.