Skip to content

Tiled Gallery: Screen reader announces ARIA label instead of alt text #42738

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
alinclamba opened this issue Mar 27, 2025 · 2 comments
Open
Assignees
Labels
[Block] Tiled Gallery Customer Report Issues or PRs that were reported via Happiness. aka "Happiness Request", or "User Report" [Feature] Tiled Gallery A different way to display image galleries on your site, in different organizations and shapes. [Focus] Accessibility Improving usability for all users (a11y) [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ [Pri] Low Triaged [Type] Bug When a feature is broken and / or not performing as intended

Comments

@alinclamba
Copy link

alinclamba commented Mar 27, 2025

Impacted plugin

Jetpack

Quick summary

A user performing manual accessibility checks with JAWS 2025 and SiteImprove reports that images in Tiled Galleries do not announce their alt text to screen readers. Instead, screen readers read the automatically generated ARIA label (e.g., “Open image 1 of 3 in full-screen”). This behavior prevents screen reader users from hearing meaningful image descriptions and causes the site to fail accessibility audits.

The user wants to know if there is a way to remove or override the ARIA labels, so that alt text can be read instead.

They also tried adjusting the block code manually to bypass this, but it broke the gallery layout and changed the image URLs to start with i0.wp.com, even though they have not enabled Jetpack's Site Accelerator.

This was initially reported here: 9567890-zd-a8c

Steps to reproduce

The user reported that:

They created Tiled Galleries on their site and added alt text to the images.

When testing with JAWS 2025 and SiteImprove, the screen reader reads the ARIA label (e.g., “Open image 1 of 3 in full-screen”) instead of the alt text.

They attempted to adjust the gallery code in the editor to work around this, but doing so broke the layout and caused image URLs to use the Jetpack CDN (i0.wp.com), even though Image Accelerator is disabled.

Exact reproduction steps were not provided, but the issue appears to involve the interaction between Tiled Gallery markup, ARIA labels, and screen reader behavior.

Site owner impact

Fewer than 20% of the total website/platform users

Severity

Major

What other impact(s) does this issue have?

No response

If a workaround is available, please outline it here.

No response

Platform (Simple and/or Atomic)

No response

@alinclamba alinclamba added [Block] Tiled Gallery [Feature] Tiled Gallery A different way to display image galleries on your site, in different organizations and shapes. [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ [Type] Bug When a feature is broken and / or not performing as intended Needs triage Ticket needs to be triaged labels Mar 27, 2025
Copy link
Contributor

Support References

This comment is automatically generated. Please do not edit it.

  • 9567890-zen

@github-actions github-actions bot added the Customer Report Issues or PRs that were reported via Happiness. aka "Happiness Request", or "User Report" label Mar 27, 2025
@jeherve jeherve changed the title [Jetpack plugin] Tiled Gallery: Screen reader announces ARIA label instead of alt text Tiled Gallery: Screen reader announces ARIA label instead of alt text Mar 27, 2025
@jeherve jeherve added [Focus] Accessibility Improving usability for all users (a11y) Triaged and removed Needs triage Ticket needs to be triaged labels Mar 27, 2025
@jeherve jeherve moved this from Needs Triage to Triaged in Automattic Prioritization: The One Board ™ Mar 27, 2025
@anomiex
Copy link
Contributor

anomiex commented Mar 27, 2025

Some notes from looking into this:

  • The label is directly added on the <img> in the block rendering JS.
  • It used to say "image 1 of 3 in gallery" until Tiled Gallery: Increasing accessibility of gallery images with respect to opening carousels #37792 (cc @coder-karen @monsieur-z). The previous message seems to have been there when the Tiled Gallery block was first added to Jetpack in 2019 (#11633).
    • I note we now get the "open image" text even if Carousel is disabled.
  • The aria-label attribute gets saved into the post. It seems that if you really want you can go into the Code Editor and delete them from the HTML in the post, which makes the block display a "Block contains unexpected or invalid content" message in the editor but seems to still render correctly. 🤷

@chrisbliss18 chrisbliss18 self-assigned this Apr 17, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Tiled Gallery Customer Report Issues or PRs that were reported via Happiness. aka "Happiness Request", or "User Report" [Feature] Tiled Gallery A different way to display image galleries on your site, in different organizations and shapes. [Focus] Accessibility Improving usability for all users (a11y) [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ [Pri] Low Triaged [Type] Bug When a feature is broken and / or not performing as intended
Projects
Development

No branches or pull requests

4 participants