Каждый пользователь почти ежедневно сталкивается с необходимостью заполнения форм на всевозможных сайтах, начиная от формы подписки на рассылку и заканчивая формой заказа товара в интернет-магазине. В большинстве случаев этот процесс вызывает у человека множество неудобств, из-за чего владельцы сайтов теряют огромное количество своих потенциальных подписчиков и клиентов.
Чтобы не вызывать у пользователя неудобств и сделать процесс заполнения любой формы простым и удобным, нужно просто соблюдать ряд определенных правил. И вот я как раз и поделюсь с вами 18-ю правилами, соблюдение которых сделает любую форму на вашем сайте удобной и понятной для пользователя, что позволит гораздо легче конвертировать посетителя сайта в постоянного подписчика и/или клиента.
Почему именно 18? Просто потому что я особенный, да
Правило №1: Используйте только необходимый минимум полей
Ничто так не отворачивает пользователя от заполнения формы, как обилие полей, даже если не все из них заполнять обязательно. Поэтому включайте в форму только те поля, которые действительно необходимы. Скажем, зачем для подписки на рассылку пользователю указывать свою фамилию, телефон или адрес, когда достаточно только электронной почты и имени? Иногда даже имя - это лишнее.
Правило №2: Форма должна быть в виде одной колонки
Это просто удобнее, когда каждое последующее поле находится ниже предыдущего. Такую форму всегда заполнить проще, ничего при этом не забыв. К тому же на мобильных версиях сайтов такие формы располагаются органичней, и не возникает необходимости в горизонтальной прокрутке при их заполнении.
Правило №3: Объемную форму следует разбивать на несколько небольших
Если всё же необходимость в форме с большим количеством полей возникнет (например, при оформлении заказа в интернет-магазине), то такую форму лучше разбить на несколько форм поменьше. При этом каждой форме следует отвести отдельный шаг.
Например, сперва заполняются личные данные пользователя, на следующей странице выбирается способ доставки, а на третьей — указывается почтовый адрес.
Правило №4: Нет четких требований к заполнению полей
Очень неудобно, когда форма требует вводить данные каким-то особым образом, скажем, вводить номер телефона обязательно с «+7», а не с «8» или вводить номер карты только по 4 цифры с пробелами. Лучше давать пользователю больше свободы, если есть такая возможность. Если он хочет указать свой номер как 81234567890, то пусть указывает его так, а не как +7 123 456-78-90.
Правило №5: Автоматически разместите курсор в первом поле
Этим вы освободите пользователя от совершения лишних действий.
Правило №6: Название поля должно быть слева или сверху от него
Так устроено человеческое восприятие, что ему нужно сначала сообщить, что за поле перед ним, и только после размещать само поле. Поэтому располагайте названия полей сверху или слева от них, а не снизу или, что еще хуже, — справа. Неплохая альтернатива — вписывать название поля внутри него (естественно название пропадает при заполнении).
Правило №7: Все поля, обязательные к заполнению, необходимо выделять
Традиционно названия полей, обязательных к заполнению, отмечаются красной звездочкой *. Рекомендуется так и поступать, потому что это будет понятно большинству пользователей.
Правило №8: При заполнении формы пользователь должен видеть, в каком поле он находится сейчас
Это правило учитывается весьма нечасто, но его соблюдение сделает процесс заполнения любой формы ощутимо удобнее. Поэтому выделяйте то поле, которое пользователь заполняет в данный момент. Выделять поле можно подсвечиванием фона или рамки вокруг него.
Правило №9: Лучше обойтись без капчи
Очень часто именно на капче теряют своих пользователей владельцы сайтов. И ведь действительно капча зачастую может быть настолько неразборчивой, что ввести ее корректно не удается даже после нескольких отчаянных попыток (привет капче от Яндекса)!
Обычно среднестатистический пользователь не будет мучиться и уже на 2-3 неудачной попытке справиться с ней покинет ваш сайт навсегда. Поэтому лучше не утруждать пользователя введением капчи и полностью отключить ее. В конце концов, ему ведь нет дела до того, что вас донимают спам-боты. Если уж вам действительно капча чрезвычайно нужна, то сделайте ее хотя бы максимально простой и разборчивой.
Хорошая альтернатива - reCAPTCHA Google “Я не робот” - минимум действий от пользователя, эффект защиты от спама тот же.
Правило №10: Не требуйте повторного ввода пароля
Вряд ли вы встретите такого веб-мастера, который будет совершенно точно знать ответ на вопрос: «Зачем при заполнении формы вводить один и тот же пароль два раза?». Конечно, ответ будет, скорее всего: «Чтобы не ошибиться». И действительно, это так. В 99 % случаев при вводе пароля вместо символов пользователь видит лишь звездочки *******, поэтому не может быть уверен на 100 %, что ввел пароль корректно.
Гораздо рациональнее просто дать пользователю возможность убрать эти звездочки нажатием кнопки рядом и открыть пароль, чтобы убедиться, что он ввел его верно.
Правило №11: Сразу пишите все необходимые подсказки
Чтобы пользователю было проще заполнить форму, особенно если у вас к ее заполнению есть определенные требования, сразу же указывайте эти требования и пишите все необходимые подсказки, которые могут пользователю помочь.
Допустим, если вы требуете ввода пароля не менее чем из шести символов, то так сразу и напишите возле поля «Пароль» (или внутри самого поля). Или, если вы требуете, скажем, ввода телефонного номера в определенном формате, то укажет конкретно, в каком формате следует его вводить, например, «Телефон (в формате +375 (__) ___-__-__)».
Правило №12: Проверка корректности заполнения полей должна осуществляться автоматически
Ни одному пользователю не понравится, если после заполнения формы (особенно объемной) и нажатия кнопки «Отправить» ему высветится сообщение о том, что где-то что-то было им заполнено неверно. Поэтому, если вы уж и предъявляете определенные требования к заполнению формы, то пусть форма отслеживает все ошибки пользователя автоматически уже во время ввода им данных.
При этом нет ничего хуже, чем просто какое-то непонятное сообщение типа «Введенные данные не соответствуют формату». Если пользователь вводит свои данные, и они действительно не соответствуют формату, то в сообщении об ошибке нужно четко и конкретно указывать, чем именно данные не соответствуют и как должно быть.
Правило №13: Данные, введенные пользователем в форму, должны сохраняться даже в случае перезагрузки страницы
Думаю, у каждого пользователя хотя бы раз в жизни случалась ситуация, когда он заполнял длинную форму, а потом происходил какой-то сбой, при котором страницу приходилось обновлять и все введенные им данные были безвозвратно утеряны. Почти никто после этого не станет заполнять форму повторно.
Поэтому следует взять за правило, что всё, что вводит в форму пользователь, должно в ней сохраняться и оставаться, даже если он покинет сайт и вернется к форме через две недели. Благо, современные технологии позволяют делать это без проблем.
Правило №14: Не используйте кнопку «Очистить форму»
Да, потому что пользователь может случайно ее нажать. Если он захочет изменить введенные данные, то сделает это сам и выборочно, исправив только то, что необходимо. На практике не бывает таких случаев, когда нужно было бы очистить всю форму целиком, поэтому никакой пользы от этой кнопки нет и быть не может.
Правило №15: Используйте большую, заметную кнопку отправки
Особенно это будет удобно пользователям мобильных устройств, потому как нажимать пальцем на экране маленькую, еле заметную кнопку никому не будет приятно… только если это не какой-то редкий фетиш.
Правило №16: Не используйте кнопку с надписью: «Отправить»
Гораздо лучше использовать кнопку с более конкретным названием. Например, если заполняется форма подписки на рассылку, то так и напишите на кнопке «Подписаться на рассылку» или же просто «Подписаться». Если это форма заявки на обратный звонок или запись на обучение, то так и пишите: «Отправить заявку», «Записаться на занятие».
Правило №17: Сообщите пользователю об успешной отправке данных
После нажатия кнопки отправки данных, пользователю обязательно должно высвечиваться сообщение о том, что его данные были успешно отправлены. Здесь, как и в предыдущем пункте, следует сообщать пользователю конкретнее, например: «Спасибо, ваша заявка принята» или «Благодарим за вашу заявку на индивидуальное обучение».
Правило №18: Сообщите пользователю, что делать дальше
Ну и в завершении еще одно очень важное правило, которое дополняет собой предыдущее: сообщите пользователю не только о том, что вы приняли от него данные, но и о том, что ему делать дальше.
Вот заполнил пользователь форму, отправил свои данные, высветилось ему сообщение, скажем, «Спасибо, ваша заявка на обучение успешно принята». И что? Что ему делать дальше? Ему кто-то позвонит, придет сообщение на почту или что? Так вот чтобы у человека не возникало таких вопросов, после заполнения формы ему всегда надлежит конкретно указать, что делать дальше.
Правильное сообщение после успешного заполнения формы будет выглядеть так: «Спасибо, ваша заявка на обучение успешно отправлена. В течение часа с вами свяжется менеджер по указанному номеру телефона для согласования времени занятий». Всё, теперь пользователю всё понятно — ему остается ждать звонка от менеджера в течение часа.
Ну что же, а на это на сегодня все, друзья. Подписывайтесь на нашу рассылку, чтобы не пропустить интересные статьи от меня и моих не менее талантливых коллег =) всем удачи!
P.S.: А какие формы бесят вас? Пишите в комментариях - будем “гореть” вместе.