Сообщения об ошибках — как повысить эффективность лид-форм

сообщения об ошибках
Статьи
Автор: Юлия Федотова
«Шеф-редактор блога GetGoodRank, веб-аналитик, блоггер.
Мы воспринимаем сообщения об ошибках как технический элемент сценария взаимодействия. А ведь именно от того, как составлены сообщения, зависит успех пользователя на сайте. Рассказываем о типичных ошибках, альтернативах и приводим рекомендации по работе над ошибками пользователей»

Baymard Institute провел исследование, как сайты сообщают пользователям об ошибках в заполнении полей форм. Только 9% компаний используют адаптивные сообщения об ошибках. Остальные 91% сайтов выдает стандартные сообщения.

Ошибки заполнения формы неизбежны. Полностью исключить ошибки не удастся никогда. Пользователь вводит данные в различных форматах, использует недопустимые символы, банально допускает опечатки (особенно при регистрации с мобильных устройств). Ошибки часто становятся непреодолимой преградой на пути к завершению регистрации/оформления заказа. И если сайт не помогает решить проблему, пользователь уходит. Как правило, к конкурентам.

В этом обзоре мы рассмотрим, как формулировка сообщений об ошибках в заполнении лид-формы влияет на пользовательский опыт, и как адаптивные сообщения об ошибках помогают пользователям быстрее справиться с задачей.

анализ сайта15 ошибок лид-форм, убивающих конверсию

Пользователи чаще допускают ошибки, вводя номер телефона (через пробел, дефис, сплошным рядом цифр, код региона в скобках), регион, дату (цифры, цифры и слова, порядок указания — год, месяц, число или число, месяц, год), суммы (какой разделитель использовать, если сумма с копейками, нужен ли разделитель между тысячами и сотнями), номер кредитной карты (допускаются ли пробелы или нет), адреса.

Универсальные сообщения об ошибках

Анализ оформления и оплаты заказов на 100 сайтах показал, что большинство сообщений об ошибках заполнения формы шаблонны и непонятны пользователю. Стандартные сообщения никак не помогает пользователю понять, где допущена ошибка и как ее исправить. Универсальные сообщения об ошибках варьируются от просто бесполезных до сбивающих пользователя с толку.

Большинство сообщений об ошибке оставит пользователя в неведении, что неправильно. Так, эксперимент на сайте ИМ показывает, что вне зависимости от того, какую ошибку допускает пользователь в электронном адресе, сообщения об ошибках от этого не изменяются:

Стандартные сообщения об ошибках

Исправляем:

Стандартные сообщения об ошибках

Такое сообщение никак не помогает пользователю понять, в чем ошибка и как ее исправить. Оно лишь указывает, что введенные данные расцениваются сайтом как ошибка. Это становится весомой причиной отказаться от дальнейшего заполнения формы.

Стандартные сообщения об ошибках

В ходе анализа мобильных сайтов участник тестирования сначала ввел номер телефона с пробелами, на что сайт выдал стандартное сообщение об ошибке.

Затем пользователь добавил код страны в международном формате, а сообщение о неверном формате номера телефона осталось прежним.

При редактировании номера телефона пользователь случайно удалил одну цифру, но сайт опять таки выдал одно и то же сообщение. Комментарий пользователя: сайт скорее всего не работает, я отказался от покупки.

Самостоятельный поиск ошибок утомителен для пользователей. Пользовательское тестирование показало, что при заполнении формы участники большую часть времени тратили на поиск и исправление ошибок, особенно, если сообщение указывает на поле, в котором допущена ошибка, но не называет ее.

Если пользователь не понимает, где допущена ошибка, он может пойти двумя путями:

  • определить опечатку методом проб и ошибок — на что потребуются силы и время
  • покинуть сайт и уйти к конкурентам — без лишних усилий

Адаптивные сообщения об ошибках

Оптимальным решением проблемы становятся адаптивные сообщения об ошибках. Это сообщения, которые формулируются исходят из того, какая ошибка допущена, чтобы помочь клиенту быстрее пройти регистрацию и завершить покупку. Иными словами адаптивные сообщения об ошибках моментально подстраиваются под ситуацию пользователя.

Рассмотрим пример. Пользователь вводит адрес электронной почты «snezhcka@gmail», тогда адаптивное сообщение прозвучит следующим образом:

Вы не указали домен высшего уровня, такой как .com, .ru, .net

Текст не лучший. Не каждый пользователь знает, что такое домен высшего уровня, но вторая часть сообщения дает четкое понимание пользователю, на какую часть адреса обратить внимание, чтобы быстро исправить ошибку.

Возвращаясь к ошибке с номером телефона, адаптивное сообщение могло бы звучать следующим образом:

Пожалуйста, укажите номер телефона без кода страны. Не используйте пробелы, скобки, дефисы и другие разделители.

Указывая пользователю, какая именно ошибка допущена, вы автоматически ускоряете заполнение формы и снижаете риски отказа. Тестирование Baymard доказало, что пользователи быстрее и легче справляются с формой с адаптивными сообщениями об ошибках.

адаптивные сообщения об ошибках

Пример на изображении показывает, как работают адаптивные сообщения об ошибках. Вместо того, чтобы просто подсветить поле с паролем с сообщением «неправильный пароль», сайт указывает, какое именно правило создания пароля нарушено «Email не может использоваться в качестве пароля».

адаптивные сообщения об ошибках

Пользователь оставляет те из обязательных полей незаполненным, которые запрашивают слишком личную информацию, которой бы он не хотел делиться с незнакомым сайтом. В таком случае адаптивное сообщение об ошибке должно объяснять, как будет использоваться запрашиваемая в данном поле информация.

Часто пользователи допускают ошибку при введении данных кредитной карты. Вместо того, чтобы просто подсвечивать необходимое поле, сообщите, что не так. К примеру, если пользователь ввел недопустимую дату, неправильный CVV код (превышение допустимого количества символов в коде), ошибочный номер карты (превышение количества символов в номере или недостаточное количество цифр номера карты).

адаптивные сообщения об ошибках

Вы ввели дату, которая уже прошла. Пожалуйста, укажите заново все данные карты: номер, дату окончания действия карты и код безопасности.

Адаптивные сообщения об ошибках: есть ли альтернативы?

Многие сайты пренебрегают адаптивными сообщениями об ошибках в форме в силу сложности реализации. Но если система валидации способна распознать ошибку и не принять введенные данные, значит возможно создать формулировку под каждый тип ошибки, чтобы максимально облегчить пользователю задачу.

Особенно актуальной проблема заполнения форм становится на мобильных устройствах. Размер экрана, неуклюжие движения на ходу, размер элементов на экране — факторы, которые повышают риск ошибки. Адаптивные сообщения об ошибках помогут пользователю легче заполнить форму, без которой заказ невозможен.

Какие есть альтернативы:

  • распознание и прием всех возможных форматов ввода данных, а затем применение алгоритмов стандартизации данных (приведения данных к единому формату)
  • четкое объяснение, в каком формате данные должны быть введены в поле
  • встроенная валидация — проверка данных в момент введения.

Ни один из этих методов не исключает ошибок, допускаемых пользователями каждый раз при заполнении форм. Люк Вроблевкски (Luke Wroblewski), юзабилити-эксперт, автор книг Mobile First и Web Form Design, провел исследование встроенной валидации в сравнении с обычным методом проверки. Результаты исследований показали:

  • количество успешно заполненных форм возросло на 22%
  • количество допущенных ошибок уменьшилось на 22%
  • оценочный коэффициент удовлетворенности увеличился на 31%
  • время заполнения формы сократилось на 42%
  • количество зрительных фиксаций сократилось на 47%

Якоб Нильсен, юзабилити эксперт, разработал рекомендации, каким должно быть сообщение об ошибке:

Написанное для людей — сайт должен общаться с пользователем понятным человеку языком, а не шаблонами системных сообщений.

Вежливое — большинство сообщений безличны. Не стоит забывать, что взаимодействие пользователя с сайтом — это прежде всего диалог, а не монолог. Пусть это общение станет полезным и приятным. Добавьте в сообщение человечности и вежливости. Вместо «неправильный пароль» укажите:

«Вы использовали один из недопустимых символов в пароле «!;№%:?*()@#$&. Попробуйте еще раз. Мы в Вас верим!»

Такое игривое сообщение разрядит напряженность, настроит клиента на позитивный лад. Такой формат выделит вас на фоне конкурентов, продолжающих общаться с клиентами языком шаблонов.

Точное — четко указывайте, в чем заключается ошибка. Не все пользователи поймут, какие символы недопустимы в паролях, именах, фамилиях, кредитных картах. В сообщении укажите, какие символы нельзя использовать для заполнения поля.

Советы по исправлению — вместо того, чтобы указывать только на ошибку, объясните пользователю, как ее исправить. Сравним:

Неверный формат ввода телефона

ИЛИ

Вы ввели номер телефона в неверном формате. Не используйте пробелы. Укажите номер без дефисов/скобок/пробелов.

Рекомендации GetGoodRank по повышению эффективности лид-форм:

анализ сайтаразрешите введение данных в разных форматах — пусть пользователь имеет возможность вводить номер телефона в привычном формате. Вы сможете легко привести данные к единому формату при помощи автоматических сервисов.

анализ сайтаопишите, что должно быть указано в поле, в каком формате — меня сбивает с толку сообщение: введите номер телефона, всего 10 цифр. Я не знаю, сколько цифр в моем номере, вот честно. Ввожу на автомате, начиная с кода страны. Но вот если такое сообщение предполагает, что код страны не требуется, а система воспримет код 38 в качестве первых цифр номера, то в базу данных попадет непригодный номер. Связаться со мной будет невозможно.

анализ сайтаиспользуйте встроенную валидацию — это поможет пользователю исправлять ошибки на ходу, лучше понимать, что от него требуется.

По материалам Baymard

Добавить комментарий

Войти с помощью: 

Статьи по теме

smm-маркетинг
Статьи
SMM-маркетинг: как повысить эффективность
SMM-маркетинг работает на привлечение целевой аудитории, конверсию лидов в постоянных к...
Google phantom
Статьи
Алгоритм Google Phantom 4: что нового?
Зарубежные вебмастера отметили, что Google обновил неофициальный алгоритм контроля каче...