[Link and button labels] Your content doesn't use correct and consistent labels across links, entry points, navigation components, and H1s. (08.02.1)

[shiragoodman]

Status

[2024-07-12] [Fran] This ticket on hold until the DS team componentizes the footer, at which time we can retest and close is issues have been resolved. Note that we (the Sitewide Team) should not close this ticket until issues are resolved.

General Information

VFS team name

Claims & Appeals

VFS product name

HLR V2

Point of Contact/Reviewers

Sarah Koomson (@Saraharaba8) - Accessibility Josh Kim (@joshkimux) - Accessibility

---

Platform Issue

Your content doesn't use correct and consistent labels across links, entry points, navigation components, and H1s.

Issue Details

Links should not open in a new tab or window (WCAG G200)

Reference our a11y presentation on links for more on user scenarios (google slides)

Two scenarios may exist in which they may be necessary. Specifically:

1. Opening a page containing context-sensitive information, such as help instructions, or an alternate means of completing a form, such as a calendar-based date picker, will significantly disrupt a multi-step workflow, such as filling in and submitting a form, if the page is opened in the same window or tab.
2. The user is logged into a secured area of a site, and following a link to a page outside of the secured area would terminate the user's logon. In this case opening external links in an external window allows the user to access such references while keeping their login active in the original window.

If necessary based on the prior scenarios

1. Provide advanced warning that this will open in a new tab using visible link text (G201). For example, Your VA Welcome Kit (opens in new window)
2. If there is not enough space to accommodate the longer (opens in new window) string, consider using an icon with an aria-label so sighted users still have an indication that this may open in a new window.
3. If there is no space at all to accommodate an icon or visible text, use an aria-label

Link, screenshot or steps to recreate

VA.gov Experience Standard

Category Number 08, Issue Number 02

Other References

WCAG SC 2.4.6_AA

---

Platform Recommendation

Include screen reader only elements to links

VFS Team Tasks to Complete

• [ ] Comment on the ticket if there are questions or concerns
• [ ] Close the ticket when the issue has been resolved or validated by your Product Owner. If a team has additional questions or needs Platform help validating the issue, please comment in the ticket.

[Mottie]

I discussed this issue with @Saraharaba8, and it appears that this ticket is related to the page footer links. We should inform the site-wide team if I this is correct.

Our HLR form does include some download links within the additional info expandable components opened by "Why isn’t my issue eligible?" and "Don’t see the issue you’re looking for?" links. So this may still apply to those since no aria-label was included; but I did follow this previous recommendation (https://github.com/department-of-veterans-affairs/vets-design-system-documentation/issues/152#issuecomment-553127340).

[shiragoodman]

@brianalloyd per the comments above and conversation with Sitewide Content, I've added your teams label to this ticket. As always, please do not close this out until the issue has been resolved. If you have questions, please let me know. Thanks!

[brianalloyd]

Thanks @shiragoodman this is definitely in our wheelhouse and will prioritize ticket accordingly. Thanks for looping me into the details.

[joshkimux]

@Mottie I've removed hlr label from here as I've double checked the download links and they're looking golden. Please continue following Jen's awesome guidance 👏

@Saraharaba8 thanks for flagging this! This is a great catch 💯 👏

I've made small tweaks to the recommendation based on previous fixes we've made on VA.gov and WCAG best practice guidance. Specifically:

Links should not open in a new tab or window (WCAG G200)

Reference our a11y presentation on links for more on user scenarios (google slides)

Two scenarios may exist in which they may be necessary. Specifically:

1. Opening a page containing context-sensitive information, such as help instructions, or an alternate means of completing a form, such as a calendar-based date picker, will significantly disrupt a multi-step workflow, such as filling in and submitting a form, if the page is opened in the same window or tab.
2. The user is logged into a secured area of a site, and following a link to a page outside of the secured area would terminate the user's logon. In this case opening external links in an external window allows the user to access such references while keeping their login active in the original window.

If necessary based on the prior scenarios

1. Provide advanced warning that this will open in a new tab using visible link text (G201). For example, Your VA Welcome Kit (opens in new window)
2. If there is not enough space to accommodate the longer (opens in new window) string, consider using an icon with an aria-label so sighted users still have an indication that this may open in a new window.
3. If there is no space at all to accommodate an icon or visible text, use an aria-label

[shiragoodman]

hey @joshkimux - again, if this isn't related to HLR, we need to know what product is is related to. please let me know!

[laflannery]

@FranECross I've reviewed this issue and it's referring to links in the footer - if they open in a new how, how they should be showed and coded, etc.

Based on the current state of things and the fact that the footer is soon-ish (relatively speaking) going to be a component built by the DST, I want to say that:

1. We aren't going to be making any changes to the current footer right now and
2. We will not be managing the state of the footer in the future because that will be owned by DST.

Assuming those 2 things are accurate - what should we do with this ticket? Move it to blocked? Are we able to close it? It is already 2 years old at this point

[FranECross]

@laflannery Thanks so much for reviewing. I'll Ice Box the ticket until the footer is enhanced/componentized/requests in this ticket are moot and then we can close the ticket.

[laflannery]

@FranECross Should this be moved to DST folks?

[FranECross]

@laflannery Good call. I'll post the link to Carol and ask that they transfer it. Thanks!

[FranECross]

Messaged Carol in Slack asking her to take this ticket https://dsva.slack.com/archives/C01DBGX4P45/p1730221830069189