Создание сайта строительной компании ИнтерСтройСервисПроект

То, что это был необычный клиент стало понятно с первых минут знакомства. Нам показали уже готовые макеты мобильной версии сайта. Наша задача была по этим макетам спроектировать и версию сайта для компьютеров, после этого сделать сайт. Обычно сначала проектируется версия для компьютеров, затем на ее основе готовится мобильная версия – тут было все наоборот!

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

Проблема заказчика была в том, что он уже поработал с двумя студиями, и ни в одной ему не смогли сделать то, что он хотел. Он оплатил разработку двух разных сайтов, которые ему сделали, пообещав воплотить все его пожелания, которые он предоставлял в виде Тех.Задания и даже макетов. На выходе заказчик получал вполне приличный строительный сайт, но вообще не похожий на то, чего он ожидал. А всего то надо было услышать желание заказчика, что все должно быть в 100% точности по его макетам. Здесь та ситуация, когда инициатива от подрядчика должна быть минимальной – клиент реально понимает, что ему нужно. Причем дальнейшая практика показала, что его видение было верным, сайт получился эффективным.

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

Как выяснилось, то, что называл клиент макетами, не было ими в полном смысле. Мы дали им определение «эскизы», их нельзя было передавать в работу программисту. Файлы нужно было готовить в Photoshop, с учетом всех требований к верстке, но не в программе CorelDraw, которая заточена под работу с векторной графикой, а не web. Так что сначала мы отрисовали рабочие макеты по эскизам заказчика для мобильной версии. После их согласования прорисовали все страницы версии для компьютера (декстоп).

Всего получилось 24 макета, с учетом, что каждую страницу рисовали для десктоп и мобильной версии. Плюс отдельный макет меню сайта для мобильных.

1. Главная
2. О нас
3. Готовые проекты
4. Карточка готового проекта
5. Текущие объекты
6. Карточка текущего объекта
7. Программа лояльности
8. Акции
9. Контакты
10. Прайс
11. Рубрика услуг
12. Карточка услуги

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

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

В Техническом Задании на создание сайта строительной компании скрупулезно прописали все требования по мобильной верстке. Например, заказчик настоял на таких стандартах:

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

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

- при листании следующее изображение плавно центрируется

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

Поведение меню на смартфоне

• Меню плавно выезжает если тянуть за стрелку
• Работает «доводчик» – вручную сбоку вытянул меню до середины экрана, дальше оно само доводит до полного раскрытия
• При нажатии на стрелку – меню открывается сразу полностью
• В открытом состоянии меню – стрелка меняет направление (влево-вправо)

Спроектировали квиз-опросник, который позволяет собирать контакты потенциальных клиентов через опрос про их потребности. Квиз встроен в первый экран главной страницы в кнопке Узнать стоимость.

Разработали калькулятор расчета стоимости строительства по вводимым переменным параметрам на сайте.

Разработали фильтр готовых дизайн-проектов частных домов для удобства поиска наиболее подходящего проекта

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

Настроили отслеживание конверсий в Яндекс Метрике

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

Скриншот поведенческих показателей сайта строительной компании

Большой популярностью пользовался калькулятор расчета стоимости постройки дома. Процент конверсии в пользование калькулятором:

• 3% по числу людей от общего числа
• 8% по количеству обращений к калькулятору – то есть люди повторно пользовались калькулятором несколько раз, делая разные просчеты.

Помогли завести заказчику базовый учет заявок из рекламы в Excel. В будущем планируем настроить CRM систему Битрикс24.

В итоге засчет рекламы, которая вела на грамотно скроенный сайт, мы смогли быстро обеспечить приток заявок на услуги строительства домов в Крыму. Причем стоимость одной заявки довольно невысокая (не разглашается).

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

Подробнее об услуге.