WCAG 2.2 became an official W3C recommendation in October 2023, but most product teams have not yet updated their audits. The most common reason I hear: "We did this last year with 2.1 — do we really have to redo it already?" The short answer is yes. The longer answer is: it depends on how exposed your product is to the patterns the new criteria address.
This article is not a list of all the new criteria with abstract explanations. It is a practical guide to understanding which criteria concretely affect the most common products, and how to approach the changes incrementally without blocking your development team.
The nine new criteria at a glance
WCAG 2.2 introduces nine new success criteria compared to version 2.1. Seven are at level A or AA — meaning they are required for standard conformance. Two are at level AAA. The most impactful ones are worth knowing well.
2.4.11 — Focus Not Obscured (AA). When a component receives keyboard focus, it must not be completely hidden by other content — a sticky banner at the top of the page, a notification bar at the bottom. This is the criterion I find violated most often in products with sticky headers.
2.4.13 — Focus Appearance (AA). The most technical and the most underestimated. The focus indicator must have a minimum area equal to the perimeter of the component multiplied by 2px, and a contrast ratio of at least 3:1 between focused and unfocused states. The classic 1px outline is no longer sufficient. You need a visible, thick ring with good contrast.
2.5.7 — Dragging Movements (AA). All functions that require dragging must have an accessible alternative that works with a single pointer. This affects sortable lists, custom sliders, calendars with drag-to-select, and any interface relying on drag gestures.
2.5.8 — Target Size (Minimum) (AA). The minimum clickable target must be at least 24×24 CSS pixels. Many common icon button patterns fall below this threshold.
3.3.7 — Redundant Entry (A). Information already entered in a multi-step process must not be requested again. This affects checkout flows, configuration wizards, and any multi-step form.
Where to look for the most common violations
Not all products are exposed in the same way. The high-risk patterns for WCAG 2.2 are:
- Navigation with sticky headers — frequent violation of 2.4.11
- Custom focus outlines removed or minimised — violation of 2.4.13
- Drag-and-drop without alternatives — violation of 2.5.7
- Icon buttons smaller than 24px — violation of 2.5.8
- Multi-step forms that re-ask for data — violation of 3.3.7
How to structure the update audit
There is no need to redo a full audit from scratch. The approach I use is a differential audit: start from the documentation of the existing 2.1 audit and verify specifically the nine new criteria, plus the removal of criterion 4.1.1 (Parsing), which WCAG 2.2 has officially deprecated.
The process follows four phases: inventory of at-risk patterns; manual keyboard testing; touch target measurement on mobile; review of multi-step flows.
Accessibility is not a sprint you do once. It is ongoing maintenance, like security. Every release can introduce new violations.
Focus Appearance in practice: the numbers
Criterion 2.4.13 requires a calculation. The formula: focus indicator area ≥ component perimeter × 2px. For a button measuring 120px×40px, the perimeter is 320px, so the minimum area must be 640px². A 3px outline is comfortably safe. A 1px outline — still the default for many teams — is not.
In practical terms, moving to a 2–3px ring with a contrasting colour is not a rewrite — it is a change to a few lines of CSS in the design system. If you are using a token system, updating the focus tokens globally is all it takes.
The European regulatory context
The European Accessibility Act came into force in June 2025 for digital products and services. The technical reference standard EN 301 549 cites WCAG 2.1 as the minimum baseline, but many national implementations are aligning with 2.2. Teams operating in regulated sectors — healthcare, finance, public administration — face a legal obligation that goes well beyond good design practice.
Updating your audit now is not just the right thing to do. It is also protection against growing legal exposure in a regulatory environment that is tightening fast.
If you need a WCAG 2.2 compliance audit or a plan to integrate accessibility into your team's design process, I am available for an initial conversation.
WCAG 2.2 è diventato una raccomandazione ufficiale del W3C nell'ottobre 2023, ma la maggior parte dei team di prodotto non ha ancora aggiornato i propri audit. La ragione più comune che sento: "L'abbiamo fatto l'anno scorso con la 2.1 — dobbiamo davvero rifarlo già?" La risposta breve è sì. La risposta più lunga è: dipende da quanto il tuo prodotto è esposto ai pattern che i nuovi criteri riguardano.
Questo articolo non è un elenco di tutti i nuovi criteri con spiegazioni astratte. È una guida pratica per capire quali criteri impattano concretamente i prodotti più comuni, e come affrontare le modifiche in modo incrementale senza bloccare il team di sviluppo.
I nove nuovi criteri in sintesi
WCAG 2.2 introduce nove nuovi criteri di successo rispetto alla versione 2.1. Sette sono al livello A o AA — il che significa che sono obbligatori per la conformità standard. Due sono al livello AAA. Quelli più impattanti vale la pena conoscere bene.
2.4.11 — Focus non oscurato (AA). Quando un componente riceve il focus da tastiera, non deve essere completamente nascosto da altri contenuti — un banner fisso in cima alla pagina, una barra di notifiche in basso. Questo è il criterio che trovo violato più spesso nei prodotti con header fissi.
2.4.13 — Aspetto del focus (AA). Il più tecnico e il più sottovalutato. L'indicatore di focus deve avere un'area minima pari al perimetro del componente moltiplicato per 2px, e un rapporto di contrasto di almeno 3:1 tra lo stato con focus e quello senza. Il classico outline di 1px non è più sufficiente. Serve un anello visibile, spesso, con buon contrasto.
2.5.7 — Movimenti di trascinamento (AA). Tutte le funzioni che richiedono un'azione di trascinamento devono avere un'alternativa accessibile che funzioni con un singolo puntatore. Questo impatta liste ordinabili, slider personalizzati, calendari con selezione a trascinamento e qualsiasi interfaccia che si basi su gesture drag.
2.5.8 — Dimensione dell'obiettivo (minima) (AA). L'area cliccabile minima deve essere di almeno 24×24 pixel CSS. Molti pattern comuni di pulsanti icon-only scendono sotto questa soglia.
3.3.7 — Inserimento ridondante (A). Le informazioni già inserite in un processo multi-step non devono essere richieste di nuovo. Questo impatta i flussi di checkout, i wizard di configurazione e qualsiasi form multi-step.
Dove cercare le violazioni più comuni
Non tutti i prodotti sono esposti allo stesso modo. I pattern ad alto rischio per WCAG 2.2 sono:
- Navigazione con header fissi — violazione frequente del 2.4.11
- Outline di focus rimossi o ridotti al minimo — violazione del 2.4.13
- Drag-and-drop senza alternative — violazione del 2.5.7
- Pulsanti icona più piccoli di 24px — violazione del 2.5.8
- Form multi-step che richiedono di nuovo dati già inseriti — violazione del 3.3.7
Come strutturare l'audit di aggiornamento
Non è necessario rifare un audit completo da zero. L'approccio che uso è un audit differenziale: si parte dalla documentazione dell'audit 2.1 esistente e si verificano specificamente i nove nuovi criteri, più la rimozione del criterio 4.1.1 (Parsing), che WCAG 2.2 ha ufficialmente deprecato.
Il processo segue quattro fasi: inventario dei pattern a rischio; test manuale da tastiera; misurazione degli obiettivi touch su mobile; revisione dei flussi multi-step.
L'accessibilità non è uno sprint che si fa una volta sola. È manutenzione continua, come la sicurezza. Ogni release può introdurre nuove violazioni.
Focus Appearance in pratica: i numeri
Il criterio 2.4.13 richiede un calcolo. La formula: area dell'indicatore di focus ≥ perimetro del componente × 2px. Per un pulsante di 120px×40px, il perimetro è 320px, quindi l'area minima deve essere 640px². Un outline da 3px è ampiamente sicuro. Un outline da 1px — ancora il default per molti team — non lo è.
In termini pratici, passare a un anello da 2–3px con un colore contrastante non è una riscrittura — è una modifica a poche righe di CSS nel design system. Se stai usando un sistema di token, aggiornare globalmente i token del focus è sufficiente.
Il contesto normativo europeo
L'European Accessibility Act è entrato in vigore nel giugno 2025 per i prodotti e servizi digitali. Lo standard tecnico di riferimento EN 301 549 cita WCAG 2.1 come baseline minima, ma molte implementazioni nazionali si stanno allineando alla 2.2. I team che operano in settori regolamentati — sanità, finanza, pubblica amministrazione — hanno un obbligo legale che va ben oltre la buona pratica di design.
Aggiornare il proprio audit adesso non è solo la cosa giusta da fare. È anche una protezione contro una crescente esposizione legale in un contesto normativo che si sta stringendo rapidamente.
Se hai bisogno di un audit di conformità WCAG 2.2 o di un piano per integrare l'accessibilità nel processo di design del tuo team, sono disponibile per una prima conversazione.
WCAG 2.2于2023年10月成为W3C官方推荐标准，但大多数产品团队尚未更新他们的审计。我最常听到的理由："我们去年刚用2.1做了——真的需要再做一遍吗？"简短的回答是肯定的。更长的回答是：这取决于你的产品对新标准所针对的模式有多大暴露风险。
本文不是所有新标准的抽象说明列表。它是一份实用指南，帮助你了解哪些标准具体影响最常见的产品，以及如何以增量方式处理变更，而不阻塞开发团队。
九个新标准一览
WCAG 2.2相比2.1版本引入了九个新的成功标准。其中七个在A或AA级别——意味着它们是标准合规性的强制要求。两个在AAA级别。最有影响力的值得深入了解。
2.4.11 — 焦点不被遮挡（AA）。当组件获得键盘焦点时，它不能被其他内容完全隐藏——页面顶部的固定横幅、底部的通知栏。这是我在带有固定标题的产品中发现最频繁违反的标准。
2.4.13 — 焦点外观（AA）。最技术性也最被低估的标准。焦点指示器的面积必须至少等于组件周长乘以2px，且焦点状态与非焦点状态之间的对比度比至少为3:1。经典的1px轮廓已不再足够。你需要一个可见的、粗的、对比度良好的环。
2.5.7 — 拖动动作（AA）。所有需要拖动的功能必须有一个可用单一指针操作的无障碍替代方案。这影响可排序列表、自定义滑块、带拖动选择的日历，以及任何依赖拖动手势的界面。
2.5.8 — 目标尺寸（最小）（AA）。最小可点击目标必须至少为24×24 CSS像素。许多常见的纯图标按钮模式低于这个阈值。
3.3.7 — 冗余输入（A）。在多步骤流程中已输入的信息不得再次被要求。这影响结账流程、配置向导以及任何多步骤表单。
在哪里寻找最常见的违规
并非所有产品的暴露程度相同。WCAG 2.2的高风险模式是：
- 带固定标题的导航 — 频繁违反2.4.11
- 移除或最小化的自定义焦点轮廓 — 违反2.4.13
- 没有替代方案的拖放 — 违反2.5.7
- 小于24px的图标按钮 — 违反2.5.8
- 重新询问已输入数据的多步骤表单 — 违反3.3.7
如何构建更新审计
没有必要从头开始进行完整审计。我使用的方法是差异审计：从现有2.1审计的文档出发，专门验证九个新标准，加上已被WCAG 2.2正式废弃的标准4.1.1（解析）的移除。
流程遵循四个阶段：高风险模式清单；手动键盘测试；移动端触摸目标测量；多步骤流程审查。
无障碍性不是一次性完成的冲刺。它是持续的维护，就像安全一样。每次发布都可能引入新的违规。
焦点外观实践：数字
标准2.4.13需要计算。公式：焦点指示器面积 ≥ 组件周长 × 2px。对于120px×40px的按钮，周长是320px，因此最小面积必须为640px²。3px的轮廓完全安全。1px的轮廓——许多团队仍然使用的默认值——则不够。
在实践中，切换到2–3px的环并使用对比色不是重写——它只是设计系统中几行CSS的修改。如果你使用token系统，全局更新焦点token就足够了。
欧洲法规背景
欧洲无障碍法案于2025年6月针对数字产品和服务生效。技术参考标准EN 301 549将WCAG 2.1作为最低基准，但许多国家实施正在与2.2对齐。在受监管行业运营的团队——医疗、金融、公共行政——面临着远超良好设计实践的法律义务。
现在更新你的审计不仅仅是正确的事。它也是对快速收紧的监管环境中日益增长的法律风险的保护。
如果你需要WCAG 2.2合规审计或将无障碍性整合到团队设计流程的计划，我可以提供初步对话。
WCAG 2.2 wurde im Oktober 2023 zur offiziellen W3C-Empfehlung, aber die meisten Produktteams haben ihre Audits noch nicht aktualisiert. Der häufigste Grund, den ich höre: „Wir haben das letztes Jahr mit 2.1 gemacht — müssen wir das wirklich schon wieder machen?" Die kurze Antwort lautet ja. Die längere Antwort ist: Es hängt davon ab, wie stark Ihr Produkt den Mustern ausgesetzt ist, die die neuen Kriterien ansprechen.
Dieser Artikel ist keine Liste aller neuen Kriterien mit abstrakten Erklärungen. Er ist ein praktischer Leitfaden, um zu verstehen, welche Kriterien die häufigsten Produkte konkret betreffen und wie man die Änderungen schrittweise angehen kann, ohne das Entwicklungsteam zu blockieren.
Die neun neuen Kriterien auf einen Blick
WCAG 2.2 führt neun neue Erfolgskriterien gegenüber Version 2.1 ein. Sieben sind auf Ebene A oder AA — das heißt, sie sind für die Standard-Konformität erforderlich. Zwei sind auf Ebene AAA. Die wirkungsvollsten lohnt es sich gut zu kennen.
2.4.11 — Fokus nicht verdeckt (AA). Wenn eine Komponente den Tastaturfokus erhält, darf sie nicht vollständig durch andere Inhalte verborgen sein — ein fixiertes Banner oben auf der Seite, eine Benachrichtigungsleiste unten. Dies ist das Kriterium, das ich am häufigsten in Produkten mit fixierten Kopfzeilen verletzt finde.
2.4.13 — Fokusdarstellung (AA). Das technischste und am meisten unterschätzte Kriterium. Der Fokusindikator muss eine Mindestfläche haben, die dem Umfang der Komponente multipliziert mit 2px entspricht, und ein Kontrastverhältnis von mindestens 3:1 zwischen fokussiertem und unfokussiertem Zustand. Der klassische 1px-Outline ist nicht mehr ausreichend. Es wird ein sichtbarer, dicker Ring mit gutem Kontrast benötigt.
2.5.7 — Ziehbewegungen (AA). Alle Funktionen, die Ziehen erfordern, müssen eine barrierefreie Alternative haben, die mit einem einzigen Zeiger funktioniert. Dies betrifft sortierbare Listen, benutzerdefinierte Schieberegler, Kalender mit Drag-to-Select und jedes Interface, das auf Drag-Gesten angewiesen ist.
2.5.8 — Zielgröße (Minimum) (AA). Das minimale anklickbare Ziel muss mindestens 24×24 CSS-Pixel betragen. Viele gängige Icon-Button-Muster unterschreiten diesen Schwellenwert.
3.3.7 — Redundante Eingabe (A). Informationen, die bereits in einem mehrstufigen Prozess eingegeben wurden, dürfen nicht erneut angefordert werden. Dies betrifft Checkout-Flows, Konfigurationsassistenten und jedes mehrstufige Formular.
Wo man nach den häufigsten Verstößen sucht
Nicht alle Produkte sind gleich stark exponiert. Die Hochrisiko-Muster für WCAG 2.2 sind:
- Navigation mit fixierten Kopfzeilen — häufiger Verstoß gegen 2.4.11
- Benutzerdefinierte Fokus-Outlines entfernt oder minimiert — Verstoß gegen 2.4.13
- Drag-and-Drop ohne Alternativen — Verstoß gegen 2.5.7
- Icon-Buttons kleiner als 24px — Verstoß gegen 2.5.8
- Mehrstufige Formulare, die bereits eingegebene Daten erneut abfragen — Verstoß gegen 3.3.7
Wie man das Aktualisierungsaudit strukturiert
Es ist nicht nötig, ein vollständiges Audit von Grund auf neu zu machen. Der Ansatz, den ich verwende, ist ein differenzielles Audit: Man beginnt mit der Dokumentation des bestehenden 2.1-Audits und überprüft speziell die neun neuen Kriterien sowie die Entfernung von Kriterium 4.1.1 (Parsing), das WCAG 2.2 offiziell abgeschafft hat.
Der Prozess folgt vier Phasen: Inventar der Risiko-Muster; manuelles Tastatur-Testing; Messung der Touch-Ziele auf Mobilgeräten; Überprüfung der mehrstufigen Flows.
Barrierefreiheit ist kein Sprint, der einmal gemacht wird. Es ist fortlaufende Wartung, wie Sicherheit. Jedes Release kann neue Verstöße einführen.
Fokusdarstellung in der Praxis: die Zahlen
Kriterium 2.4.13 erfordert eine Berechnung. Die Formel: Fläche des Fokusindikators ≥ Umfang der Komponente × 2px. Für einen Button mit 120px×40px beträgt der Umfang 320px, also muss die Mindestfläche 640px² betragen. Ein 3px-Outline ist sicher. Ein 1px-Outline — noch immer der Standard für viele Teams — ist es nicht.
In der Praxis ist der Wechsel zu einem 2–3px Ring mit einer kontrastierenden Farbe keine Neufassung — es ist eine Änderung an einigen CSS-Zeilen im Design System. Wenn Sie ein Token-System verwenden, reicht es aus, die Fokus-Tokens global zu aktualisieren.
Der europäische Rechtsrahmen
Der European Accessibility Act ist im Juni 2025 für digitale Produkte und Dienste in Kraft getreten. Der technische Referenzstandard EN 301 549 nennt WCAG 2.1 als Mindestbasis, aber viele nationale Umsetzungen orientieren sich an 2.2. Teams in regulierten Sektoren — Gesundheitswesen, Finanzen, öffentliche Verwaltung — haben eine rechtliche Verpflichtung, die weit über gute Designpraxis hinausgeht.
Das Audit jetzt zu aktualisieren ist nicht nur das Richtige. Es ist auch ein Schutz gegen wachsende rechtliche Risiken in einem sich schnell verschärfenden regulatorischen Umfeld.
Wenn Sie ein WCAG 2.2 Konformitäts-Audit oder einen Plan zur Integration von Barrierefreiheit in den Designprozess Ihres Teams benötigen, stehe ich für ein erstes Gespräch zur Verfügung.