Исследование ux-проблем на сайте Chipotle
Джейсон Григсби — автор книги Progressive Web Apps (A List Apart) — попробовал заказать еду на сайте, но с первой попытки у него это не получилось. Он разобрался в причинах и написал про результаты своего небольшого исследования статью "An HTML attribute potentially worth $4.4M to Chipotle".
На сайте было сломано автодополнение данных кредитных карт. Данные карты были сохранены в браузер правильно, но при их вводе в форму с помощью автодополнения что-то шло не так. Причина оказалась в Angular-модуле ui-mask, он неправильно отсекал год истечения срока действия карты. Автор попробовал использовать вместо кастомной маски стандартные HTML5 средства валидации формы pattern="\d\d"
и maxlength="2"
. Проблема с автодополнением года была решена.
Проводились исследования, которые показывают, что автодополнение ускоряет заполнение форм на 30%. Скорость заполнения форм в свою очередь влияет на конверсию в заказ. Джейсон провёл грубые расчёты, которые показали, что сайт Chipotle теряет более 4 миллионов долларов в год из-за проблем с автодополнением.
Рекомендации из статьи: если у вас e-commerce сайт, убедитесь, что автодополнение данных кредитных карт работает, добавьте кейс проверки автодополнения в тест-план, используйте корректные поля ввода в формах.
https://cloudfour.com/thinks/an-html-attribute-potentially-worth-4-4m-to-chipotle/