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

A11y -- skip to main / managing focus #1171

Closed
lhenze opened this issue Jan 19, 2022 · 0 comments · Fixed by inveniosoftware/invenio-theme#275
Closed

A11y -- skip to main / managing focus #1171

lhenze opened this issue Jan 19, 2022 · 0 comments · Fixed by inveniosoftware/invenio-theme#275
Assignees

Comments

@lhenze
Copy link
Member

lhenze commented Jan 19, 2022

Overview

We need "skip links" to allow users to skip over navigation and get directly to the main content. This applies especially to people using screenreaders, keyboards-only, and screen magnifiers.

Required behavior

When the pages loads, keyboard users should be able to press tab and have a link appear that says "skip to main"; if they press return, it should jump to the main content. If they press tab again, the first interactive element in the main content should get focus.

Note, this works best on Chrome; for Macs, latest Firefox and Safari have some general focus quirks that make this tricky to test.

Implementation

Every page should have a link at the top of the page, which is usually hidden, but appears when focused. It should be linked to #main id, which should be attached to the page's main landmark.

W3c description

https://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechanisms-skip.html

Update

Originally, I thought it wasn't behaving well on the search page, but on revisiting it now, it seems fine.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant