I’m working on a site that needs to meet accessibility standards. One of these standards is blank alt text when the image is descriptive. Unfortunately when I either mark an image as descriptive, or leave the alt text blank, it’s giving it an alt=“image” tag. This won’t work for accessibility because now the screen reader will read that as Image rather than just ignoring it. Is there a way to fix it?
2 Likes
Hi @marketinglaura,
Thank you for writing in, as you might already know the alt on the image element is also important for which are read aloud to blind users on a screen reader, so we can’t really remove that.
A clever (and safest) workaround for that is to add an empty space on the Alt field of the image element.
Another workaround for that is to place your image as the Section/Column background-image then add a Gap element to give a height on that Section/Column.
Cheers!
Actually, I think a more sensible default is to just leave the alt tag empty instead of “Image”. Decorative images are recommended to have an empty alt tag anyway.
1 Like
Hey @JvP,
I’ll post this in our issue tracker so this case can be taken into account for future releases.
Thanks for your feedback.
3 Likes
Yes, I’m trying to leave the alt tag empty because that’s what a decorative image needs in order for the screen reader to skip it in the content. What’s happening with the Image Element is if I check the box to mark it decorative or I simply leave the alt text blank, it’s defaulting to alt=“Image” in the code rather than alt="". A screen reader will then read it because it assumes that’s content the user needs and will read it as “Image: Image” which isn’t helpful.
I was able to workaround by adding the image in a Content Area Element rather than an Image Element and putting the alt in the way I need it.
Thanks!
2 Likes
Hi Laura,
Yes, that is a good workaround for this issue. Thanks for sharing!
Cheers!
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.