Images with blank alt text shouldn't be wrapped in anchor tags #355
Labels
Comments
tombye
added a commit
that referenced
this issue
Sep 20, 2024
When we wrap images in hyperlinks, we make the image's alt text their only content. If those images have no alt text, they are effectively empty links. This means they have no accessible name if queried by an accessibility API: https://w3c.github.io/html-aam/#img-element-accessible-name-computation ...so it'll be up to the screen reader to guess. In testing, this ends up being the file name, which can't be relied on to explain the image. All in all, this behaviour breaks the non-text content success criterion from WCAG 2.2: https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html This issue is recorded here: #355 This commit take the approach of introducing a guard against images with no alt text and choosing not to wrap them in hyperlinks when found. My Ruby is basic at best but I looked at the method we're overwriting from the Red Carpet HTML renderer and copied across its interface more exactly, to make it clear where the alt_text variable comes from.
tombye
added a commit
that referenced
this issue
Oct 1, 2024
When we wrap images in hyperlinks, we make the image's alt text their only content. If those images have no alt text, they are effectively empty links. This means they have no accessible name if queried by an accessibility API: https://w3c.github.io/html-aam/#img-element-accessible-name-computation ...so it'll be up to the screen reader to guess. In testing, this ends up being the file name, which can't be relied on to explain the image. All in all, this behaviour breaks the non-text content success criterion from WCAG 2.2: https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html This issue is recorded here: #355 This commit take the approach of introducing a guard against images with no alt text and choosing not to wrap them in hyperlinks when found. My Ruby is basic at best but I looked at the method we're overwriting from the Red Carpet HTML renderer and copied across its interface more exactly, to make it clear where the alt_text variable comes from.
marcotranchino
pushed a commit
that referenced
this issue
Oct 21, 2024
When we wrap images in hyperlinks, we make the image's alt text their only content. If those images have no alt text, they are effectively empty links. This means they have no accessible name if queried by an accessibility API: https://w3c.github.io/html-aam/#img-element-accessible-name-computation ...so it'll be up to the screen reader to guess. In testing, this ends up being the file name, which can't be relied on to explain the image. All in all, this behaviour breaks the non-text content success criterion from WCAG 2.2: https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html This issue is recorded here: #355 This commit take the approach of introducing a guard against images with no alt text and choosing not to wrap them in hyperlinks when found. My Ruby is basic at best but I looked at the method we're overwriting from the Red Carpet HTML renderer and copied across its interface more exactly, to make it clear where the alt_text variable comes from.
huwd
pushed a commit
that referenced
this issue
Oct 22, 2024
When we wrap images in hyperlinks, we make the image's alt text their only content. If those images have no alt text, they are effectively empty links. This means they have no accessible name if queried by an accessibility API: https://w3c.github.io/html-aam/#img-element-accessible-name-computation ...so it'll be up to the screen reader to guess. In testing, this ends up being the file name, which can't be relied on to explain the image. All in all, this behaviour breaks the non-text content success criterion from WCAG 2.2: https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html This issue is recorded here: #355 This commit take the approach of introducing a guard against images with no alt text and choosing not to wrap them in hyperlinks when found. My Ruby is basic at best but I looked at the method we're overwriting from the Red Carpet HTML renderer and copied across its interface more exactly, to make it clear where the alt_text variable comes from.
|
fixed with #375 |
maverickvi
pushed a commit
to hmrc/tech-docs-gem
that referenced
this issue
Nov 4, 2024
When we wrap images in hyperlinks, we make the image's alt text their only content. If those images have no alt text, they are effectively empty links. This means they have no accessible name if queried by an accessibility API: https://w3c.github.io/html-aam/#img-element-accessible-name-computation ...so it'll be up to the screen reader to guess. In testing, this ends up being the file name, which can't be relied on to explain the image. All in all, this behaviour breaks the non-text content success criterion from WCAG 2.2: https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html This issue is recorded here: alphagov#355 This commit take the approach of introducing a guard against images with no alt text and choosing not to wrap them in hyperlinks when found. My Ruby is basic at best but I looked at the method we're overwriting from the Red Carpet HTML renderer and copied across its interface more exactly, to make it clear where the alt_text variable comes from.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
What should change
Images with blank alt text shouldn't be wrapped in anchor tags.
User need
All images are wrapped in anchor tags which link to the image on its own, including images with blank alt text.
When the images appear in-page, we tend to provide the information in them as text in the page. For example:
https://docs.publishing.service.gov.uk/manual/architecture-deep-dive.html
But that still leaves the link with an empty accessible name, because its contents are the image. Based on this WCAG rule, that breaks the following success criteria:
The text was updated successfully, but these errors were encountered: