Do not let sticky bars bury the focused element
Tab down the page and focus lands behind the sticky footer. Tab back up and it goes under the header. F110 is the failure technique for that, and a match is a defect rather than a layout decision. One word decides most findings here, and the word is completely. The Level AA rule breaks only when the focused control is entirely hidden, so a button half covered by a sticky bar passes this one and fails the enhanced version at AAA. Anything fixed to the viewport can cause it, not just headers and footers, which is why cookie banners and chat bubbles turn up in these findings. Content the reader opened themselves gets treated differently, though. Where they can reveal the focused control without moving focus, by scrolling or by closing the thing, that is not this failure.
How we find it in an audit
We tab the whole page in both directions, because the two directions turn up different failures. Going forward tends to bury focus under a sticky footer and going backward tends to bury it under the header, so a single pass finds about half of what is there. Viewport height gets varied too, since a bar that leaves room on a desktop swallows the screen on a laptop with a short window. Every element that vanishes goes into the finding with the window height it vanished at.
How affected users experience it
Sighted keyboard users carry the whole weight of this one. They press Tab, the focus indicator is gone, and nothing on the page says where they are. Pressing Enter becomes a guess about which control is sitting under the bar. Screen magnifier users get the same thing amplified, because their view is already small and a fixed bar takes a much larger share of it. The usual workaround is to scroll by hand and tab again, over and over, which turns a short form into a long afternoon.
Passes vs. fails
Passes
html { scroll-padding-top: 80px; scroll-padding-bottom: 80px; }Fails
header { position: sticky; top: 0; height: 72px; }
/* focused links scroll underneath it */The other techniques filed under this rule
2 guides on this site are filed under 2.4.11 Focus Not Obscured (Minimum). W3C documents this one as a failure of that rule, so it describes a way the rule gets broken rather than a way to pass it.
This guide is our interpretation of W3C technique F110: Failure of Success Criterion 2.4.11 Focus Not Obscured (Minimum) due to a sticky footer or header completely hiding focused elements. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.