My charts Create a chart

Accessibility

Everyone should be able to make a seating chart — with a mouse, a keyboard, a touch screen or a screen reader.

Last updated

Our target

We aim to meet the Web Content Accessibility Guidelines (WCAG) 2.2 at level AA across the public pages and the editor. This statement describes what we have built and checked, and what we know still needs work.

What’s built in

  • No dragging required. Every drag action has an alternative: choose a person, then a seat; use the seat list; or pick a person from a seat’s details.
  • Keyboard operation. Tab reaches the plan; arrow keys move between seats; Enter chooses; Esc cancels. Press ? in the editor for all shortcuts. Shortcuts never fire while typing.
  • Screen readers. Each seat has an accessible name with its table, seat number, occupant and status. A seat list mirrors the plan as ordinary buttons. Results such as “Swapped Ana and Ben” are announced politely.
  • Not color alone. Locked seats show a lock, rule problems show a symbol and text, reserved seats use a dashed outline and a label, and band sections print codes as well as colors.
  • Focus and contrast. Visible focus outlines and text contrast designed to meet AA ratios.
  • Zoom and text size. Pages reflow at 200% zoom and with larger text settings; the editor adapts to phone, tablet and desktop layouts without requiring landscape.
  • Reduced motion. If your system asks for reduced motion, animations are removed.
  • Touch targets. Primary controls are at least 44 pixels where practical.

How it has been checked

Before launch we checked keyboard-only workflows (adding names, placing and swapping people, editing rules, saving and exporting), focus order and restoration after dialogs, accessible names on controls and seats, layouts at 360, 390, 768, 1024 and 1440 pixels wide and at 200% zoom, and color contrast of core text and controls. These checks were made in desktop browsers and in emulated phone and tablet sizes.

Known limitations

  • The visual room plan is a drawing; the seat list is the most efficient way to work with a screen reader.
  • Testing with a full range of screen readers (NVDA, JAWS, VoiceOver, TalkBack) on real devices is ongoing; please tell us about problems.
  • Printed charts depend on your printer and paper; use the lists for the largest, clearest text.
  • Optional page translation is provided by Google Translate and may not be fully accessible.

Feedback

If something is hard to use, please contact us with what you were trying to do and the browser and assistive technology you use. We treat accessibility problems as bugs.