fix(a11y): add alt text to images missing it - #748
Conversation
Preview thumbnails of a named item get a real alt = that item's title, matching the pattern insights already uses for its own preview cards (WorkbookTemplates.vue's :alt="template.title"): block-template preview, page card/list previews. ViewerAvatars.vue has no visible name text next to the avatar (only a hover tooltip), so it gets a real alt too.
Confidence Score: 4/5The PR appears safe to merge, though duplicate preview alt text should be replaced with empty alt attributes. Page and template previews repeat adjacent visible titles, producing redundant screen-reader output; the avatar change has no established defect. Files Needing Attention: frontend/src/components/PageCard.vue, frontend/src/components/PageListItem.vue, frontend/src/components/BuilderBlockTemplates.vue Reviews (1): Last reviewed commit: "fix(a11y): add alt text to images missin..." | Re-trigger Greptile |
| width="250" | ||
| height="140" | ||
| :src="page.meta_image || page.preview" | ||
| :alt="page.page_title || page.page_name" |
There was a problem hiding this comment.
The image alt text repeats the visible title inside the same link, so screen readers announce page links as “Title Title”; use empty alt text for these decorative previews, including the equivalent list and block-template images.
Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
Problem
Four images had no
altattribute.Fix
Preview thumbnails of a named item get a real alt = that item's title (block-template preview, page card/list previews) — matching frappe/insights' own convention for the same kind of preview card.
ViewerAvatars.vuehas no visible name text next to the avatar (only a hover tooltip, which isn't a reliable accessible-name source), so it gets a real alt too.