6 методов оформления страницы регистрации для удобных форм
Опубликовано: 2016-09-22Как маркетолог, вам, вероятно, нравится думать, что вы хорошо понимаете своих потенциальных клиентов - кто они, как они себя ведут и т. Д. Итак, если кто-то из них посетит ваш веб-сайт или страницу регистрации, что, по вашему мнению, они будут делать дальше?
Наверное, зарегистрируйтесь на вашем сервисе, верно?
Как выяснил один бренд, это не всегда так. По их мнению, нечто среднее между этим призывом к действию и страницей с «благодарностью» привело к тому, что бизнес потерял почти четверть своих потенциальных клиентов.
Возникла проблема с их страницей регистрации.
Что такое страница регистрации?
Страницы регистрации, также известные как «страницы регистрации», не все одинаковы. Некоторые из них являются целевыми страницами PPC после клика; другие связаны с домашней страницей через навигацию - некоторые даже являются домашней страницей. Несмотря на различия, все они преследуют одну и ту же цель: генерировать подписку на услугу.
Во многих случаях страница регистрации является последним шагом в воронке конверсии компании. Именно сюда направляются потенциальные клиенты после того, как они оценили бренд и решили, что его услуги предлагают то, что им нужно.
Из-за этого страницы регистрации меньше фокусируются на убеждении потенциального клиента совершить конверсию и больше на минимизации трений, связанных с этим. Этот акцент на удобстве использования означает, что другие традиционные элементы целевой страницы после щелчка, такие как социальные доказательства, отзывы и привлекающие внимание СМИ, отходят на задний план.
Просто посмотрите на страницу регистрации Shopify ниже, которая появляется на главной странице после того, как вы нажмете «начать».

На самом деле это всего лишь краткая форма. И, как вы увидите чуть позже, большинство страниц регистрации построены одинаково, и на них есть не что иное, как заголовок, несколько полей формы и призыв к действию.
Но то, что многие так устроены, не означает, что это правильный путь. Создание успешной страницы регистрации - это больше, чем просто устранение отвлекающих факторов и сокращение полей формы. Задача двоякая.
Нажмите, чтобы твитнуть
Чтобы произвести максимальное количество подписок, вы должны свести к минимуму шаги, связанные с регистрацией, и в то же время максимально использовать те немногие элементы, которые вы действительно используете. Вот несколько советов и идей от экспертов.
1. Используйте заголовок, ориентированный на пользу.
К тому времени, когда потенциальный клиент заходит на вашу страницу регистрации, в большинстве случаев он уже оценил вашу услугу и определил, что она соответствует его потребностям. Но означает ли это, что вам не следует напоминать им, почему они там?
Ниже Copyblogger использует заголовок, наполненный социальными доказательствами, чтобы убедить пользователей зарегистрироваться, а выше Shopify напоминает потенциальным клиентам, что их пробная версия бесплатна в течение 14 дней.
Простота - это хорошо, но если у вас есть возможность усилить свое УТП заголовком, сделайте это. Скорее всего, это окажет более положительное влияние на конверсию, чем отрицательное.
2. Сделайте все поля обязательными
Этот совет не столько требует от посетителей заполнения вашей формы, сколько о том, чтобы убедиться, что вы выбрали правильные поля. Под этим мы подразумеваем, что если вы определили, что поле формы является необязательным, вам не нужна эта информация, чтобы подписать потенциального клиента.
Например, такой сервис, как Groupon, должен знать ваше местоположение при регистрации, чтобы предлагать вам соответствующие предложения и купоны. Но местоположение не является важной частью информации для Instapage о своих клиентах, поэтому мы не запрашиваем ее во время регистрации.
Если вам действительно не нужно знать компанию вашего потенциального клиента, его должность или количество сотрудников, не спрашивайте. Чем меньше им нужно работать, тем лучше.
Поля формы для рассмотрения
Некоторые поля формы, которые следует объединить / избавиться:
- Имя пользователя: действительно ли вашим пользователям нужно имя пользователя для регистрации? Или вы можете просто попросить их адрес электронной почты, а затем позволить им определить свое имя пользователя после входа в систему?
- Подтвердите пароль: это поле устарело и необходимо только из-за маскировки пароля, другого непрактичного метода.
Маскировка пароля - это технология, благодаря которой каждая буква при вводе в форму выглядит как один и тот же маркер. Он производит впечатление дополнительной безопасности, но единственное, от чего он действительно защищает, - это людей, выглядывающих через ваше плечо.
Спросите себя: действительно ли мои потенциальные клиенты создают свои пароли в многолюдном общественном месте? Скорее всего, не.
Вместо использования поля «подтвердить пароль» разрешите пользователям видеть, что они вводят, разоблачив исходное поле «пароль» или используя функцию «показать / скрыть», как это делает MailChimp на своей странице регистрации:

- Имя и фамилия: рассмотрите возможность объединения имени и фамилии в одно поле «полное имя». Или просто спросите имя. Черт возьми, может, даже подумай о том, чтобы вообще от него избавиться.
В нескольких нижеприведенных примерах (Buffer, Asana, Crazy Egg) страницы регистрации не запрашивают имя сразу, но позволяют их преобразованным клиентам вводить данные после входа в платформу.
- Пользовательское соглашение: вместо того, чтобы заставлять ваших пользователей устанавливать флажок, подтверждающий, что они согласны с вашими пользовательскими условиями, рассмотрите возможность включения сообщения над вашим CTA, как это делает LinkedIn ниже. В нем говорится, что, конвертируя, пользователь автоматически соглашается.
3. Если вам абсолютно необходима вся эта информация, запрашивайте ее поэтапно.
Послушайте, иногда вам действительно нужно много информации, чтобы зарегистрировать нового пользователя. Для регистрации, которая требует оплаты на месте, требуются длинные формы для сбора конфиденциальной информации, такой как адрес выставления счета и номер кредитной карты. Когда это произойдет, подумайте о том, чтобы разбить процесс регистрации на несколько этапов.
Отчет Formstack показывает, что в прошлом году многостраничные регистрационные формы превзошли одностраничные более чем на 9%:

Почему?
Многостраничные формы делают преобразование менее утомительным, поскольку разделение процесса на несколько коротких шагов. Больше страниц означает больше места для более крупных шрифтов, более длинных полей и описательных меток, которые могут не поместиться в более короткую форму. Кроме того, многостраничная регистрация обычно сопровождается удобной полосой выполнения, которая позволяет пользователям узнать, как далеко они находятся в процессе регистрации.
Помните: если вы можете сократить форму, удалив несколько полей, сократите ее. Если у вас не получается, не пытайтесь сделать его короче, втиснув все в небольшое пространство. Вы только загромождаете свою страницу и подавите своих потенциальных клиентов.
4. Рассмотрите возможность использования модального окна.
Для тех, у кого есть быстрый процесс регистрации, например Canva, модальное окно предлагает несколько преимуществ.

Дизайнер Джошуа Джонсон объясняет, почему:
Они накладываются на текущий контент, вместо того, чтобы переходить на другую страницу. Почему-то это менее тревожно, чем перемещение в новое место, которое кажется прерыванием. Приглушив графику домашней страницы и открыв модальную форму регистрации знака, вы почувствуете, что процесс будет быстрым и безболезненным и что вы вернетесь к просмотру в кратчайшие сроки.
В то время, когда интернет-пользователи более нетерпеливы, чем когда-либо, создать у них впечатление, что они вернутся к просмотру в мгновение ока, - отличная практика.
5. Включите автозаполнение социальных сетей.
Почти на каждом примере страницы регистрации ниже вы заметите кнопки автозаполнения социальных сетей. Это позволяет пользователям обходить вашу форму одним щелчком мыши, импортируя соответствующую личную информацию, которую они уже отправили в социальные сети.
Formstack обнаружил, что, включив эту функцию, пользователи смогли повысить конверсию форм на 189%. Кроме того, 86% людей говорят, что создавать новые учетные записи пользователей на разных сайтах неудобно. Когда ваша цель - максимально упростить конвертацию, использовать автозаполнение из социальных сетей не составит труда.
6. Удалите текст-заполнитель.
Чтобы конвертировать, посетители должны знать, как заполнить вашу форму. Но использование текста-заполнителя - не лучший способ их показать.

Согласно Nielsen Norman Group, добавление светло-серого текста в поля формы может:
- Напрягайте кратковременную память пользователей. Когда они начинают печатать, и серый текст исчезает, они думают про себя: «Сколько символов нужно снова иметь в моем пароле?»
- Сделайте поля формы невидимыми. Пустые поля формы на самом деле более заметны для потенциальных клиентов, чем поля с заполнителями.
- Раздражайте пользователей, просматривая форму. У тех, кто быстро заполняет форму с помощью кнопки «вкладка», не будет времени прочитать пояснительный текст-заполнитель, прежде чем он исчезнет.
- Запутайте посетителей. Они могут ошибочно принять текст-заполнитель за информацию, которая была заполнена автоматически.
Чтобы избежать путаницы, добавьте над каждым полем ярлык, который точно сообщает посетителям, что им нужно в него включить. Текст-заполнитель только создаст больше трений на вашей странице регистрации.
Как профессионалы создают страницы регистрации
Теперь, когда вы знаете, что добавить на страницу регистрации, давайте посмотрим, как профессионалы создают свою.

