Greyd.Suite improves on alt text

By Anne-Mieke Bovelett on September 18, 2023
Status: up to date

When SEO Scoring tools make your customers unwittingly mess with accessibility

This update contains a mini rant. Against SEO analyzing tools with scoring in percentages or points. And some remarks about SEO agencies who still have to learn about accessibility. But first, we get to the main point: one of the latest accessibility improvements made in GREYD.SUITE is that now, you can activate a setting that alt text is not automatically populated with the file name. 

Alt text was generated from the file name

One of the issues I ran into was that wherever I had left the alt text empty for certain images in the media library for this website, the file name would appear in the alt text. Imagine, you’re running a webshop. And the photo of that orange t-shirt for women has an alt text that says: art83667494_orange_f.jpg. That’s what is being read out loud by a screen reader or displayed on a braille device, for example. And that is also what Google sees, in context to your product grid or detail page.

That is bad for accessibility, usability, and bad for SEO! I will get to that further down, explaining what alt text is, what it is for and how it affects SEO. In my case, the images at the top of the blog posts are purely decorative, just for the purpose of “look and feel”. And they are there to make a rebellious statement. I’m waiting for the day someone challenges me over these not having any alt text. The article in response to that is waiting to be published.

So why was that automated alt text built in, anyway?

Because at GREYD they received complaints about SEO Scores for images. These scores will say: “You have so-and-so many images with missing alt texts”. The SEO tools are correct to flag it. But believe me, upping that score by adding nonsense to alt texts, is actually a missed SEO opportunity. That’s like creating a hyperrealistic 3D painting on a brick wall. Anyone trying to look inside hits their head against that wall. Assistive technology and Google (remember, Google is blind) are hitting that wall.

It’s not the first time I have seen this in themes. People code this kind of stuff in, in all innocence. I wrote an article about that, called:  There is no shame in having an inaccessible website.

More about alt text, SEO and why this is so important

What is Alt Text?

Alt text, short for “alternative text,” is a brief description added to images on the web. It shows up when the image doesn’t load. Or when someone is using a screen reader (a tool that reads the content of a webpage out loud for visually impaired users). The alt text provides a textual representation of what’s in the image.

What is alt text For?

1. Accessibility: It helps visually impaired users understand the content of an image when they are using screen readers.
2. Technical Issues: If an image fails to load due to internet issues or other technical reasons, the alt text provides a description so users know what they’re missing.
3. SEO (Search Engine Optimization): Search engines use alt text to better understand the content of a web page. This can help improve the page’s ranking in search results. A score from an analysis tool will only tell you if alt text is missing. It can’t tell you if the alt text is great! And some of these tools apparently cannot correctly interpret code that is there intentionally to tell them the image should be ignored.

What alt text isn’t for?

1. Not for long descriptions: Alt text should be concise. If an image requires a lengthy description, other methods should be used.
2. Not for non-essential images: Decorative images that don’t convey important information don’t typically need alt text. They should be given an empty alt attribute (`alt=””`). In GREYD.SUITE this now works correctly when the image has not been given an alt text in the media library.
3. Not for keyword stuffing: It’s not a place to cram in a lot of keywords in hopes of boosting SEO. The primary goal is accessibility, and any SEO benefits should be secondary. 

What you should never put in alt text

1. Redundant phrases: Avoid phrases like “Image of…” or “Picture of…”. It’s implied that it’s an image because the screen reader will announce that. Don’t bore your audience with “Look ma, rain is water, it’s wet!”
2. Unnecessary Details: Stick to the essential information. For instance, “A dog playing with a ball” is often sufficient over “A brown and white dog, with a tiny spot on its nose, playing with a red rubber ball on green grass near a white fence on a sunny day.” Unless those details are essential to the overall article. Because it’s a blog about a specific breed of dog, for example.
3. Promotional Content: Avoid using alt text as a place for promotional messages or advertisements.
4. Copyright information: That info belongs in a caption below the image. 

In summary, alt text is a way to describe images for people and machines who can’t see them, ensuring everyone has equal access to information on the web. It should be used responsibly and thoughtfully.

About that setting

In an ideal world, accessibility should never be an optional setting. But we don’t live in an ideal world. Software makers always have to deal with backwards compatibility. This is the way it could be solved, for now. Progress over perfection.

Do you want to learn more about creating accessible content?

It’s no secret, accessible content has a better conversion. The A11y-Collective offers excellent practical bundle of courses for this, aimed at copywriters and marketeers: The accessible content bundle. At the time of this post, there is a massive discount action on this bundle!