10 правил оформления онлайн-заявок
- Все заголовки полей и placeholders должны быть в одном стиле
- Понимание того, какое поле заполняется
- Обязательные поля
- Размер полей
- Возможность заполнение информации в удобном формате
- Уведомление о неправильном заполнении
- Сохранение заполненной информации
- Автоматическая подстановка данных
- Лишние поля снижают конверсию
- Уведомление об отправке
- И бонус! Еще 2 совета от маркетологов
- Живой язык общения
- Автосохранение данных
Вам остается только прочитать их, проверить у себя и увеличить число своих заказов!
Все заголовки полей и placeholders должны быть в одном стиле
Шрифт, размер шрифта и цвет текста у всех заголовков должны быть одинаковыми. Недопустимо использование в формах заявки различного сочетания заглавных и строчных букв для одного типа заголовков. То же самое касается и плейсхолдеров.
Понимание того, какое поле заполняется
При выборе поля пользователь должен понимать, в какую форму заявки он вносит данные. Для этого плейсхолдер должен пропадать, в поле появляться курсор, а поле слегка выделяться.
Обязательные поля
Если все поля обязательны к заполнению, то звездочки ставить не нужно. Если не все поля обязательные, то к звездочке нужна приписка: «обязательные поля».
Размер полей
Поля, где предполагается много текста, не должны быть фиксированного размера, иначе пользователь не сможет ввести или увидеть полностью свое сообщение. Правильнее использовать скролл или давать возможность растянуть поле.
Возможность заполнение информации в удобном формате
Пользователь должен иметь возможность ввести данные в любом удобном ему формате или иметь четкое понимание, в каком формате их необходимо вводить.
Уведомление о неправильном заполнении
Уведомление о некорректном заполнении полей должно иметь подсказку о том, почему данное поле заполнено неправильно. Сама подсказка должна располагаться возле этого поля, а не в другой части онлайн-формы.
Сохранение заполненной информации
При нажатии на кнопку «отправить» или переводе курсора в другое поле все заполненные данные должны сохраняться, даже если заполнены некорректно - чтобы пользователю не пришлось вводить их заново. Достаточно указать на некорректное заполнение конкретных полей. Автоматическая подстановка данных
Автоматическая подстановка данных
Не заставляйте зарегистрированных пользователей заполнять те данные, которые вы о них и так знаете. Если пользователь захочет поправить какую-то информацию, он это легко сделает в представленных полях, а все остальные сразу будут на несколько шагов ближе к отправке данных.
Лишние поля снижают конверсию
Проверьте, нет ли в ваших формах полей, от которых можно было бы безболезненно отказаться. Процент людей, заполнивших заявку до конца, от этого возрастет.
Уведомление об отправке
Обязательно уведомляйте пользователя (лучше в отдельном окне), о том, что его заявка успешно отправлена и формируйте его ожидания по дальнейшему взаимодействию с вами.
И бонус! Еще 2 совета от маркетологов
Данные советы стоит применять не всегда и везде, а по ситуации.
Живой язык общения
Если применимо, то лучше сделать форму в менее официальном стиле, например, в виде полноценного предложения. Естественный язык более понятен и дружелюбен. За счет своей дружелюбности форма заказа будет иметь более высокую конверсию.
Автосохранение данных
При реализации больших и сложных форм подумайте о пользователе и сделайте автосохранение введенных для покупки данных. При этом не стоит просить его делать это самостоятельно, достаточно лишь уведомлять о том, что данные сохранены и не потеряются, если он отвлечется от заполнения.
Казалось бы эти 10 правил — очень просты и понятны. Но, увы, у большинства сайтов, встречаются именно эти ошибки в оформлении и работе online-форм отправки сообщений. Соблюдение этих правил поможет «залатать основные дыры» в этом месте воронки продаж и улучшить конверсию!
Проверьте свои формы заявок на предмет нахождения описанных выше ошибок заказав usability-аудит интернет-магазина. Кто считает, что у них все отлично с онлайн-заявками, кидайте в комментарии url страниц с заявками в качестве примера. По нашей практике таких форм не очень много.
Услуги, которые будут вам интересны
А также поделитесь статьей с друзьями в соцсетях.