В Великобритании есть организация Government Digital Service, развивающая местные госуслуги. У неё есть блог с заметками о дизайне. Недавно они написали, как и почему обновили стиль чекбоксов и радиокнопок в сервисах GOV.UK.
Вот старые чекбоксы и радиокнопки:
В новом варианте убрали серые плашки и увеличены сами контролы:
Исследования ранних версий GOV.UK показали, что большинство пользователей нажимает на сами контролы, а не на текстовые подписи, несмотря на то, что текст крупнее, и в него проще попасть (см. закон Фиттса).
Возможная причина — неуверенность пользователей в том, что нажатие на текстовую подпись приведёт к выбору, например, чекбокса. На многих сайтах нажатие на текст до сих пор ни к чему не приводит. Поэтому всегда нажимать на контрол — это рациональное пользовательское поведение.
Сначала решили подчеркнуть, что нажать можно в том числе и на текстовую подпись. Для этого объединили контрол и подпись серой плашкой и заставили всю группу одновременно реагировать на наведение курсора:
Они были уверены, что это сработает и выкатили дизайн на все сервисы GOV.UK. Но исследования раз за разом показывали, что пользователи продолжают целиться в контролы.
Решили поддержать текущее пользовательское поведение и увеличили размеры контролов, чтобы было проще в них попадать:
Но проблема в том, что не все браузеры умеют корректно увеличивать стандартные контролы.
Не умеют:
Увеличивают, но с пикселизацией или размытием:
В последней версии заменили стандартные контролы кастомными и убрали серую плашку, так как она не оказала ожидаемого влияния на пользовательское поведение:
Новые контролы:
Новые стили были пилотно запущены на нескольких сервисах и очень хорошо себя показали. Исследование показало, что все пользователи нажимают на эти контролы легко и быстро.