Can't add alt text to Gallery images

[iandunn]

Problem

There's no way to set the alt text on the images that are in a Gallery block. You can add captions, but that serves a different use case.

If the image is locally hosted, you can add alt text through the Media Library, but that's too inconvenient, and most users won't, especially if they uploaded the image via drag-n-dropping it to the current post.

If the image is external, there's no way to set the alt text.

Related #13164, #16886, #12351

Proposed Solution

After clicking on an image, there should be some kind of UI that allows for setting the alt text. I'm not sure what the best way would be, though. Maybe something similar to the caption UI.

Or maybe the sidebar should contain some controls for each image, in addition to the controls for the block as a whole?

Alternative Solution

The Gallery block could use InnerBlocks, so that each image is a full image block, with all of the editing options available from that. That seems kinda messy and overly complex, though.

[iandunn]

Er, were they intentionally left out because galleries are considered purely decorative?

[peterpenguw]

galleries are very useful for picture heavy industries. Why anyone would leave this feature out on purpose would be puzzling.

[nikoghosyanm]

This functionality existed before and as I can see it was also an issue in the classic editor lately (fixed now) so it definitely needs to be fixed in Gutenberg too

[phpbits]

@iandunn You can use the Edit Gallery option to easily manage the ALT text. Here's the instructions:

https://twitter.com/editorskit/status/1229715390965534720

[cre8tivediva]

Any idea when/if this will be addressed? I like @phpbits workaround, but this truly should be an option in the blocks. It's more than a "decorative" element to a lot of users.

[peterpenguw]

yes how I do it is Elementor, imo it's been the most reliable way to build nice and practical pages. *Peter Peng, P.Eng.* 647 588 6623 LucasCreatives.com | Calendly <https://calendly.com/peter-uw/30min>

…

On Tue, Feb 18, 2020 at 7:48 AM cre8tivediva ***@***.***> wrote: Any idea when/if this will be addressed? I like @phpbits <https://github.com/phpbits> workaround, but this truly should be an option in the blocks. It's more than a "decorative" element to a lot of users. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#17618?email_source=notifications&email_token=ABF2T4D6KHNILBTCWCKBJ6LRDPKIZA5CNFSM4I25C2HKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEMB223Q#issuecomment-587443566>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABF2T4DBS6EZKEWGC5NOGNLRDPKIZANCNFSM4I25C2HA> .

[oldrup]

Update: after following the steps shown here: https://twitter.com/editorskit/status/1229715390965534720, the already existing alt tags of the images are actually being uses. So in my case, I just had to edit the gallery, not make any changes, and save it, and then the post validates. Odd.

Original post:

When testing for accessibility, its impossible to validate a post with a Gutenberg Gallery, as the alt tags added in the media library are not being used.

WebAIM wave report of a Gutenberg / Twenty Twenty site: https://wave.webaim.org/report#/https://labs.oldrup.net/demodata2/

What makes this even weirder is that the img elements in the gallery, actually contains an alt tag, its just completely empty.

In my opinion the alt tag of images added in the media library, should be output if they exists. Just as the are in individual image blocks. At least make it optional, so a error free accessibility is possible.

Best regards
Bjarne

[taija]

We use WordPress for our primary CMS in a large institution that requires accessible content; this has been causing confusion for a bunch of our content managers. I echo thanks for the work-around, but this really needs to be fixed in the block itself!

[haraldballuch]

I totally agree with @oldrup: If there is alt text, it should be included in the ouput of gallery images.
At least in twentytwenty theme this doesn't work. There is always added alt="" to the img tags inside of galleries completely ignoring if there is an alt text for this image or not.

[haraldballuch]

Ok, sorry, it seems to be more complicated than this: Sometimes the alt information of images in a gallery is ignored and sometimes not. But until now I don't understand the conditions that must be met. So right now I am not able to reproduce this bug.

[skorasaurus]

+1 the alt-text should be able to be set within the block itself, not within the media library.

alt-text does not describe the content of an image; it describes how the image is used in the particular context of a webpage. so it needs to be set at the time of the block creation or editing, not when the image is originally uploaded to WordPress.

The same image can be used on 2 different pages and its alt-text can be different if it is used in different contexts.

Has some examples of different alt-text usage: https://axesslab.com/alt-texts/

[strarsis]

How can the alt or title be set for a gallery image? I can add a caption, which results in a figcaption, but I can't set a title or alternative text in the gallery itself. IMHO it would be better to have an alt or title for each gallery image, even when it had been set in the media library, than to have nothing at all.

[glendaviesnz]

With the gallery refactor merged the alt tag can now be set on each image in the gallery block so closing this.