HTML-first rebuild doubled a utility's form completions overnight

A contractor for a UK regulated utility inherited a failed React signup form — pulled after three days of customer complaints — that stored image uploads in localStorage, lacked accessibility, and buried users in loading spinners. With customer-satisfaction penalties potentially costing millions in fines, the developer rebuilt the application flow in Astro as an HTML-first, multi-page form wizard: each step was a plain form submission with server-side persistence keyed to a session ID, so data (including uploads) was never lost and the entire process worked without JavaScript, on poor connections, and on outdated browsers.

Progressive enhancement came via lightweight web components rather than client-side frameworks. A sub-1KB custom element wrapped native HTML form validation, surfacing errors accessibly through aria-describedby while falling back to built-in browser validation and finally backend validation if scripts failed. The author has since released a general-purpose version of this component, validation-enhancer, calling it the best form validation tool of a 20-year career.

The payoff: form completions doubled at launch, with analytics teams unable to explain the influx — because JavaScript-based analytics never saw the users previously being bounced by JavaScript failures. One user resumed and finished a form a month after starting it, validating the server-side session approach. The author’s broader argument is that public services must work for everyone — old devices, bad networks, assistive tech — and that building to that baseline (the ‘works on a PSP over 3G’ test) produces software that serves all users and endures for decades.