Какие бывают формы? Форма для заявки для сайта


Редактор: как добавить форму заявки

В серии материалов о редакторе Платформы рассказываем, как установить и настроить стандартные секции и виджеты. Общий обзор редактора – здесь, в этой статье о форме заявки, как добавить её и настроить.

Форма нужна для отправки информации владельцу сайта. Например, клиент, оставляет в форме имя и телефон, вы получаете эту информацию и обрабатываете заявку. Все заявки поступают в личный кабинет в раздел “Заявки”. Уведомление о их поступлении настраивается во вкладке “Контакты” каждой отдельной страницы. О настройке уведомлений читайте здесь

Форма – это виджет. Её можно выбрать в верхней части редактора и перетащить внутрь секции. Есть

  • простая форма
  • горизонатльная форма
  • форма с одним полем
  • кнопка с формой

Фо вкладке "Форма" указываем название. Оно понадобится для статистики: когда с формы придет заявка, вы сможете определить, с какой именно. Подключаем интеграции, если они есть. Подробнее об интеграциях – здесь`. Выбираем действие после отправки:

  • Отправка сообщения: когда посетитель оставит заявку, он увидит тот текст, который вы разместите в специальном окне.
  • Перенаправление на указанный адрес: посетителю откроется тот сайт, адрес которого вы укажете в настройках. Не забудьте написать http:// или https:// перед адресом сайта.
  • Отправка сообщения и перенаправление на указанный адрес: посетитель увидит сообщение и перейдет на сайт. Здесь также не забудьте написать http:// или https:// перед адресом.
  • Переход к оплате: откроется страница оплаты, если выбрана интеграция в настройках страницы. Эта функция доступна на тарифе Бизнес+.
  • Отправка сообщения и переход к оплате: появится всплывающее окно с сообщением, что заявка принята, и пользователь перейдет на страницу оплаты. Эта функция также доступна на тарифе Бизнес+.

Также в настройках формы можно установить HTML или JavaScript код. Сторонний HTML код для действий после отправки сообщения будет прописан перед закрывающим тегом BODY. JavaScript код выполняется после успешного отправления заявки. Для разработчиков мы предусмотрели возможность расширенной настройки форм. Подробнее здесь.

Выбираем горизонтальную или вертикальную форму Выбираем стиль:

  • Без стиля
  • Простой
  • Простой с цветным заголовком
  • Цветной
  • Цветной с полупрозрачным фоном

Настраиваем размер формы:

  • Маленький
  • Нормальный
  • Большой

Меняем ширину формы, потянув за левый или правый край.

Выбираем цвет формы и настраиваем скругление обводки.

Добавляем заголовок.

Можно настроить не только вид формы, но и стиль полей внутри неё.

  • Скругление обводки
  • Положение текста: слева, снизу или внутри поля
  • Ширину поля горизонтальной формы

А также настроить сами поля, их количество и текст.

Добавляем поле и меняем его тип

Изначально в форма содержит стандартные поля: имя и электронную почту. Если нужно добавить ещё несколько полей, нажимаем на кнопку “Добавить поле" и тип. Чтобы пользователь не смог отправить сообщение не заполнив поле, ставим галочку “Обязательное поле”.

Меняем имя поля

Меняем порядок отображения полей

О настройке других виджетов и секций читайте здесь.

Видеоурок о настройке формы

platformalp.ru

Формы обратной связи и кнопки конверсии на коммерческом сайте

Каждый владелец коммерческого сайта, на котором предлагаются услуги, товары и т.д. должен создать полный спектр условий для пользователя, от которого ему нужно получить целевое действие.

Чем более гармонично, грамотно и удобно на сайте расположены формы обратной связи и кнопки конверсии, тем больше клиентов и соответственно прибыли Вы получите.

Эти вещи чуть ли не самые важные в коммерческом сайте:

  • Во-первых, они влияют на usability (юзабилити) сайта, что является очень важным моментом. Грамотно построенное юзабилити влияет на поведенческие факторы, которые в свою очередь, влияют на позиции Вашего сайта в выдаче.
  • Во-вторых, формы и кнопки являются коммерческими факторами ранжирования поисковых систем, что тоже стоит учитывать. В различных ситуациях недостаток необходимых форм может послужить поводом для пессимизации Вашего проекта в выдаче.

Разберемся, что же такое “форма обратной связи” и что такое “кнопка конверсии”

Кнопка конверсии

Кнопка конверсии – область на сайте, которая служит для того, чтобы вывести клиента на оформление заказа или заявки и т.д.Кнопка должна быть яркой и достаточно крупной, чтобы пользователь ее сразу заметил – это основополагающий фактор успеха конверсии Вашего сайта. Если кнопка будет расположена в футере, непонятно где и мелким шрифтом – это приведет к провалу и потере потенциальных пользователей.

Где располагать эти кнопки:

  • Лучшее место для основной кнопки конверсии (“Обратный звонок”, “Получить консультацию”) в шапке сайте, рядом с номером телефона.
  • Для кнопок “Заказать услугу” лучшее место расположение – страница с конкретной услугой в начале или теле статьи, желательно после материала, который дает пользователю информацию о цене или этапах работ, характере сотрудничества.
  • Кнопка “Купить” обычно используется в интернет магазинах и должна располагаться в корзине, а также на страницах каждого товара на видном месте. Нельзя располагать рядом с этой кнопкой другие кнопки вроде “Получить информацию”, “Скачать инструкцию” и т.д., потому что это будет отвлекать клиента.

Форма обратной связи

Форма обратной связи – это специальная область на сайте, созданная для посетителей, которые хотят получить консультацию от владельца сайта или оформить заказ. В такой форме мы можем видеть различные вариации полей для заполнения и кнопку “Оформить заказ” или “Отправить”, в зависимости от того, для чего она используется.

Виды форм:

  • Заказ обратного звонка. В идеале - это форма с 2-3 полями (Имя, Номер телефона, ну и можно время для звонка указать, но это не всегда нужно). Это одна из самых важных форм, которые делают конверсию на коммерческом сайте, потому что пользователям, зачастую, проще попросить перезвон и решить все свои вопросы по телефону, чем сидеть и оформлять заказ на сайте.
  • Форма заказа услуги. Это форма с более расширенной информацией чем предыдущий вариант. В ней обычно присутствует: поле для сообщения, номера телефона и email. Email должен быть всегда необязательным полем, ведь многие им не пользуются. Если у Вас в такой форме идет заказ конкретной услуги, то хорошим тоном будет разместить туда поле с заказываемой услугой, которая будет определяться автоматически, исходя из того с какой страницы перешел пользователь.
  • Форма заказа товара. В общем, сильного отличия от заказа услуги не имеет. Такая форма часто размещается на сайтах-каталогах, где нет корзины и возможности покупки онлайн.
  • Форма получения консультации. Только имя, сообщение и email. Если форма служит только для того, чтобы дать человеку возможность получить информацию об услугах, то этих полей будет вполне достаточно.
  • Онлайн–консультант. Онлайн-чат, который делает неплохую конверсию. Эта форма, в которой присутствует поле для сообщения, обязательно без регистраций и авторизаций, которые могут отпугнуть Вашего потенциального клиента. Такая форма требует от владельца сайта или его оператора регулярного мониторинга сообщений в этом чате и своевременных ответов на них, чтобы клиент был сразу же заинтересован. Часто, если клиенту отвечают быстро и по делу, то он больше не идет искать другие варианты в выдаче и заказывает услугу у Вас.
  • Форма оформление и оплаты товара в интернет-магазине. Обязательный атрибут каждого интернет-магазина – возможность купить товар и оплатить онлайн. Кнопка для перехода на эту форму обычно располагается в корзине. Данная форма должна быть обязательно доступна без регистрации. Владельцы интернет магазина, которые внедряют обязательную регистрацию на своих ресурсах – просто губят свою конверсию и ничего более. Форма должна быть удобной быстрой и без лишних сдерживающих факторов, ведь все что от нее требуется – дать пользователю отправить свои деньги в Ваш кошелек и им надо помочь сделать это как можно быстрее.

Несколько правил, как сделать форму удобной для посетителей Вашего сайта и правильной с точки зрения Seo и Usability

  • Не перегружать лишними полями. Это очень важно, нужно понимать, что человека может отпугнуть все, поэтому нужно максимально облегчить форму.
  • Капчи - зло. Про капчи у нас есть отдельная статья, где мы подробно разбираем все минусы данного явления на коммерческом сайте. Вы можете ознакомиться с ней здесь.
  • Сделать форму всплывающей на этой же странице. Тут все просто. Если форма уводит человека на другую страницу сайта – это большая потеря времени, все еще сохраняется фактор того, что клиент зашел с мобильного интернета и он не особо быстрый, все это мешает и отвлекает пользователя от целевого действия, которое нам и требуется от него получить. Поэтому желательно предоставить пользователю все что ему необходимо на той же странице, куда он перешел из поиска.
  • Поля должны быть крупные. Не нужно делать поля такими мелкими, чтобы пользователь с телефона не мог попасть на нужное поле и промахивался. Это порой раздражает и заставляет просто покинуть сайт.
  • Никаких отвлекающих факторов. В форме не должно быть никаких ссылок, картинок и других отвлекающих пользователя вещей.
  • Обработка данных. Обязательно должен быть пункт об обработке персональных данных, если у Вас не будет на сайте договора и вы не будете в своих формах спрашивать у пользователя, согласен ли он на обработку данных, то вы можете попасть под Пункт 3 статьи 13.11 КоАП РФ и получить штраф.

Подводя итоги всего выше сказанного, хочется отметить, что формы на сайте и кнопки конверсии обязательны, если вы хотите качественно и продуктивно продавать что-либо на своем ресурсе. Многие владельцы сайтов думают, что номера телефона в шапке достаточно, чтобы получать стабильные заказы, но они глубоко заблуждаются. Вы должны максимально обеспечить пользователя возможностями получения обратной связи, чтобы ему все было понятно и не было лишних проблем на всех этапах заказа товара или услуги. Одно неверное движение и потенциальный клиент уходит с сайта ничего не купив.

Важно постоянно отслеживать сервис Яндекса – “Вебвизор”, чтобы максимально понимать из-за чего Ваши потенциальные клиенты уходят с сайта, что им не нравится или что их отталкивает и как можно скорее устранять эти недочеты.

Делая максимально комфортно – Вы получаете свои заказы. Все просто, это равноценный обмен пользователя и владельца сайта!

seoforge.ru

Как разместить форму заявки?

Форма заявки – ключевой элемент лендинга, точка взаимодействия покупателя с продавцом. Коммуникацию с клиентом можно выстраивать разными способами, но в любом случае нужны контакты клиента – почта или номер телефона. Их можно собрать с помощью формы.

В серии материалов о форме разбираемся в видах, учимся размещать форму на странице, настраивать её и обрабатывать заявки.

В этой статье:

  • Какие бывают формы?
  • Сколько форм должно быть на лендинге?
  • Как добавить форму?
  • Где разместить?

То, как будет выглядеть форма зависит цели, с которой мы помещаем её на страницу. Будет ли это форма, где клиент оставляет телефон, на который мы после перезвоним и договоримся о доставке товара? Будет ли это форма, где клиент оставит email, куда мы после напишем, чтобы напомнить о мероприятии? Или форма, через которую клиент сможет оставить отзыв?

Определяемся, какая информация о клиенте нам нужна, и оставляем только те поля, которые нацелены на сбор этой информации. Не нужно лишних полей. Форму должно быть легко заполнить.

Определяем цель формы и необходимую информацию.

Форм на лендинге может быть несколько: как минимум форма на первом экране и форма захвата в конце. Количество форм зависит от того, делаем мы короткий или длинный лендинг, а длинна лединга – в свою очередь от продукта и количества информации, которую о нём необходимо разместить.

На лендинг заходят разные посетители:

  1. Те, кто видят страницу первый раз. Они не знакомы с товаром, хотят получить полную информацию и доскроллят до конца, если страница их заинтересовала.

  2. Если посетитель попадает из социальных сетей, email-рассылок или уже заходил на страницу, он уже знаком с товаром. Если товар его заинтересовал, клиент готов сделать заказ с первого экрана.

Форм на странице как минимум две.

Помимо формы заявки на первом экране и формы захвата в конце лендинга, в середине можно разместить:

  • Форму записи на бесплатную консультацию,
  • Форму обратного звонка,
  • Форму подписки на рассылку,
  • Форму, чтобы оставить отзыв и другие.

О них мы расскажем в следующих статьях. Для начала попробуем разместить на странице простую форму заявки.

Чтобы добавить форму на страницу в Платформе, заходим в редактор. Мы можем разместить форму на первом экране, тогда воспользуемся одной из стандартных секций "Первый экран". Здесь есть секции с полной вертикальной и горизонтальной формой, а также формы, открывающиеся по клику. Поля форм стандартные: имя, электронная почта или телефон. Форму на выбранном первом экране можно настроить: добавить, удалить или переименовать поля, изменить стиль и цвет, а также подключить интеграцию.

О настройке полей и дизайне формы читайте в следующей статье. Если на первом экране размещаем только заголовок, описание и меню, то форму можно разместить на следующей секции. Тогда воспользуемся одной из специальных секций "Форма". Здесь также есть вертикальные и горизонтальные варианты форм, формы, открывающиеся по клику. Заголовок, описание, стиль и цвет формы можно настроить.

О настройке полей и дизайне формы – в следующей статье. Если ни одна их стандартных секций с формой не подходит или форму нужно разместить в уже созданную секцию, используем виджет. Есть несколько виджетов:

  • Простая форма
  • Горизонтальная форма
  • Форма с одним полем форма Выбираем вид и перемещаем виджет туда, где хотим разместить форму.

Полная форма с полями для ввода контактов на первом экране или в одной из первых секций – только один из способов разместить форму на странице. Разбираемся с плюсами и минусами такого варианта и выясняем, какие способы есть ещё.

1

Полная форма привлекает внимание. Клиенту понятно, что нужно сделать, чтобы заказать товар или воспользоваться услугой. Если она размещена на первом экране, её не придется искать.

Пример

Кнопки “Заказать звонок”, “Нанять дизайнера” с формой, открывающейся по клику, и полная форма “Нанять замерщика” на лендинге компании по ремонту помещений.

Но полная форма с полями и кнопкой занимает много места. Если мы размещаем её на первом экране, то делаем явный акцент на продажу. У клиента может сложиться ощущение, что продавец не утруждается объяснить, зачем нужен товар и чем он хорош, а только спешит продать.

2

Спрятать полную форму можно, скрыв в кнопке. Если форма открывается по клику, то на первом экране и дальше на странице их может быть несколько.

Чтобы разместить форму, открывающуюся по кнопке, используем виджет.

Пример

Формы обратной связи, открывающиеся по кнопке “Перезвонить”, “Отправить заявку” и “Консультация” на лендинге о языковых курсах.

3

Третий дополнительный способ размещения формы – кнопка-ссылка на секцию с формой в середине или внизу лендинга.

Пример

Кнопка на первом экране “Перейти в магазин” со скроллом к секции с товарами, где есть форма обратной связи.

Итак,

  • форма зависит от задачи лендинга: определяем, какая информация о клиенте нужна и выбираем форму,
  • форм на странице должно быть как минимум две,
  • формы бывают горизонтальные и вертикальные,
  • форму можно разместить полностью или открывающейся по клику, а также сделать кнопки в начале лендинга со ссылкой на кнопку в конце.

В следующей статье расскажем о дизайне формы.

platformalp.ru