Large, custom, accessible checkboxes and radio buttons on GOV.UK
Early in the development of GOV.UK we observed in research how a majority of users would click on radio button or checkbox controls rather than on their labels, despite the fact that the labels are much bigger and therefore easier to click (see Fitt’s Law).
[…]
We reasoned that this was because users didn’t know whether or not they could click on the labels. Many websites don’t let you click on labels, so choosing to always click on the control is perfectly rational user behaviour.
[…]
First we thought we’d try to make it really obvious that you could click our labels, so we coloured them grey and made them respond to the mouse hovering over them.
We thought this would work, so we rolled out the design across services on GOV.UK. We saw again and again though in lab research that most users still clicked on the controls.
[…]
In our latest iteration we’ve replaced the native browser controls with custom ones, which all our supported browsers will get.
We’ve also removed the grey background, as it did not have the effect on user behaviour that it was intended to.