This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung →
Accessibility
Why must a fixed header bar never fully obscure keyboard focus?
A fixed header bar, a cookie notice, or a sticky footer must never completely obscure the currently focused element, because otherwise keyboard users can no longer see where they are. Criterion 2.4.11 is a new addition with WCAG 2.2: as focus moves through the page, the active element must stay at least partially visible — even when parts of the page float above the content while scrolling.
How sticky bars swallow focus
Many websites fix elements to the edge of the screen: the menu bar at the top, a cookie notice at the bottom, and maybe a newsletter banner in between. These layers float above the content. As keyboard focus moves through the page, the active element can end up right behind one of these bars — the focus outline is there, but nobody sees it. For keyboard users, this feels as though focus has vanished: they keep tabbing and don't know which button they'll hit with the Enter key. Tall cookie notices at the bottom edge are especially tricky — whole rows of form fields can disappear behind them while tabbing through.
How the audit service measures focus obscuring
During the actual keyboard pass, the audit service checks several points of the active element at every focus stop: if an opaque, fixed, or sticky area lies over the element at all of these points, it counts as fully obscured — the criterion is violated, and the report names the element along with a supporting screenshot. The measurement deliberately judges cautiously: elements that are themselves part of a fixed bar never count as hidden behind it, and transparent overlays don't count as obscuring. If the element stays at least partially visible at every stop, the criterion counts as passed.
- Tab through your page and watch the bottom edge of the screen — does focus temporarily disappear behind the cookie notice?
- Keep fixed bars as narrow as possible, especially on small screens.
- Ask your agency to build in a scroll margin on focus, so the active element never ends up under fixed bars.
- Test with the cookie notice visible — that's exactly the state in which first-time visitors experience your page.
FAQ
What does "Focus Not Obscured" mean in WCAG 2.2?
Criterion 2.4.11 requires: when an element receives keyboard focus, it must not lie fully behind other content — such as behind fixed menu bars, cookie notices, or sticky footers. At least part of the element must remain visible. Otherwise keyboard users lose their orientation, because their only sign of location becomes invisible.
Are fixed menu bars and cookie banners now forbidden?
No. Fixed bars remain allowed — they just must not fully overlay the currently focused element. In practice, that means: keep bars narrow and build in a scroll margin on focus, so the active element stays visible above or below the bar. Both can be solved with a few lines in the style rules.
How is focus obscuring measured automatically?
Our audit service actually tabs through the page and checks several points of the active element at every stop: if an opaque fixed area lies over it everywhere, the element counts as fully obscured and the criterion as violated — backed up with a screenshot. Transparent overlays and elements that themselves sit inside a fixed bar are deliberately not held against the site.