Эта страница регистрации в LinkedIn относится к разновидности целевых страниц после щелчка. Он автономный, то есть не связан с веб-сайтом компании через навигацию - даже в логотипе.
Заголовок над формой может передать более сильную выгоду. На нем четыре поля снижают трение. Хотя, объединив имя и фамилию в одно поле «полное имя», это трение можно было бы уменьшить.
Серые буквы над каждым текстовым полем позволяют потенциальным клиентам узнать, что они должны ввести, а над полем «пароль» этот ярлык является еще более конкретным. Тем не менее, это поле «пароль» не соответствует лучшим практикам и не отображает идентичные маркеры для каждой буквы типа потенциального клиента.
Дополнительная серая надпись под последним полем формы сообщает посетителям, что, нажимая «Присоединиться сейчас», они соглашаются с пользовательским соглашением LinkedIn, политикой конфиденциальности и политикой файлов cookie. Это избавляет потенциального клиента от лишнего шага - щелкать поле согласия, чтобы дать согласие.
В призыве к действию слово «сейчас» подчеркивает, что как только пользователь нажимает кнопку CTA, он немедленно становится частью сети. Что касается самой кнопки, она могла бы выскочить еще немного, вам не кажется? Другой цвет фона или кнопки может привлечь больше внимания к тому месту, где пользователю нужно щелкнуть, чтобы присоединиться.
Ниже находится кнопка «Продолжить с Facebook», которая упрощает весь процесс. Если у вас есть профиль в крупнейшей социальной сети в мире, нажмите эту кнопку, чтобы разрешить автозаполнение формы для вас, используя данные, которыми вы уже поделились с Facebook.
Копиблогер

Вот страница регистрации, которая больше, чем просто форма. Первое, что могут заметить потенциальные клиенты, - это гигантский, социально обоснованный заголовок. В переводе говорится: «Если мы достаточно хороши для 334 000 маркетологов, мы достаточно хороши и для вас».
Он также использует явление, широко известное как «FOMO», что означает «страх упустить». Никто не хочет упустить преимущество, которое имеют 334 000 коллег по отрасли.
Под этим предварительный просмотр всего бесплатного ценного контента, который потенциальные клиенты получают после регистрации, побуждает их заполнить эту форму. Однако саму форму можно было бы разработать лучше.
Исключив поле «повторно введите пароль» и сжав имя и фамилию в «полное имя», Copyblogger смог уменьшить количество текстовых полей с 5 до 3 и, в свою очередь, количество трений, связанных с регистрацией. Вместо этого поля «повторно введите пароль» можно использовать параметр «показать / скрыть», чтобы обеспечить точность при вводе пароля.
Чтобы еще больше уменьшить трение, надписи внутри каждого поля должны располагаться выше. Прямо сейчас эта серая надпись исчезает, когда потенциальный клиент щелкает текстовое поле, что позволяет им легко забыть, что они набирали.
В целом, хотя некоторые недостатки в форме и пара исходящих ссылок могут повредить конверсиям на этой странице регистрации, бесплатный контент Copyblogger слишком ценен, чтобы от него отказаться.
Сумасшедшее Яйцо

Во-первых, бизнес, называющий себя «лидером» в своей отрасли, похож на кафе, называющее свой кофе лучшим в мире. Многие говорят это, но мало кто может это доказать. Вместо того, чтобы называть себя лучшим, подкрепите свое утверждение статистикой или цитатой известного клиента, который считает вас лучшим.
Под этим заголовком находится изображение, которое демонстрирует понимание, которое вы получаете при использовании Crazy Egg, а справа от изображения три строки текста объясняют, что это за понимание, а также то, что вы можете с ним сделать.
На этой сверхкороткой форме трение минимально. В заголовке подчеркивается, что пробная версия бесплатна, кнопка появляется на белом фоне, а призыв к действию написан от первого лица. Прямо сейчас единственное, что мешает этой форме быть безболезненной, - это отвлекающий серый текст-заполнитель в каждом поле.
Ниже приводится социальное доказательство в виде узнаваемых логотипов клиентов и текста «Более 200 000 предприятий лучше конвертируются с Crazy Egg», что повышает убедительность этой страницы регистрации.
В целом, эта страница упрощает преобразование для посетителей.
Буфер

Когда вы щелкаете призыв к действию «Зарегистрируйтесь бесплатно» на Buffer.com, домашняя страница преобразуется в страницу регистрации за счет развертывания короткой всплывающей формы и затемнения окружающего содержимого.
В этом всплывающем окне процесс преобразования прост - нажмите одну из трех кнопок входа в социальную сеть, чтобы обойти форму, или введите адрес электронной почты и пароль. В любом случае трение минимально. Только так можно было проще заполнить эту форму? Избавьтесь от отвлекающего текста-заполнителя.
Асана

В лучшем случае регистрация на этой странице в Asana занимает два клика. С функцией входа в Google это может занять всего один раз.
Предложение над формой говорит вам, как заполнить форму, даже до того, на какой адрес электронной почты вы должны подписаться.
Однако непосредственно под ним поле формы, заполненное серым текстом-заполнителем, отвлекает пользователя. Но удержит ли это людей от регистрации? Скорее всего, не. Эта форма почти не вызывает трения и ее легко заполнить.
Начните создавать оптимизированную страницу регистрации с помощью Instapage, запросите демонстрацию Instapage Enterprise сегодня.
