search

civictheme / uikit

UI atomic component-based library with Storybook integration
https://uikit.civictheme.io/
GNU General Public License v2.0
4 stars 4 forks source link

WCAG 4.1.3 AA: Link text contains file name data (Issue A5) #353

Open CJE001 opened 1 week ago

CJE001 commented 1 week ago

Summary

Via Vision Australia assessment: August 2024

Note: DTA have a 90 day remediation period to address the identified issues within the audit, all issues must be resolved to obtain WCAG 2.2 certification for digital.gov.au

Link text to download the Digital Service Standard document and poster contains file name information and characters.

The links also contain a title attribute that duplicates this text, which results in the link name being announced twice by some screen readers.

Steps to reproduce

Example

Digital Service Standard (DSS) | digital.gov.au (https://www.digital.gov.au/policy/digital-experience/digital-service-standard)

Observed outcome

When the accessible name for a link contains file name information and characters, it may make it harder for users to understand the link purpose, and results in an unnecessarily long name.

When the title attribute is included and the link already has an accessible name, the title attribute will then act as the element description in the accessibility tree. This results in some screen readers announcing duplicate information.

Picture2

Code used

<a class="ct-link ct-theme-light ct-attachment__links__link" href="/sites/default/files/documents/2024-07/23-0210%20digital%20service%20standard%20FINAL_Acc%20r2_KC_UA.pdf" title="Download 23-0210 digital service standard FINAL_Acc r2_KC_UA.pdf">
23-0210 digital service standard FINAL_Acc r2_KC_UA.pdf
<span class="ct-attachment__links__link__extension">
(pdf, 503.29 KB)
</span>0 
</a>
010p;…
<a class="ct-link ct-theme-light ct-attachment__links__link" href="/sites/default/files/documents/2024-07/24-0142%20DSS%20Poster%20FINAL%20print_0.pdf" title="Download 24-0142 DSS Poster FINAL print_0.pdf">
24-0142 DSS Poster FINAL print_0.pdf
<span class="ct-attachment__links__link__extension">
(pdf, 182.53 KB)
</span>
</a>

Expected outcome

Component would benefit from ability to override file name at the page level.

  1. Improve the link text to include only relevant information.
  2. Delete the title attribute.

Code example

<a class="ct-link ct-theme-light ct-attachment__links__link" href="/sites/default/files/documents/2024-07/23-0210%20digital%20service%20standard%20FINAL_Acc%20r2_KC_UA.pdf">
Digital Service Standard
<span class="ct-attachment__links__link__extension">
(PDF, 503.29 KB)
</span>
</a>
fionamorrison23 commented 2 days ago

Hi @CJE001 would you be able to provide the priority here as you have done on other tickets? Thanks.