У большинства пользователей заполнение веб-форм — как и любое скучное формальное действие — вызывает раздражение.
Несмотря на негативный пользовательский опыт, владельцы сайтов оставляют старую концепцию форм, не пытаясь улучшить впечатления.
Практические советы по разработке веб-форм
Вы, как ответственный владелец или веб-разработчик, наверняка желаете, чтобы дизайн ваших форм не вызывал отторжения и получал хорошие отзывы пользователей. Это помогает бизнесу достичь долгосрочных результатов взаимодействия.
Вот несколько проверенных временем советов по созданию веб-форм, которые сделают работу проще, быстрее и эффективнее:
Найдите подходящее название
Многие относятся к названию безответственно, фокусируясь на оформлении и программной части.
По мнению западных маркетологов, это главная ошибка. Ведь успех общения с пользователем закладывается в первые секунды, когда он только увидел заголовок. Либо понравилось, либо нет.
Название или заголовок выражает цель заполнения формы. Вы поясняете нетерпеливому, вечно спешащему человеку, ради какой такой надобности ему придется потратить минуту жизни. Соответственно, неправильный заголовок закладывает высокие отказы.
Продумайте опциональные и обязательные поля
В каждой веб-форме некоторые поля действительно нужны, в то время как другие делаются «для галочки». Постарайтесь правильно расставить приоритеты, и не вынуждать пользователя тратить время на опциональные поля. Это тоже позитивный опыт.
Исследования говорят нам, что процент заполненных форм растет линейно по мере перевода каждого лишнего поля в опциональные. Воспользуйтесь этим простым советом, и предоставьте клиенту возможность решать, какими данными он хочет делиться.
Оптимизируйте веб-формы для мобильных
Как показывает опыт, некоторые веб-сайты продолжают игнорировать требования мобильных пользователей. Это смертельная ошибка.
Мы уже говорили, что половина поисковых запросов делается с мобильных устройств, а каждый четвертый доллар в e-commerce тратят со смартфонов. Что может быть проще, чем разработать mobile-friendly форму для клиентов, которые несут вам деньги!
Разбивайте сложные формы на несколько страниц
Иногда приходится собирать много информации о пользователе, раздувая веб-форму до объемов буклета. Чтобы окончательно не убить конверсии, советуем разбивать такие шедевры на несколько страниц.
Собирая данные, всегда держите перед глазами образ посетителя: как он отреагирует на анкету? Люди ненавидят длинные формы. Длина ее должна проверяться путем А/В тестирования, но в целом не рекомендуется делать более 3-4 полей в окне.
Информируйте о статусе заполнения
Что может быть хуже, чем после заполнения узнать, что где-то в начале была допущена ошибка? Да, хуже только просьба ввести сведения по второму кругу. Вот почему при многостраничном формате необходимо информировать о статусе заполнения.
Пользователь должен четко видеть две вещи:
• правильно ли заполнены предыдущие поля
• сколько полей ему осталось заполнить
Это простое правило сведет к минимуму процент отказов во время checkout-процесса и не повлияет на полноту сбора данных.
Используйте автообновление формы
Нередко возникают ситуации, когда пользователь путает кнопки — особенно при заполнении с мобильных устройств. На такой случай стоит предусмотреть функцию автообновления формы и помочь клиентам.
Печатайте меньше, делайте больше
Широко известный в узких кругах девиз применим к веб-формам. Помогите посетителю быстрее заполнить поля, предлагая готовые варианты, выпадающие списки и прочую автоматизацию.
Разрабатывайте интерактивные веб-формы
Интерактивные поля, которые учитывают введенную ранее информацию, здорово облегчают жизнь и сводят к минимуму количество отказов. Вы могли видеть такие поля на международных веб-сайтах, где после выбора страны появляется выпадающий список регионов.
Проверяйте правильность заполнения
Заполнение форм – утомительная задача. Если не предусмотреть проверку полей, пользователи будут снова и снова натыкаться на сообщения о допущенной ошибке, нервничать и уходить.
А ведь так просто позаботиться о комфорте дорогих клиентов с помощью плагинов jQuery! Большинство популярных сайтов давно используют встроенную проверку веб-формы.
Установите значения по умолчанию
Скажите честно, на вашем московском интернет-магазине часто авторизуются пользователи из Уганды или Уругвая?
Чем проще chekout-процесс, тем лучше. Почему не установить по умолчанию основную страну, город, телефонный код и тому подобные сведения. Если 90% клиентов — россияне, логично установить Россию страной по умолчанию. Остальные 10% выберут сами.
Правильно расположите поля
Человеческий глаз просматривает веб-страницы в определенном порядке. Имеет смысл разработать веб-форму таким образом, чтобы пользователю было удобно сканировать содержимое — в противном случае человек путается и разражается.
Специалисты советуют располагать важнейшие поля формы сверху вниз, соблюдая выравнивание элементов по правому краю.
Это не только уменьшает расстояние, которое должен перепрыгивать взгляд в процессе заполнения, но и придает форме более аккуратный, строгий вид за счет выравнивания.
Не захламляйте веб-форму
Беспорядочные и забитые ненужной информацией формы — это очередной неприятный поворот посетителя. Нажав на ссылку и увидев там диссертацию, он с большой долей вероятности покинет веб-сайт.
Многие вебматера решают проблему с помощью динамических всплывающих окон. В этом случае, когда пользователь выбирает поле или водит мышкой над объектом, над курсором всплывают полезные инструкции по заполнении формы.
Раскрывайте цели сбора данных
Создание веб-формы преследует конкретную цель.
Поскольку люди очень трепетно относятся к своим персональным данным, указание этой цели позволит укрепить доверие и получить больше доступа к их умам (и кошелькам).
Если сайт запрашивает слишком много информации о человеке и совершенно не поясняет, для чего все это нужно — многие сочтут благоразумным уйти отсюда.
Пояснение причин наиболее уместно при запрашивании номера телефона, адреса электронной почты, номера кредитной карты и др.
Акцентируйте внимание, что вы — этичная компания, и что данные не будут использоваться для злоупотреблений, таких как бомбардировка звонками или рассылка спамных писем по email.
Не ограничивайте имя пользователя
Раньше для авторизации на сайте требовалось вводить уникальный логин (имя пользователя). Удобство работы с веб-сайтами становилось все ниже по мере обрастания пользователей логинами — непросто запомнить имя на всех почтовиках, магазинах и сервисах.
Теперь сайты предпочитают идентифицировать посетителей другими путями, не заставляя их вести секретную тетрадь с псевдонимами, паролями и явками. Способов для этого великое множество.
Например, попросите регистрироваться через адрес электронной почты, который и будет служить идентификатором пользователя. Помимо этого, не забывайте об авторизации через популярные социальные сети — Вконтакте, ОК, Google, Facebook, LinkedIn.
Все, что уменьшает объем формы и ускоряет ее заполнение, положительно влияет на пользовательский опыт и конверсии.
Тестируйте капчу заблаговременно
CAPTCHA доказала свою надежность при отделении человека от роботов. Но порой капчу так усложняют, что она начинает убивать ваши конверсии. Как по мне, выискивать дорожные знаки на капче Google — то еще удовольствие!
Но бывают вещи и похуже. Если капчу приходится заполнять несколько раз, не рассчитывайте на положительные отзывы. Тестирование должно быть основательным и заблаговременным, до запуска формы.
Придумайте четкий призыв к действию
В онлайн-маркетинге призыв к действию (СТА) должен передавать основной месседж каждой кнопки и формы на сайте. Кратко, лаконично и заманчиво распишите, зачем посетителю тратить время на заполнение.
Упорядочите информацию
Для сложных форм информацию стоит разделить по типам. Например, контактные данные, профессиональные данные, платежные данные.
Соблюдая структуру и переход от важных и простых данных к сложным и второстепенным, вы сделаете процесс заполнения гораздо удобнее.
Придерживайтесь единого стиля
Чтобы помочь пользователю, придерживайтесь единого стиля оформления всех полей (разделов). В противном случае человек путается и отвлекается, а заполнение затягивается.
Резюме
Как вы могли понять из наших советов, разработка веб-формы сводится к двум вещам — простоте и удобству для пользователя. Задать вопросы несложно. Важно задать их так, чтобы человеку было приятно.
P.S. Качественные формы — это не панацея, а лишь дополнение к современным веб-технологиям и грамотному онлайн-маркетингу.
