Правила юзабилити

Тестирование форм авторизации

Почитать позже
Поможем вашему бизнесу оптимизировать расходы на маркетинг и увеличить прибыль!

Зачем проверять формы

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

Причины проведения тестирования:

  • Стабильность приложения: ошибки в полях могут стать причиной багов. В некоторых случаях сервис перестает работать — обычно такое происходит на ранних стадиях после запуска.
  • Безопасность: если не прописать требования к данным, через формы можно проникнуть в базу и украсть информацию о пользователях. Вредоносные скрипты можно отправить не только с помощью функции загрузки файла, но и через текстовые поля.
  • Порядок в базе данных: правила ввода с ограничением символов для логинов и паролей помогают избежать засорения БД некорректной информацией и ошибок при обработке.
  • Юзабилити пользовательского интерфейса: помимо технических характеристик нужно учитывать удобство формы для клиентов. Если полей слишком много или при регистрации появляются ошибки, вы можете потерять часть аудитории.

Чек-лист для тестирования

чек-лист для тестирования форм.jpg

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

Технические требования

  • В коде прописан тип данных, которые можно ввести в поле: числа, буквы, специальные символы или их комбинации.
  • Ограничения: допустимая длина (верхние и нижние лимиты), пробелы, скрытые символы — все это нужно прописывать в скриптах.
  • Учет регистра: в пароле заглавные и строчные буквы отличаются в большинстве случаев, а для логина возможны разные опции.
  • Ограничение количества попыток: сколько раз можно ввести информацию с ошибками перед блокировкой. Это нужно для защиты от программ подбора.
  • Соответствие логина и пароля: проверьте, чтобы на этом этапе не было багов, поскольку персональные данные должны быть под защитой. В процессе тестирований нужно попробовать ввести сначала неправильный логин с правильным паролем, затем наоборот. Также стоит проверить отправку формы с пустыми полями.
  • Двухфакторная аутентификация: если компания хранит личную информацию, стоит добавить эту опцию.
  • Деактивация кнопки входа до полной загрузки: это позволяет избежать повторной отправки данных и дополнительной нагрузки на сервер.
  • Двойной ввод пароля при регистрации: это помогает сократить количество ошибок в будущем и снизить нагрузку со службы поддержки.
  • Проверка на разные типы инъекций — HTML, SQL, XSS: дополнительные фильтры помогают повысить уровень защиты.

Юзабилити

юзабилити форм.jpg

  • Форму регистрации легко найти на страницах сайта. Это конверсионный элемент, поэтому он должен быть заметным, но при этом содержать небольшое число полей, критически необходимых для бизнес-задач.
  • В окне авторизации должна быть ссылка или кнопка на восстановление или смену пароля.
  • С точки зрения удобства UI, чек бокс «запомнить меня» — хорошая практика, которая упрощает взаимодействие пользователя с сайтом. Однако она ухудшает безопасность, поэтому ее используют не все разработчики.
  • Для опции «скрыть/показать пароль» нужно использовать привычную иконку с глазом.
  • При нажатии кнопки «назад» после авторизации приложение не должно разлогинивать пользователя.
  • Если данные вводятся неверно, нужно показать пользователю уведомление с причиной. При тестировании проверьте, чтобы сообщение соответствовало виду ошибки.
  • Обязательные поля стоит выделять с помощью звездочки. Пока все они не заполнены, кнопка отправки не должна быть активной.
  • При наведении на элемент формы должно меняться отображение курсора, а при клике — цвет рамки поля ввода.
  • После отправки пользователю нужно показать, что регистрация прошла успешно. Для этого должно быть создано окошко или страница «Спасибо».

3 принципа тестирования, которые помогут избежать ошибок

поиск ошибок в формах.jpg

Чтобы правильно организовать процесс тестирования, используйте три принципа:

Пограничные значения

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

  • рандомных значений;
  • минимума;
  • максимума.

Эквивалентность

На втором этапе проверки формы, помимо крайних значений, требуется тестировать те, которые выходят за рамки. Например, если при заполнении допускаются числа от 1 до 100, то у поля будет три класса эквивалентности: до 1, от 1 до 100, более 100.

Валидация

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

Как тестировать формы?

как тестировать формы.jpg

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

Есть и готовые плагины для тестирования — к примеру, BugMagnet. Он устанавливается как расширение в браузерах. Кликнув правой кнопкой мыши по полю, вы увидите выпадающий список с нарушениями общих принципов создания форм:

  • Ошибки при заполнении полей разных форматов: даты, e-mail, индексы, платежная информация и т.д.
  • Проблемы с размерами шрифтов или лишними пробелами.
  • Неправильные ограничители, например, когда не все «крайности» учтены при написании кода.

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

Резюме

Каждый проект перед запуском требует проверки, вне зависимости от опыта команды разработчиков. Упомянутые принципы тестирования форм помогают найти неочевидные технические ошибки. Если валидировать каждое действие пользователя, устраивать crush-тесты системе на пограничных показателях и моделировать разные типы поведения, вы сможете минимизировать недочеты после выгрузки.

Не ограничивайтесь техническими критериями и критериями автоматизации: взгляд на продукт глазами аудитории помогает найти неочевидные пробелы. Чтобы не пропустить важные компоненты при ручной проверке, используйте чек-листы.

Закажи юзабилити-тестирование прямо сейчас
Заказать услугу
Читать также

Готовы узнать, что думают пользователи?

Тогда переходите на новый уровень и улучшайте ваш
продукт вместе с нами

Узнать