Research improvements to disabled form control styles

[querkmachine]

What

We've shipped an MVP (minimum-viable product) version of disabled form controls in #1713—which aimed to make disabled styles consistent—however we still have some unanswered questions about the suitability of the disabled styles included in Frontend as a whole.

Why

We have historically discouraged the use of disabled form controls and buttons in user-facing scenarios. Although we continue to discourage their use, we have decided to provide them to cover for situations where user research has found their use helpful or where their use can be better justified (such as an internal caseworking system).

As we've not encouraged their use, we also haven't performed much testing or research into whether the disabled styles we use work well for end users.

Assumptions

• Our current disabled styles aren't necessarily adequate in all contexts. For example, a value-less, disabled text input or textarea appears as an empty box, with little other affordance that it is disabled or an input.
• Although WCAG 2.1 (and, currently, 2.2) do not require a minimum contrast ratio for 'inactive' elements, we may want to ensure the visibility of disabled inputs on our own terms.
• Any changes we make to disabled styles should be applicable across all 'core' form control components: Text Input, Textarea, Select, File Upload, Checkbox, and Radios.
  • If possible or useful, we may also want it to apply to the Button component.

Timebox

2 weeks

Who is working on this?

Spike lead:

Spike buddy:

Questions to answer

• Are our current disabled styles well understood by users?
• Are our current disabled styles still perceptable by users with vision impairment?
• Do service teams know when they shouldn't be using disabled inputs?

Done when

• Questions have been answered or we have a clearer idea of how to get to our goal
• Findings have been reviewed and agreed with at least one other person
• Findings have been shared, e.g: via a write-up on the ticket, at a show & tell or team meeting
• Any code changes we want to make have been made
• Any documentation changes we want to make have been made