In plain English
When someone tabs through your page with a keyboard, the thing they land on has to be visible. The AA version (2.4.11) is satisfied if any part of it peeks out. This AAA version is stricter: the focused item must be completely visible, with nothing overlapping it, not a sticky header, cookie banner, or chat bubble.
The usual offender is a fixed header that the page scrolls content up underneath.
Who this is for
- Keyboard-only users, who lose their place when focus slides under a header.
- Low-vision keyboard users, who need the whole focused control in view.
How to check and fix it yourself
Put your mouse away and press Tab down the whole page. Watch each focused item.
If any gets partly tucked under a sticky header or floating widget, add
scroll-padding equal to the header height so the browser scrolls it fully clear.
/* reserve space so focused items never sit under a 72px sticky header */
html {
scroll-padding-top: 72px;
}
Where we can help
We keyboard-tab your key pages and watch for anything sticky covering the focused
control, then give you the exact scroll-padding fix. It is one of the new
WCAG 2.2 checks that sticky headers commonly
trip.