bypass
Page must have means to bypass repeated blocks
Description
Screen reader users cannot randomly access any point in the interface by just pointing to it,
unlike a seeing user would do with a mouse. Screen readers allow their users to skip directly to a specific area
without having to go through each element linearly. Among other, screen readers naturally use landmark elements
(e.g. <header>
, <main>
, <footer>
etc.) as "hooks" to allow the user to skip between them with a keystroke.
When an interface is not divided and structured semantically, screen readers lack these explicit "hooks" to map the
UI for the user. A proper semantic structure is also very helpful to users who do not seem to get an accurate mental
image of the interface.
Quick Fixes
1<body>2 <header>3 <!-- Header content -->4 <nav>5 <!-- Page navigation -->6 </nav>7 </header>8 <main>9 <section>10 <!-- Section 1 content -->11 </section>12 <section>13 <!-- Section 2 content -->14 </section>15 </main>16 <aside>17 <!-- Aside content -->18 </aside>19 <footer>20 <!-- Footer content -->21 </footer>22</body>
How Users Are Affected
Screen reader users will be required to linearly go through each element of the UI until it reaches the desired element, which makes the user experience tedious and inefficient.
WCAG Success criteria
This issue might cause elements to fail one or more of the following Success criteria:
2.4.1 Bypass Blocks (A)