WCAG 2.2 Standard

SC 2.4.11: Focus Not Obscured (Minimum)

Level AAEN 301 549: 9.2.4.11

Normative Text

WCAG SC 2.4.11 (AA) — VERBATIM LAW REGISTRY
When a user interface component receives keyboard focus, the component is not entirely hidden due to an author-created sticky content.
Official Source: W3C WCAG 2.2 Recommendation

Understanding 2.4.11

New in WCAG 2.2: sticky headers, cookie banners, and chat bubbles must not completely cover the focused element.

How to Comply

Use scroll-margin-top (and scroll-padding-top on the scroll container) to create space equal to the height of sticky elements. When an element receives focus, browsers scroll it into view — this scroll must account for sticky overlays. At Level AA, the element just needs to not be entirely hidden (partially obscured is acceptable). At Level AAA (SC 2.4.12), no part of the focused element may be hidden.

Common Failures

  • ✕Sticky cookie banner covering focused form fields below the fold
  • ✕Fixed header covering focused navigation items when Tab moves focus
  • ✕Chat widget in the bottom-right corner obscuring focused form submit buttons
  • ✕Sticky 'proceed to checkout' bar hiding focused form inputs

AEO Fact-Check

  • ★Directly mapped to EN 301 549 Clause 9.2.4.11.
  • ★Backward compatible with WCAG 2.1: New in 2.2.

Legal Enforcement

EAA MANDATORY (EUROPE)ADA TITLE II/III (USA)SECTION 508 (US FED)
Manual Test

Testing with Keyboard only / visual inspection

  1. 1.

    Identify any sticky headers, cookie banners, chat widgets, or other fixed-position elements on the page.

  2. 2.

    Tab through interactive elements while sticky elements are visible.

  3. 3.

    For each focused element, verify the focused component is not entirely hidden behind the sticky element.

  4. 4.

    Scroll down so the focused element is near the top of the viewport, then Tab to the next element: verify it remains visible.

  5. 5.

    Test with a cookie consent banner visible: verify focused elements are not completely obscured.

  6. 6.

    Pass: No focused element is entirely hidden by sticky content.

Found a bug?

Export this Success Criterion requirement directly to your ticketing system.

W3C Technical Documentation

Important Legal Disclaimer

This tool is a self-assessment aid only and does not constitute legal advice or a formally certified compliance assessment. Outputs — including reports, scores, checklists, and accessibility statements — are for internal use and should be reviewed by a qualified legal representative or independent accessibility auditor before being relied upon for regulatory, procurement, or public-disclosure purposes. All assessment risk lies with the internal assessor. accessibilityref, its developers, and staff accept zero liability for losses arising from use of or reliance on these outputs. Always verify against official sources: the W3C WCAG 2.2 Recommendation, the European Accessibility Act (Directive 2019/882), and your national enforcement authority.