Формы на сайте - виды и юзабилити
Feedback или обратная связь важны для любого веб-ресурса. Будь-то бизнес-проект, новостной сайт или стандартный информационный портал. Обеспечивают связь компании или организации с пользователями – специальные формы. Но не все из них удобны юзеру. А неправильно созданные или непродуманные вообще могут отпугнуть потенциальных клиентов. Кто захочет иметь дело с интернет-магазином, в котором не понятно как оформлять заказ или нет формы обратного звонка, к примеру. И уж точно многие старательно избегают сайтов, где постоянно всплывают окна, зазывающие немедленно перейти в корзину и совершить покупку, или тотчас зарегистрироваться.
Содержание:
- Какие существуют формы
- О регистрационном бланке в деталях
- Бланки авторизации и подписки на рассылку
- Две разных формы – для заказа сервиса и заказа товара
- Звонок – форма взаимодействия с пользователями
- Консультирование и онлайн-консультации
- Как улучшить юзабилити сайта
- Дополнительные советы для эффективности usability
- «Капчи» и что с этим делать
- Сохранение и сброс данных
Какие существуют формы
Формы взаимодействия с веб-сайтом бывают самые разные. И лучше, чтобы на портале присутствовали все, необходимые для обратной связи с клиентами и заказчиками, их виды. Среди особенно важных выделяют:
- форма авторизации на сайте позволяет при минимуме затрат времени и терпения зайти на выбранный веб-ресурс;
- регистрационная форма – нужна для новичков, поэтому не стоит их запутывать, помещая ее рядом с авторизацией;
- форма заказа нужного товара отличается от такого вида, как заказ услуг (для них нужны отдельные);
- заказ звонка от клиента, в первую очередь, нужен на коммерческих сайтах;
- онлайн-консультирование, своеобразный спасательный круг для пользователей, кому нужна дополнительная информация, также нуждается в отдельной форме;
- еще одна статья – оформление рассылочных подписок: раздел, которым занимается имейл-маркетинг.
Существуют небольшие секреты, как сделать всякую официальную форму привлекательной клиенту, избежав лишней навязчивости или «скромности».
О регистрационном бланке в деталях
Стандартно форма регистрации размещается в шапке интернет проекта. Но отдельно от «бланка» авторизации. Иначе можно легко запутать новых юзеров. По содержанию она похожа на идентичную ей форму заказа. Только не следует перегружать ее. Все должно быть предельно просто и экономить время на заполнение. Особые пожелания:
- минимальное количество пунктов для заполнения;
- если предполагаются поздравительные бонусы для привлечения клиента, то поле для даты рождения никогда не будет лишним;
- а вот адрес лучше оставить для бланка заказа;
- не стоит затруднять пользователя требованием указать оригинальный никнейм или дополнительный номер мобильного.
Обязательно следует поместить рядом кнопки возможности наипростейшей регистрации – через одну из любимых социальных сетей.
Важно! Промышленные товары, для которых обязательно потребуется форма обратного звонка, не нуждаются в наличии бланка регистрации на сайте.
Бланки авторизации и подписки на рассылку
При выделении поля под авторизацию, не нужно забывать о социальных сетях. Сегодня это один из самых удобных входов на любой портал. Поэтому следует прописывать два возможных пути для клиентов – через имейл (или логин) и пароль, и через соцсети.
В случае утери пароля пользователям всегда будет легче получить ссылку и возможность создания нового через e-mail.
Не нужно заставлять клиентов искать, где и как сменить утерянный пароль, воспользовавшись всего лишь автоматической генерацией временного ключа.
Электронные письма с уведомлениями о новых скидках и предложениях, бонусах и пополнении товара всегда являются хорошим поводом познакомить заказчиков с сайтом поближе. Поэтому подписка на рассылку на коммерческих ресурсах должна быть обязательно. Помещается она, как правило, в самой нижней части, под информацией, на первой странице. Но имеются и другие варианты расположения такой статьи. Важно при этом, чтобы юзер сразу увидел подобную возможность. И именно там, где она его может заинтересовать.
Две разных формы – для заказа сервиса и заказа товара
В конец соответствующей страницы, после окончательного ознакомления со всевозможной информацией о выбранной услуге, следует размещать форму ее заказа. Толково составленная форма заказа услуг содержит:
- поле «Вид услуг», заполненное автоматически и представленное в виде готовой информации;
- окно для введения ФИО покупателя;
- обязательное к заполнению (что следует прописать заранее) – поле для номера мобильного;
- для дублирования и дополнительных деталей запрашивается имейл клиента;
- с целью получения заказчиком возможности уточнить любую деталь, имеется особое поле для комментов.
Можно добавить еще пункты, но не следует перегружать бланк. Всего рекомендуется использовать до 7 разных полей.
Форма заказа товара отличается для старых клиентов и новичков или авторизированных и неавторизированных. Новым заказчикам следует в бланк заказа добавить ряд дополнительных вопросов для получения нужной информации, а не отсылать на предварительную регистрацию. Иначе лишиться заказчика проще простого. А для старых нужно поместить в бланк вопросы для уточнения способа совершения оплаты и транспортировки.
Две разных формы – для заказа сервиса и заказа товара
Feedback от клиента – довольно важная функция, поэтому особо рекомендуется бизнес-проектам. На любом коммерческом ресурсе следует размещать две подобных формы. Одну – в верхней панели веб-сайта, другую – в его подвале. Чтобы заказ обратного звонка был максимально интересен и заметен пользователю, следует ссылку на статью поместить непосредственно рядом с цифрами рабочего телефона. Не нужно излишне выпячивать эту функцию. Лучше сделать ее скрытой, чтобы поле для ввода информации появлялось только после нажатия соответствующей ссылки.
При разворачивании бланка, там должно быть не более двух окон для внесения данных. Одно с обязательным вписыванием телефонного номера для связи, другое – с необязательным именем. Иногда достаточно, чтобы указывали лишь номер мобильного. Не стоит утяжелять бланк-форму излишними полями. Цель – не раздражать клиента ненужными для него телодвижениями и тратой времени, а упростить ему возможность сделать приобретение.
Консультирование и онлайн-консультации
Не менее важная функция всех коммерческих порталов – консультация специалиста. Когда пользователь не уверен в своем выборе или не обладает достаточным количеством информации по интересующему его вопросу, нужно, чтобы он тотчас увидел полезную кнопку «Консультация». Для этого ее размещают в одном из наиболее эффективных вариантов:
- в закрытом видимом, но не бросающемся в глаза варианте в правом нижнем углу веб-страницы;
- в виде открытого окна в нижней части Главного раздела, и делают ее доступной в каталоге (на всех его страницах), предлагающем услуги или продукцию;
- на контактной странице (дополнительное размещение).
Некоторые бизнес-проекты предпочитают нанимать отдельного работника (или нескольких), которые будут отвечать на онлайн-запросы. Это практически та же самая функция, но онлайн-консультирование требует наличие поддерживающего ее сотрудника.
Рабочий телефон в обоих вариантах можно заменить обязательным для заполнения пространством с электронным адресом, которое требует и форма подписки для сайта.
Как улучшить юзабилити сайта
Какую бы цель не преследовал интернет ресурс, он должен быть понятным, привлекательным и полезным для пользователя, относящегося к той или иной аудитории. Для этого следует поработать над улучшением юзабилити портала. Что можно сделать и каковы рекомендации профессионалов:
- следует всегда выделять обязательные для заполнения и необязательные поля (это помогает занятым клиентам быстрее ориентироваться в любой форме, а компаниям – сохранять заказчиков);
- модальные или всплывающие окна не должны появляться сами по себе, когда новичок или лояльный клиент только заходит на сайт или покидает его – это самый раздражающий фактор для многих;
- какой бы текст не нужно было поместить рядом со статьей для заполнения, его следует располагать над ней, но не с одной из сторон;
- анимированные окна больше раздражают, чем удивляют и привлекают внимание заказчиков, поэтому их лучше заменять контрастными кнопками;
- кнопка cancel или «Отмена» уместна в индикаторе рабочего процесса или окошке диалога, но не в заполняемом бланке – пользователь может запросто отказаться от покупки при малейшем сомнении или нажать на нее случайно и не захотеть повторить действие.
Название над полями позволяет определить виды форм и ускорить процесс их заполнения.
Дополнительные советы для эффективности usability
Клиенты часто ошибаются во время ввода контактной информации. Во избежание путаницы и досадных недоразумений им лучше помочь. Для этого следует установить проверку, которая в случае ошибки будет выделять это поле, например, красным, подписывая, что требует исправления.
Стоит внимательнее отнестись и к шаговым регуляторам. Некоторые пользователи предпочитают с ними не связываться, а сразу устанавливать нужную им цифру в поле или, в крайнем случае, использовать скользящие рычаги. Поэтому изначально следует отдать предпочтение именно им. Тогда достаточно одного клика, чтобы заполнение превратилось не в долгий и нудный процесс нажимания на мышку, а в быстрый и понятный.
«Капчи» и что с этим делать
Если вы хотите потерять некоторых своих клиентов, то легко пользуйтесь проверкой на то, кто заполняет форму – человек или робот.
Если в ваши задачи входит привлечение новых заказчиков, то не стоит пренебрегать таким параметром, как юзабилити форм. И потому очередную капчу убрать. Заменить ее проверкой от Гугл при вводе контактных данных. Или создать несколько скрытых проверок, типа отслеживания длительности прописывания любого бланка. Если это робот, то поля заполняются мгновенно. Также возможно добавить парочку скрытых от человеческих глаз окон, которые один лишь искусственный интеллект способен распознать и соответственно внести туда требуемые детали. Анти-спамные сервисы также помогут справиться с этой задачей.
Сохранение и сброс данных
Во время занесения данных в любой бланк-форму, особенно, если она довольно сложная и состоит из множества полей, следует предусмотреть автоматическое сохранение заносимой информации. Тогда в случае неожиданных нажатий на другие кнопки, перезагрузок компьютера или браузера, всевозможных ошибок занесенные данные будут сохранены. И пользователю уже не нужно будет вторично набирать тот же текст.
Кнопку сброса информации лучше располагать подальше от кнопки отправки.
Уже не раз случалось, что клиент случайно нажимал на эту кнопку, терял всю введенную информацию и, не желая повторять долгую процедуру регистрации, попросту уходил с сайта.
Не следует забывать и о Законе сбора личностных данных. Во избежание штрафных санкций нужно заранее подготовить соответствующую документацию и прописать сведения об этом на веб-проекте. И вообще – внимательность к деталям, соблюдение норм и стандартов еще никому никогда не помешали.