О компании: Компания «СК ФАВОРИТ» является официальным дилером ведущих заводов-изготовителей кровельных материалов, сайдинга, стенового профнастила, заборов, ламината, софитов и другой строительной продукции.
Основные цели: Создание сайта-каталога в современном стиле в серо-оранжевом цвете. Разработка удобной и понятной структуры каталога и категорий товаров. Наличие проработанных лид-форм.
| Краткий бриф на разработку сайта | |
| Наименование компании | ООО «СК ФАВОРИТ» |
| Сфера деятельности | Продажа кровельных материалов |
| Страна, на которую рассчитан сайт | Россия |
| Основные товары и услуги | Черепица, сайдинг, профнастил, фасад, забор, ламинат, водосточная система, обустройство кровли |
| Домен сайта | favorit-house.ru |
| Целевая аудитория | Физические и юридические лица, нуждающиеся в обновлении своего дома/здания или находящиеся на этапе стройки |
| Задачи сайта | Знакомство с товарами, покрытиями и характеристиками, удобство ознакомления, сбор заявок на приобретение продукции |
| Тип сайта | Сайт-каталог |
| Тариф | Индивидуальное решение |
| CMS | WordPress |
| Хостинг | Beget |
| Пожелания заказчика | Современный стиль, удобство каталога, лид-формы |
Обращение
К нам обратилась кровельная компания из России с запросом разработать качественный продающий сайт-каталог в кратчайшие сроки. Дело в том, что ранее заказчик обратился к недобропорядочным исполнителям, которые делали сайт долго, и в итоге проект был заброшен. Поэтому заказчиком было принято решение обратиться в наше агентство, так как наша репутация безупречна, что подтверждается рейтингом 5,0 в Яндекс и Google.
Заказчику нужен был современный сайт с интересными дизайнерскими и функциональными решениями. Упор должен идти на грамотную структуру каталога с большими страницами по каждому производителю. Также заказчику важно было добавить на сайт проработанную лид-форму в виде калькулятора кровли, фасада, забора.
Фирменная палитра и шрифты
Сайт оформлен в оранжево-серых тонах: оранжевая черепица является одним из самых востребованных вариантов кровли среди клиентов. Такое цветовое сочетание не часто встречается на сайтах, посвященных кровельным услугам, что придаёт проекту оригинальность и свежесть.
Шрифт Jost отлично сочетается с общим стилем сайта, так как он легко читается и приятен для восприятия. Этот шрифт предлагает разнообразные начертания, что позволяет эффективно выделять ключевые моменты в тексте.
Цвета
Процесс разработки
Первое, на что обращает внимание посетитель на сайте, – это шапка. В ней содержится вся необходимая информация для удобной работы с сайтом компании. Шапка состоит из трёх частей: информационная строка, показывающая популярные товары, ниже содержится контактная информация о компании, авторежим работы и мессенджеры; нижняя часть хедера указывает на важные внутренние страницы сайта, калькулятор кровли и каталог компании.
Одним из самых важных элементов в проекте является лид-форма, которую мы разместили на первом экране для быстрого доступа к её заполнению. Лид-форма представляет собой окно с выбором нужной категории товаров: кровля, фасад или забор. Далее идёт выбор вариации товара, возможность указать площадь кровли / фасада или необходимый размер забора. Также можно прикрепить файл чертежа и выбрать дополнительные услуги.
Основным преимуществом, по пожеланию клиента, должен стать грамотно структурированный каталог с возможностью перейти на любую интересующую категорию товаров без многочисленных кликов. Уже на главной странице в блоке каталога категории разбиты на подкатегории. Нажимая на любую, пользователь может узнать, какие бренды представлены на сайте и выбрать интересующего производителя.
На странице производителя каждой подкатегории товара (например, Металлочерепица Grand Line) присутствует его описание, логотип и цена, слайдер с фотографиями и кнопки расчёта, быстрого заказа, заказа замера и монтажа.
Ниже размещены все коллекции товара с возможностью быстрого переключения между ними, технические характеристики каждой коллекции, изображение и схема. Затем можно посмотреть все покрытия и цвета каждой коллекции. Под кнопкой “Подробнее о покрытии” скрывается блок с выбором банка для покупки в рассрочку.
Такие страницы призваны ознакомить посетителя сайта со всей доступной информацией по различным разновидностям товара каждого производителя, чтобы у человека была возможность сравнить и выбрать наиболее подходящий для себя вариант.
Существует возможность расчёта стоимости доставки материалов в зависимости от расстояния. Просто укажите количество километров от Москвы, и калькулятор мгновенно определит цену доставки.
Калькулятор кровли
На сайте разработан лид-квиз, позволяющий собирать все необходимые данные об объекте клиента, а также получить его контактные данные.
Зачастую те, кто обращается в кровельную компанию не имеют ничего общего со стройкой и не понимают, какая кровля им нужна. Квиз решает эту проблему, подсказывая возможные варианты, а также иллюстрирует тот или иной ответ.
В данном случае, если у клиента нет какой-то конкретной сметы, то ответив на вопросы, менеджер сразу поймёт, что можно предложить такому лиду и как можно закрыть его потребности. Также пользователь может увидеть свои ответы, которые выводятся по мере прохождения квиза.
Дополнительные модификации
Description-миниатюра
В качестве дополнительного элемента была отрисована и установлена description-миниатюра с указанием контактной информации. Такая миниатюра отображается в социальных сетях и мессенджерах при размещении ссылки на сайт.
Заявки в Telegram с файлом
Заявки, отправленные с сайта, заказчик получает как посредством традиционной электронной почты, так и с помощью уведомлений в Telegram. В сообщении содержится вся ключевая информация поступившей заявки, в том числе прикреплённые клиентом файлы.
Навигационный меню-бар
Функционал инновационного меню-бара закрепляется внизу сайта на мобильных устройствах. У пользователей есть быстрый доступ к важным страницам сайта, а также возможность перейти на любую страницу внутри каталога благодаря раскрывающемуся меню со скроллингом, что позволяет вынести большое количество страниц в него.
Боковой сайдбар
На декстопную версию сайта справа мы добавили и закрепили навигационный бар. Такой бар позволяет пользователю лучше ориентироваться на сайте. По пожеланию клиента мы добавили четыре важные кнопки и сопроводили их соответствующими иконками.
Построение маршрута
Для удобства нахождения офиса компании на странице “Контакты” разместили интерактивную карту с возможностью построения маршрута в Яндекс и Google картах. Маршрут можно строить как от текущего месторасположения, так и любого другого адреса.
Карты рассрочек
Для каждого вида товаров добавили перечень доступных банков, предлагающих рассрочку. Можно выбрать любой и оставить заявку на приобретение товара в рассрочку. Такой блок с рассрочками расположен в каждой вариации товара производителя.
Скорость загрузки
Одной из целей разработки сайта, которая была поставлена нами, – это добиться высокой скорости загрузки сайта. Более подробно о том, почему так важна высокая скорость загрузки сайта, можно почитать в нашей статье. Для текущего проекта были достигнуты следующие значения: максимальные 100 баллов на декстопных устройствах и 97 баллов на мобильных (возможны более низкие результаты из-за медленного интернета или сильной нагрузки на устройства).
Google PageSpeed Insights
Результаты
Во время разработки сайта-каталога заказчик активно участвовал в работе, делился своими предложениями и внимательно слушал наши рекомендации. В результате все поставленные цели были достигнуты: привлекающий стиль сайта, отличный от стиля конкурентов, удобная структура каталога и просмотра всей информации про товары, наличие функциональных лид-форм и калькуляторов расчёта.
