axe-core rule: scrollable-region-focusable

Scrollable areas cannot be reached with a keyboard

Fix reference | BarrierScan

What it is

A region scrolls (overflow content) but is not keyboard focusable, so keyboard users have no way to scroll it and reach the hidden content.

Who it blocks

Keyboard-only users, including many screen reader and motor-impaired users. Content below the fold of the scroll area is simply unreachable for them.

How to fix it

Add tabindex="0" to the scrollable container along with an accessible name describing what it contains, or restructure so the content does not require scrolling a sub-region.

Example fix

<!-- Before -->
<div class="specs" style="height:200px; overflow-y:auto">...</div>

<!-- After -->
<div class="specs" style="height:200px; overflow-y:auto"
     tabindex="0" role="region" aria-label="Product specifications">...</div>

This is one of the barrier types BarrierScan checks for on every scan. Request a free accessibility scan to see whether it appears on your site, alongside the rest of the automated findings.