Отличные примеры регистрационных форм, которые впечатлят ваших клиентов с самого начала
Хотя эти формы считаются менее важными деталями, к ним следует относиться серьезно. Есть много компаний, которые не обращают внимания на эту форму и просто кидают на свой сайт что-то, что должно быть заполнено, независимо от ее дизайна. Но без увеличения количества подписчиков бизнес не может стать процветающим бизнесом.
Правда в том, что формы регистрации бывают разных стилей, и очень трудно понять, какой из них является правильным. И да: обычно они включают в себя несколько полей формы, таких как «электронная почта», «пароль» и «повторить пароль». Итак, есть ли здесь что-то важное для дизайна? Здесь всего 3 поля формы! Не напугают ли они людей?
Что ж, в некоторых случаях это действительно происходит, и данные, извлеченные из Google Analytics, показывают, что это правда. И, конечно же, их пугают не формы, а спам. Или они не хотят тратить время, если форма скучная, слишком сложная и слишком длинная. Форма регистрации должна быть цепляющей, запоминающейся, напоминать пользователю о его важности и причине, по которой он пользуется сайтом.
Как создать первоклассные и эффективные формы регистрации
Формы регистрации должны хорошо выглядеть, но они также должны быть функциональными. Хотя конкретного рецепта разработки эффективных веб-форм не существует, есть некоторые общие идеи, которые могут оказаться очень полезными.
Прежде всего, пользователи не должны долго находить форму. Итак, убедитесь, что это видно. Предоставление ответов на вышеупомянутые вопросы создает доверие и реалистичные ожидания.
Некоторые из этих форм размещены в углу сайта или на экране приветствия. В этих случаях регистрационная форма — просто моментально забытая деталь. Одной из лучших вещей было бы разместить его в верхней части каждой страницы веб-сайта.
Если есть какие-то специальные предложения, включите краткое сообщение, которое информирует пользователей о них. Добавление только тех необходимых полей и запрос только того, что действительно важно, обычно делает заполнение регистрационной формы проще и быстрее.
Разработка чистых, красивых и эффективных форм регистрации требует от дизайнеров большого творчества. Создание этих форм очень уникальным способом привлекает посетителей и увеличивает шансы на их заполнение. Поэтому следует подумать о запоминающемся дизайне.
Тем не менее, «запоминающийся» не означает причудливый или сложный. Даже чистый и воздушный дизайн может быть впечатляющим. Самое главное — придать форму регистрации другой вид. Он может содержать большие кнопки, изображения, поля меньшего или большего размера, инструкции и все остальное, что может быть полезно. Макет формы также имеет большое значение, поэтому размер кнопки должен идеально совпадать с полями формы.
Посмотрите несколько примеров веб-сайтов с креативными и эффективными формами регистрации!
TestFlight имеет простую, но эффективную форму регистрации с четко выровненными полями, включая условия использования и политику конфиденциальности.
Ссылка на сайт: TestFlight
Форма на веб-сайте Барака Обамы — еще один отличный пример простой и очень короткой формы.
Ссылка на сайт: Барак Обама
Посетители уже знают, что они должны заполнить регистрационную форму. Как только они доберутся до этого места, ничто не должно отвлекать их от выполнения его задачи. Кроме того, им нужно то, что находится на невидимой стороне формы, поэтому заполнение форм должно быть легким делом. Кроме того, тон должен быть разговорным, дружелюбным и соблазнительным. Форма регистрации Yahoo — отличный пример, так как она требует только того, что действительно необходимо. Поля идеально выровнены, отображается ваш пароль, нет указаний, а также он включает условия обслуживания и политику конфиденциальности.
Ссылка на сайт: Yahoo
Очень важно завоевать доверие посетителей. Обычно они не дают свои идентификаторы электронной почты, потому что их могут рассылать спамом. В таких обстоятельствах лучше всего было бы добавить заявление, в котором говорится: «Этот веб-сайт никогда не передает вашу личную информацию третьим лицам». Таким образом, люди уверены, что их идентификаторы электронной почты остаются конфиденциальными и безопасными. Catalog Choice подчеркивает, что конфиденциальность личной информации защищена. Другие преимущества также указаны в левой части формы.
Ссылка на сайт: Выбор каталога
Еще один способ завоевать доверие — рассказать посетителям о частоте получения электронных писем и предоставить образец контента, который они будут получать. Люди, как правило, неохотно знакомятся с неизвестным, а также не хотят тратить время на чтение менее полезной информации, поэтому предложение хотя бы беглого взгляда на то, что они получат, может предотвратить эту проблему. АВАНТИ делает это. Их регистрационная форма называется «Подпишитесь на рекламные акции», поэтому они сообщают вам, что, зарегистрировавшись, вы будете получать рекламные акции, специальные предложения и новости об их мероприятиях в AVANTI.
Ссылка на сайт: АВАНТИ
Призывы к действию, включенные в формы регистрации, добавляют вовлеченности и взаимодействия. «Зарегистрироваться» или «подписаться»? На первый взгляд, это просто деталь, не имеющая никакого значения. Но это может быть не так. «Подписаться» может показаться слишком продажным. Слово «подписаться» может посылать подсознательное сообщение, которое заставляет людей думать, что они должны за что-то платить. Таким образом, «зарегистрироваться» было бы более разумным выбором. «Начните здесь» также используется реже, и его также можно использовать, как и «Начните здесь!».
Или призыв к действию может описывать, что пользователи могут получить, отправив форму. Например, поощрение — отличный способ заставить посетителей зарегистрироваться. Это может быть бесплатная загрузка, электронная книга или бесплатная пробная версия. InstantLoop использует красивые цвета, а дизайн логотипа очень красивый. Кнопка призыва к действию окружена белым пространством, которое усиливает ее. Под «Присоединяйтесь сейчас» пользователи с самого начала очень хорошо понимают, чего ожидать.
Ссылка на сайт: InstantLoop
LiveResto имеет кнопку призыва к действию, которая точно сообщает вам, что вы получите.
Ссылка на сайт: LiveResto
Сообщая людям о длине или формате пароля перед отправкой, вы экономите время. Как правило, такого рода информация появляется после того, как пользователи вводят свой пароль, и он слишком короткий или не содержит числа. Github, кажется, знает, что постоянное появление сообщений об ошибках раздражает. Вот почему они добавили некоторые спецификации для пароля в форму регистрации.
Ссылка на сайт: Гитхаб
Поначалу не следует запрашивать более конфиденциальную информацию, поскольку люди станут подозрительными и покинут веб-сайт. Форма регистрации в Facebook — отличный пример. Дата рождения — это последняя необходимая информация, а под ней есть краткое пояснение: «Зачем мне указывать дату рождения?».
Ссылка на сайт: Facebook
Красные кнопки на формах регистрации используются уже давно и в настоящее время вызывают много споров. Тем не менее, тестирование — лучший способ определить, какой цвет правильно выбрать для кнопки регистрации. Вот что сделал GSM!
Целевые формы увеличивают шансы быть заполненными. Таким образом, адаптация к конкретным потребностям людей улучшает отношения с ними в долгосрочной перспективе. Jabong — отличный пример целевых форм регистрации. При заполнении формы посетители должны выбрать свой пол.
Ссылка на сайт: Jabong
Упростите форму, чтобы предотвратить отказ. Услуги или продукты, предоставляемые бизнесом, могут быть отличными, но если люди не чувствуют мотивации для заполнения формы, они просто покинут страницу веб-сайта. Прогрессивное профилирование — еще одно отличное решение для уменьшения количества полей формы. Это означает, что пользователю нужно будет заполнить не 10 обязательных полей сразу, а только 3 или 4, а затем использовать другие формы для получения дополнительной необходимой информации. Hubspot подробно объясняет процесс и рассказывает, как создавать формы такого типа.
Отличный текст также важен. Если для формы регистрации используется эмоциональный, умный и заманчивый текст, есть вероятность, что ее заполнит больше людей. Умный текст также может указывать на то, что его заполнение занимает всего 2 минуты. Функции Tumblr при регистрации состоят из двух простых, но заманчивых предложений: «Подпишитесь на блоги, о которых вы слышали. Делитесь тем, что любите». Микрокопия также полезна. Микрокопия означает краткие фрагменты информации, которые отвечают на важные вопросы при заполнении такой формы. Он отвечает на такие вопросы, как «это бесплатная электронная книга?» или «буду ли я получать еженедельное электронное письмо, если подпишусь?» и заставляет пользователя чувствовать себя более комфортно.
Ссылка на сайт: Тамблер
Добавление кнопок социальных сетей является дополнительным доказательством того, что сервис в порядке и безопасен. Podio добавляет несколько кнопок социальных сетей, таких как Facebook, Live, GoToMeeting и Google. С правой стороны они также упоминают главное преимущество и побуждают вас пригласить других сотрудников. Заголовок «Хорошее решение» создает положительное впечатление обо всем процессе подписания.
Ссылка на сайт: Подио
Упоминание количества подписчиков вызывает доверие и профессионализм. Basecamp упоминает, что помог более чем 285 000 компаний завершить более 2 000 000 проектов.
Ссылка на сайт: Базовый лагерь
Демонстрация преимуществ формы и использование обидчивого, эмоционального языка ведет к более личной связи и надежности. Mint.com — отличный пример. В правой части формы они упомянули несколько пунктов, объясняющих, почему им понравится Mint.com.
Ссылка на сайт: Mint.com
Использование Captcha может усложнить взаимодействие с пользователем, а также снизить конверсию. Тем не менее, если вы все еще считаете, что это было бы чрезвычайно полезно, протестируйте и посмотрите, что произойдет. Тогда вы точно будете знать, какой вариант подходит. Чтобы обеспечить защиту от спама, Virb просит людей выбрать слово «beldon».
Ссылка на сайт: Вирб
Заголовок формы также важен. Он должен иметь больший размер шрифта, чем другие текстовые метки, включенные в форму. Некоторые маркированные списки также полезны, поскольку они могут лучше поддержать и объяснить основное сообщение. Форма регистрации Shutterfly имеет заманчивый заголовок. Это видно и ясно показывает, что вы получите.
Ссылка на сайт: Shutterfly
Форма регистрации на динамическом фоне с множеством изображений добавляет интерактивности и привлекает внимание с самого начала. Vimeo является хорошим примером. Форма появляется сразу при входе на сайт, но форма устроена таким образом, что все равно видна.
Ссылка на сайт: Vimeo
Если требуется много деталей, создание более длинной формы регистрации не является правильным решением. Пользователь очень скоро устанет и забросит его. В этом случае наиболее подходящим решением будет дать подсказку, показав следующие шаги. Еще один совет — сделать форму меньше, даже если они должны заполнить ту же информацию и одинаковое количество полей.
Вышеупомянутые веб-сайты являются отличным источником вдохновения. И, конечно же, есть много других замечательных примеров веб-сайтов с эффективными и креативными формами регистрации. Трудно понять, какие советы выбрать и применить, потому что никогда не знаешь, чего ожидать. И если создание регистрационных форм иногда может занимать слишком много времени, существуют конструкторы веб-форм, не требующие программирования. Таким образом, веб-дизайнеры экономят время и упрощают свою работу. В общем, тестирование имеет решающее значение. Поскольку точного рецепта нет, тестирование предотвратит появление многих проблем и покажет, что нужно улучшить. Так что тестируйте и тестируйте снова и спросите себя: вы бы заполнили эту регистрационную форму?