1.1 Positive: Edit link programmatically linked to context (Positive)
1.1.1 WCAG 1.3.1 (A), 2.4.4 (A) - Desktop, Mobile, iPad
On the Benefits section of the Report Overview page, the “Edit” link is correctly associated with its corresponding question using a visually hidden <span>. This ensures that screen reader users hear a meaningful and descriptive label such as “Edit response to the question ‘Did you check that JohnTest gets all the benefits they should have in the last reporting period?’”
This approach meets accessibility requirements for link context and improves the user experience for those navigating via assistive technologies.
FIGURE 1.1: Edit link on Benefits page
1.1.2 Code Snippet
<span>
<a href="..." class="govuk-link">
Edit
<span class="govuk-visually-hidden">
response to the question 'Did you check that JohnTest
gets all the benefits they should have in the last reporting period?'
</span>
</a>
</span>