Сайт-визитка (лэндинг) для поставщика оборудования

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

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

Для решения поставленных задач был спроектирован сайт: дизайн в несколько этапов был согласован с клиентом, затем свёрстан. Следующим шагом было развертывание сайта 1С-Битрикс: Управление сайтом рядом с порталом Битрикс24 с помощью функционала многосайтовости. После была создан шаблон сайта и интегрирована верстка компонентов лендинга в компоненты Битрикс.

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

Шапка и подвал

В шапке сайта располагаются следующие элементы: Логотип, Контактные данные, кнопка вызова модального окна обратной связи. Шапка является липкой (остается на экране при прокрутке странице).

 

В подвале расположены: Логотип, контактные данные, ссылки на социальные сети, ссылки открытия модальных информационных окон (Политика конфиденциальности, Оферта).



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



 

Первый раздел

В блоке содержится краткое описание того, чем занимается компания Индастриал Модуль. Это позволяет пользователю мгновенно понять, кто перед ним, и какие продукты предлагает компания. Такое четкое и лаконичное сообщение помогает создать правильное первое впечатление и привлекает внимание целевой аудитории.



Картинка “робо-рука” имеет анимацию (небольшое смещение) при наведении курсором.

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

В разных разделах лендинга имеются кнопки вызова модального окна с формой обратной связи. После отправки формы, пользователь увидит сообщение об успешной отправки данных. Данные с форм отправляются в CRM Битрикс24.



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



Формы имеют поля выбора типа связи. Выполнено в виде выпадающего списка.



После выбора типа связи, появляется соответствующее поле для заполнения.

Меню

Меню представляет список пунктов, которые являются якорными ссылками для логических блоков лендинга. Меню является липким, остается при прокрутке, также подсвечивает пункт меню того логического блока, в котором мы находимся.



Раздел “Что”

В этом блоке демонстрируется, что и каких брендов продаем компания. Раздел разделе на элементы. Каждый элемент - тип оборудования (промышленный, серверно-сетевой, или эксклюзивный). При наведении курсором на соответсвующий элемент происходит анимация переворачивания элемента другой стороной, где располагается более детальная информация и список логотипов брендов. Бренды кликабельны и ведут на раздел “Поставляем” с более полным списком логотипов брендов
 


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



Раздел "Для кого?"

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



Логотипы партнеров кликабельны, и отправляют якорной ссылкой нас в раздел “Истории успеха”. В последнем элементе “И еще 10+ отраслей” расположен текст и кнопка вызова модального окна с формой обратной связи.

Раздел “Мы”

В этом разделе рассказывается про компанию Индастриал Модуль  и ее преимущества.
В начале этого раздела идет блоки с текстом, которые выполнены в с помощью компонентов включаемая область.

 

После чего идут два блока с преимуществами. Эти блоки представляют собой списки элементов инфоблока, выполненные с помощью компонента bitrix.news.list.



Раздел “Рефералка”

Этот раздел призывает посетителей сайта (как компании, так и частных лиц) активно привлекать новых заказчиков в обмен на материальное вознаграждение, тем самым стимулируя их стать партнерами компании.



Текстовая информация раздела выполнена с помощью компонентов Включаемая область. Кнопка Как это работает вызывает модальное окно с текстом.



Также в этом разделе присутствует форма обратной связи.



Раздел “Поставляем”

В этом блоке представлены логотипы брендов продукции, которую продает компания Индастриал Модуль.



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

Раздел “Истории успеха”

В этом разделе выводятся отзывы партнеров, повествующие об опыте работы с компанией Индастриал Модуль. Отзывы представлены в виде слайдера. Отображается только по 1 слайду. Каждый слайд - это элемент инфоблока. На каждом слайде выводится логотип партнера, общая картинка, описание партнера и сам текст отзыва.