Bypass Block does not shift Screen Reader Focus when activated
| Field | Value |
|---|---|
| Rule code | Manual_BypassBlockFocus_Missing |
| WCAG conformance level | A |
| WCAG success criterion | 2.4.1 Bypass Blocks |
| Must be fixed at source | No |
Description
When a user activates a bypass block, their focus should move to the content block that is being bypassed. For instance, when clicking a 'Skip to Main Content' link, the screen reader or keyboard focus should be shifted to the main content area, allowing seamless navigation for users relying on assistive technologies.
How to fix
Ensure the bypass link or activator (e.g., "Skip to Main Content") programmatically moves focus to the target element. For example: <a href="#main-content" onclick="document.getElementById('main-content').focus();">Skip to Main Content</a><div id="main-content" role="main">Main content goes here</div>.