Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Skip Link to Bypass Table #3144

Open
3 of 4 tasks
SamiyahKey opened this issue Nov 26, 2024 · 0 comments
Open
3 of 4 tasks

Add Skip Link to Bypass Table #3144

SamiyahKey opened this issue Nov 26, 2024 · 0 comments
Assignees
Labels
accessibility pertains to Section 508 compliance or other accessibility needs 👥 Pod:Accessibility Compliance Describes work needed for get.gov and manage.get.gov to be Section 508 Compliant compliance indicates that the issue is required to satisfy a necessary compliance req dev issue is for the dev team skipped design Design artifact(s) will need to be updated story User stories

Comments

@SamiyahKey
Copy link

SamiyahKey commented Nov 26, 2024

Story

As a keyboard-only user,
I need a skip link that allows me to bypass the table in the main content area and jump directly to the filters,
So that I can efficiently navigate the page without unnecessary repetition.

URL: Domain Request (/admin/registrar/domainrequest/)

Acceptance Criteria

  • Add a skip link at the top of the page and just above the table to allow users to bypass the table and navigate directly to the filters.
    Example: <a href="#filters" class="skip-link" aria-label="Skip to the filters section">Skip to filters</a>
  • The skip link should be visually hidden but accessible via keyboard and become visible when focused.
  • Screen readers must announce the presence of the skip link using correct ARIA labels in programmatic markup, providing clear context for its function.
  • Confirm with a designer that the implementation adheres to WCAG 2.4.1 and 2.1.1

Additional Context

  • Ensure skip links are compatible with various assistive technologies.
  • Test the implementation to confirm that the skip link is accessible in different browser and screen reader combinations.

Issue Links

No response

@SamiyahKey SamiyahKey added design issue is for the design team story User stories labels Nov 26, 2024
@SamiyahKey SamiyahKey self-assigned this Nov 26, 2024
@SamiyahKey SamiyahKey added compliance indicates that the issue is required to satisfy a necessary compliance req accessibility pertains to Section 508 compliance or other accessibility needs dev issue is for the dev team skipped design Design artifact(s) will need to be updated and removed design issue is for the design team labels Nov 26, 2024
@SamiyahKey SamiyahKey removed their assignment Dec 3, 2024
@zandercymatics zandercymatics added 👥 Pod:Accessibility Compliance Describes work needed for get.gov and manage.get.gov to be Section 508 Compliant and removed 👥 Pod:Accessibility Compliance Describes work needed for get.gov and manage.get.gov to be Section 508 Compliant labels Jan 29, 2025
@CocoByte CocoByte self-assigned this Feb 5, 2025
@CocoByte CocoByte moved this from 👶 New to 🔖 Planned in .gov Product Board Feb 5, 2025
@CocoByte CocoByte moved this from 🔖 Planned to 🏗 In progress in .gov Product Board Feb 10, 2025
@CocoByte CocoByte moved this from 🏗 In progress to 👀 In review in .gov Product Board Feb 10, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
accessibility pertains to Section 508 compliance or other accessibility needs 👥 Pod:Accessibility Compliance Describes work needed for get.gov and manage.get.gov to be Section 508 Compliant compliance indicates that the issue is required to satisfy a necessary compliance req dev issue is for the dev team skipped design Design artifact(s) will need to be updated story User stories
Projects
Status: 👀 In review
Development

No branches or pull requests

3 participants