image field alt help/description should distinguish between decorative & meaningful images

Created on 27 August 2021, over 3 years ago
Updated 8 June 2023, over 1 year ago

Problem/Motivation

Accessibility standards/guidelines expect that decorative images will have alt="". As the Drupal field description texts are currently written, there is no mention of the distinction between decorative and meaningful images. This can easily result in a situation which is burdensome for both content editors and users of screen readers & other assistive technology.

Steps to reproduce

  • The business wants to build trust via the website and requires many human images (examples).
  • The site builder adds an image field to a content type.
  • The site builder, unfamiliar with accessibility, sees the checkboxes for Alt field enabled & required, reads

    "Short description of the image used by screen readers and displayed when the image is not loaded. Enabling this field is recommended"

    "Making this field required is recommended"

    and leaves the Alt field enabled and required.

  • The editor makes new content with the new image field, using an image of a person looking at a computer screen.
  • The editor, unfamiliar with accessibility, reads the required Alt field description

    "Short description of the image used by screen readers and displayed when the image is not loaded. This is important for accessibility."

    enters "person looking at a computer screen", and publishes. The editor makes 100 more pages like this.

  • The user of a screen reader visits the page, trying to understand the content of the page, but is impeded by hearing "person looking at a computer screen", which gives them no useful information, and wastes their time. The user of a screen reader visits 100 more pages like this.

Proposed resolution

I think we can provide a better experience for screen reader users and editors with one easy fix.

Minimal change:

Prepend 3 words: "For meaningful images," to "Short description of the image used by screen readers and displayed when the image is not loaded."

Wordsmithing:

This is an attempt to summarize in a single word the w3c concepts of Informative and Functional,
https://www.w3.org/WAI/tutorials/images/informative/
https://www.w3.org/WAI/tutorials/images/functional/
and exclude the w3c concept Decorative.
https://www.w3.org/WAI/tutorials/images/decorative/

People who are blind aren't viewing a display, they're using a screen reader, so it would be better to say "read".

People unfamiliar with accessibility would benefit from something more specific.
Reviewing the WCAG 2 terms:

  • Perceivable - already implied by "screen reader"
  • Operable - w3c term functional, above
  • Understandable - w3c term informative, above
  • Robust - already implied by "screen reader"

Proposed change: "accessible understanding or use of the image"

Amplified:

"For [meaningful|informative or functional] images, short description of the image used by screen readers and [read] when the image is not loaded. This is important for [accessible understanding or use of the image]."

Remaining tasks

Discuss wording which works yet avoids TLDNR.

User interface changes

Alt field description text above. Sentences to update include "used by screen readers" and "Making this field required is recommended" in >5 places in the core codebase.

API changes

-

Data model changes

-

Release notes snippet

Clarify alt text use for meaningful images.

πŸ› Bug report
Status

Active

Version

11.0 πŸ”₯

Component
Image systemΒ  β†’

Last updated 1 day ago

Created by

πŸ‡ΊπŸ‡ΈUnited States RMattB

Live updates comments and jobs are added and updated live.
  • Accessibility

    It affects the ability of people with disabilities or special needs (such as blindness or color-blindness) to use Drupal.

  • Usability

    Makes Drupal easier to use. Preferred over UX, D7UX, etc.

Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.71.5 2024