Существует множество видов форм регистрации и входа на сайт. Большинство дизайнеров знакомы со стандартными, проверенными способами создания форм. Но понимание и применение нескольких нововведений упростит формы авторизации на вашем сайте и сделает их более удобными для заполнения. В этой статье мы бы хотели показать инновационные идеи, которые пригодятся вам в работе над очередным дизайном. Пожалуйста, имейте в виду, что применять новые подходы нужно только там, где они будут к месту. Также мы будем очень рады, если вы поделитесь своим опытом внедрения и результатами юзабилити-тестов, которые подтвердят или опровергнут полезность приведенных нами методов.
Упрощаем форму регистрации
Назначение любой формы регистрации — правильно ее заполнить и отправить данные на сервер. Если форма длинная и запутанная, то хорошее впечатление пользователя от пребывания на вашем сайте может смениться раздражением. Вот несколько новых приемов, которые ускорят и упростят процедуру заполнения форм на вашем сайте пользователями.
Попросите пользователя придумать себе логин после регистрации
При регистрации пользователя обычно просят придумать себе уникальный логин. Если придуманный логин будет уже занят, ему придется снова думать, ошибаться и тратить время. Вместо того, чтобы вынуждать пользователя суетиться при регистрации, можно попросить его придумать логин позже. Таким образом вы не потеряете пользователей, раздраженных тем, что у них не получается придумать себе логин, и избежите ситуаций, когда пользователи будут придумывать случайные или незапоминающиеся ники просто, чтобы заполнить обязательное поле логина в форме регистрации.
Не просите пользователей подтвердить пароль
В большинстве форм регистрации требуется вводить свой пароль сразу в два поля. Причины очевидны: при введении пароль скрывается, чтобы мошенники не могли его увидеть. Чтобы уменьшить количество опечаток и увеличить шансы на правильный ввод пароля, требуется подтверждать введенный пароль во втором поле.
На самом деле это лишь увеличивает количество ошибок, потому что пользователям приходится больше набирать. Они не видят символы, которые вводят, поэтому им еще сложнее понять, ввели они правильный пароль или нет.
Намного более эффективным подходом является просить пользователя ввести пароль только один раз, и добавить чекбокс для отображения введенного пароля, чтобы можно было проверить его правильность. Кроме того, такое нововведение позволит уменьшить количество полей для заполнения.
Автозаполнение полей «Город» и «Штат» на основании почтового индекса
Если в форме регистрации требуется адрес пользователя, тогда вам пригодится автозаполнение полей города и штата на основании введенного пользователем почтового индекса. Форму будет быстрее заполнить, потому что пользователям не придется вручную выбирать город и штат из выпадающего списка.
Автозаполнение поля «Страна»
Обычно при заполнении форм пользователям предлагается выбрать свою страну в выпадающем списке. Вместо того, чтобы вынуждать пользователей прокручивать длинный алфавитный список стран мира в поисках своей страны, можно добавить текстовое поле, которое будет производить автоматический поиск страны на основании букв, которые введет пользователь.
Иными словами, пользователю онадобится ввести всего несколько букв, чтобы увидеть свою страну в списке.
Автозаполнение адреса оплаты из адреса доставки
Если пользователь совершает покупку, от него требуется ввести адрес плательщика и получателя. В большинстве случаев это будет один и тот же адрес, так почему бы не заполнять один из другого? Вы можете сделать ссылку «Тот же, что и адрес доставки» в блоке заполнения адреса плательщика, и после клика по ней в блок будет копироваться информация из уже заполненных полей адреса доставки.
Не подписывайте пользователя на рассылку новостей по умолчанию, а предлагайте сначала взглянуть на присылаемые новости
Многие владельцы сайтов отмечают опцию подписки на новости по умолчанию в надежде получить больше подписчиков. Это и правда может сработать. Но такая рассылка будет неэффективной, если пользователь подписался на нее по невнимательности или незнанию. Если он не заинтересованы в ее получении, то рано или поздно он все равно отпишется. Вынуждая его подписаться, в конечном итоге вы только проиграете, так как письма с новостями, которые пользователь не просил, могут его разочаровать.
Вместо этого более эффективно будет показать пользователю превью или отрывок из рассылки. Если ему понравится, он подпишется сам. Таким образом пользователь будет знать, что он потеряет, если не подпишется, а вы будете спать спокойно, зная, что подписанные на новости пользователи искренне интересуются вашим контентом.
Боритесь со спамом при помощи скрытых JavaScript полей вместо капчи
Если вы получаете много спама, то вам нужно добавить капчу в форму регистрации. А вот что вам точно не нужно, так это терять из-за нее пользователей. Статистика показывает, что стандартная капча, которая требует от пользователей ввести искаженные символы, отрицательно влияет на конверсию. Что неудивительно, так как капча заставляет пользователей напрягаться.
Есть более простой подход, который не снизит вашу конверсию — это использование обязательного скрытого поля, которое генерируется при помощи Javascript на стороне клиента. Спам-боты не смогут заполнить это поле, потому что они не могут взаимодействовать с объектами Javascript на стороне клиента, на это способен только сам пользователь. Этот способ проще и не такой навязчивый, как капча, поэтому он способствует борьбе со спамом, не снижая конверсию. Единственным его недостатком является то, что для его работы требуется, чтобы у пользователя был включен JavaScript, что в некоторых случаях будет не самым оптимальным выбором. Вы также можете использовать : с помощью неё можно создать текстовое поле, которое будет пустым и скрываться при помощи CSS от пользователей, но не от ботов, и затем нужно просто проверить, останется ли это поле пустым после регистрации. Если нет, тогда это регистрация спам-бота и ее можно смело игнорировать.
Упрощаем форму входа на сайт
Назначение любой формы входа на сайт — позволить пользователю попасть в свой аккаунт. Некоторые формы выполняют эту задачу лучше других. Вот несколько новых способов помочь вашим пользователям залогиниться.
Вход с использованием e-mail пользователя
Запомнить свой e-mail пользователю легче, чем имя пользователя. Логин может быть не очень запоминающимся, а свой e-mail пользователи и так помнят, поскольку они постоянно пользуются почтой. Позвольте пользователям использовать e-mail для входа наряду с обычным логином. Это сэкономит их время и нервы, избавив от восстановления забытого логина.
Вход на сайт без перехода на другую страницу
Вход на сайт — распространенная задача, и пользователи должны иметь возможность залогиниться с любой страницы сайта. Если они залогинились, перенаправьте их обратно на ту страницу, где они находились. Это ускорит процедуру входа и позволит пользователям быстрее вернуться к своим делам на сайте.
Для этого есть пара способов: всплывающий блок (попап) и диалоговое окно.
Попап открывается сразу, не уводит пользователей со страницы и занимает немного места, поэтому этот способ быстрый и легковесный.
Диалоговое окно тоже не перебрасывает пользователей на другую страницу, кроме того, оно появляется в центре страницы и фокусирует на себе внимание пользователя. Это позволит вам добавить в форму дополнительную информацию, на которую пользователь обычно не обратил бы внимания.
Автофокус на первом текстовом поле
Когда пользователь видит форму входа, он сразу готов залогиниться. Облегчите ему задачу, установив автоматический фокус на первое поле формы. Это сэкономит время и усилия, которые пользователь потратил бы на перемещение курсора и клик в поле. Его руки останутся на клавиатуре и он сразу начнет набирать. Автофокус также подсвечивает нужное поле, поэтому пользователь сразу поймет, что он уже может вводить информацию.
Отображение скрытого пароля
Этот способ так же полезен при входе, как и при регистрации. Если пользователь не видит символы, которые вводит в поле, он может опечататься. Если войти не удастся, то он поймет, что опечатался и будет вводить пароль, пока не введет правильный вариант.
Проблема состоит в том, что если пользователь не знает, где опечатался, то он не сможет исправить введенный пароль до того, как сделает первую попытку залогиниться. Пользователю придется приложить лишние усилия и набирать медленнее. Этого можно избежать, если добавить чекбокс, позволяющий увидеть введенный пароль до отправки формы.
Используйте иконку со знаком вопроса для восстановления забытого пароля
У пользователя не должно быть проблем с нахождением ссылки на восстановление забытого пароля в вашей форме входа. Вместо того, чтобы использовать обычную ссылку «Забыли пароль?», добавьте простую иконку со знаком вопроса. Она не займет много места и не потеряется среди других ссылок.
Поскольку знак вопроса — универсальный символ для обозначения справки или помощи, пользователь не будет гадать, куда кликнуть, если он забыл пароль.
Кнопка «Войти» должна быть такой же ширины, как и текстовые поля
Кнопка «Войти» служит не только для входа: она также сообщает пользователям о том действии, которое они намереваются совершить. Маленькая кнопка входа неудобна и может заставить пользователей колебаться.
Широкая кнопка позволяет пользователю чувствовать себя уверенно, кроме того, ее сложно не заметить. Надпись на кнопке также более крупная, поэтому пользователю становится понятнее, что он собирается сделать.
Вход через Facebook, Twitter или OpenID
Почти у каждого сейчас есть аккаунт на Facebook, в Twitter или OpenID, и возможность входа через эти аккаунты принесет большую пользу. Пользователь сможет практически мгновенно начать использовать сайт, не проходя процедуру регистрации. Кроме того, ему не придется запоминать многочисленные логины и пароли на разных сайтах.
Конечно, вы можете пойти еще дальше и добавить Facebook Connect для автозаполнения информации, которую иначе пришлось бы набирать; ниже показан пример с , приложения для Facebook. В нем единственное, что нужно сделать прежде, чем начать пользоваться приложением — это нажать кнопку «Зарегистрироваться». Информация о пользователе автоматически подгружается в поля, хотя это спорный момент с точки зрения конфиденциальности. Поэтому, возможно, вы не захотите использовать Facebook Connect на своем сайте.
Выводы
Формы регистрации и входа на вашем сайте не должны усложнять пользователю жизнь. Заполнять формы вообще занятие не из приятных. Надеемся, что описанные в статье инновационные способы помогут вам упростить и усовершенствовать формы, чтобы пользователи быстрее зарегистрировались, вошли и начали получать удовольствие от пользования вашим сайтом. Если вы хотите узнать о других способах, вы можете прочесть статью Joshua Johnson .
Перевод статьи ““
Здесь можно оставить свои комментарии. Выпуск подготовленплагином wordpress для subscribe.ru
