Accessibility audit and fix of a public-service web form to WCAG 2.2

Riverside Council lets residents report a housing repair through an online form. A blind resident complained that she could not submit it with a screen reader, and an audit by a charity found the form fails several WCAG 2.2 checks: fields with no labels, errors shown only in red with no text, a date picker that traps the keyboard, and contrast too low to read. In the UK, public-sector sites are legally required to meet WCAG 2.2 AA, so this is not optional for the council.

About 4,000 residents use the form a month, and roughly 1 in 5 people has a disability of some kind, so the failures lock out a large group from a basic service. The council wants the form fixed and wants evidence it is now usable, not just a claim.

You will get a deliberately broken version of the form as a starter, matching the problems the audit found. Your job is to audit it properly, rebuild it in React so it meets WCAG 2.2 AA, and prove the fix. Proof means an automated accessibility check with no violations on the key rules, a keyboard-only walk-through that completes the form, and a screen-reader walk-through with notes. You will also write the audit up the way an accessibility specialist would, mapping each problem to the specific WCAG success criterion it fails. Done looks like a form a keyboard-only user and a screen-reader user can both complete start to finish, a before-and-after audit against named criteria, and contrast and focus that pass their checks. The council signs off when every issue in the original audit is closed and evidenced.