2008167 - Decorative images not programmatically identified (Story topic sections > story card links > images)

Status: NEW

(Firefox :: New Tab Page, defect)

Description

[John Northup]

Steps to Reproduce

Open DevTools. Inspect <img> elements within story cards. All are decorative.

Expected Behavior

Decorative images have alt="" to explicitly identify them as decorative to AT.

Actual Behavior

Images neither marked as decorative nor removed from the accessibility tree.

User Impact

In our testing, AT accommodates this omission and treats these images as decorative.

WCAG 2.2 References

• WCAG 1.1.1 - Non-text Content

Recommendations

Apply alt="" to decorative <img> elements. This technique is more robust than omitting the alt attribute.

Testing Environment

Any

Assistive Technology Used

Any

Code Pointers

<img loading="lazy" crossorigin="anonymous" sizes="default 296px,296px" src="https://s3.us-east-1.amazonaws.com/pocket-curatedcorpusapi-prod-images/122c7703-30bd-4e82-95d0-e1f585fa196d.jpeg" srcset="https://img-getpocket.cdn.mozilla.net/296x160/smart/filters:format(jpeg):quality(60):no_upscale():strip_exif()/https%3A%2F%2Fs3.us-east-1.amazonaws.com%2Fpocket-curatedcorpusapi-prod-images%2F122c7703-30bd-4e82-95d0-e1f585fa196d.jpeg 296w,https://img-getpocket.cdn.mozilla.net/592x320/smart/filters:format(jpeg):quality(60):no_upscale():strip_exif()/https%3A%2F%2Fs3.us-east-1.amazonaws.com%2Fpocket-curatedcorpusapi-prod-images%2F122c7703-30bd-4e82-95d0-e1f585fa196d.jpeg 592w">

Further Reference

• WebAIM: Alternative Text: Decorative Images

Comment 1

[John Northup]

Attachment: Story card

Comment 2

[❌ Anna Yeddi [:ayeddi] ❌ On leave until 2027-01-04]

Marking this issue as access-S3 because these images are included in the hyperlink element, thus the image is not directly contributing in the accessible name computation.

As explained in my comment in the bug 2008237, the first choice is to make the image decorative (alt=""), but if we have to retain the on-hover tooltip, moving the title string from the hyperlink itself to this image as alt attribute and ensuring to be adding aria-hidden=true to prevent increasing verbosity of the hyperlink, would be an acceptable workaround.

Comment 3

[❌ Anna Yeddi [:ayeddi] ❌ On leave until 2027-01-04]

Assigning the Severity value to align with the Accessibility severity, per discussions with :thecount and :marco