Skip to content
ShopAssist Docs
Widget

Widget accessibility

How the widget meets WCAG 2.2 AA and EN 301 549: keyboard use, screen readers, contrast, zoom and reduced motion.

The widget is built to WCAG 2.2 AA and EN 301 549. The accessibility conformance report documents the results.

  • Keyboard: every control is reachable with Tab; Escape closes the chat and returns focus to the launcher. On narrow screens the chat is a modal dialog with a focus trap; on desktop it is non-modal. The widget adds no global keyboard shortcuts.
  • Screen readers: replies are announced sentence by sentence as they stream; cards are announced with a summary ("3 products shown", "Order #1042: Shipped"). Errors are announced assertively, everything else politely.
  • Visual: text contrast ≥ 4.5:1 and controls ≥ 3:1 in light and dark themes; the text colour on your accent colour is chosen automatically. Works at 320 px width and 400 % zoom, and with custom text spacing.
  • Targets are at least 24 × 24 px, primary buttons 44 px.
  • Motion: with "reduce motion", animations and typing dots are replaced by static indicators.
  • Language: the chat and each message carry a lang attribute.
  • No time limits except confirmation and code expiry, which are announced and can be extended or resent.

Your part: keep the accent colour's outline contrast at 3:1 (the dashboard warns), don't hide the widget's focus ring with global CSS, and describe the widget in your accessibility statement (accessibility for merchants).

Last updated on