- Заказчик
- Компания Гранитис производит из гранита бордюр, брусчатку, тактильная плита, плиты любого размера, а также производит укладку гранитных изделий на объекте заказчика.
- Задача
- Разработать удобный, адаптивный сайт для знакомства клиентов с компанией Гранитис и для изучения ассортимента гранитных изделий в виде каталога.
Технологии: PHP, HTML5, CSS3, Bootstrap.
Платформа: CMS KONVERSIA
Команда: 4 человека (дизайнер, верстальщик, разработчик, руководитель проекта).
К нам обратился клиент с просьбой создать адаптивный сайт-визитка с каталогом с современным дизайном и интуитивно-понятным интерфейсом, который будет привлекать внимание посетителей.
Минимальные требования клиента звучали так:
- Дизайн интерфейса должен содержать цвета из лого компании – Лев на оранжевом фоне.
- Иметь простую и понятную навигация по сайту.
- Иметь возможность оставить заявку на заказ гранита.
- Создать удобные карточки гранитных изделий и модификатор подбора нужного гранита.
- Иметь внутренний функционал админ-панели, чтобы без помощи тех.специалситов добавлять модификацию гранитных изделий.
Предистория
Старый сайт клиента не отвечал многим требованиям: не имел дизайна, мало функционала, сложное администрирование. Брать сайт на продвижение и на рост заявок и первые места в выдаче с таким сайтом не имело смысла. Заказчик обратился к нам за помощью: нужен был новый сайт, с расширенным функционалом и обновленным дизайном. Проект должен полностью отвечать требованиям поисковых систем.
Как было:
Работы:
Целевая аудитория продукта – частные компании которым требуется благоустройство территории в собственности их компании, муниципальные компании, которые проводят плановые дорожные работы и благоустройство территории. Впечатление от компании и вероятность покупки у такой ЦА зависит даже от незначительных факторов:
- Фоновая заставка и цветовая гамма сайта.
- Наличие спросового ассортимента и его модификация.
- Высокая скорость загрузки сайта.
- Понятная навигация по сайту.
- Качество картинок, понятное описание товара.
Мы спроектировали и отрисовали уникальный дизайн в полном соответствии с брендбуком, который нам выслал заказчик: это лого с головой льва, это оранжевый и темно-синий текст для визуального оформления.
Мы приняли решение не перегружать страницу лишней информацией. Разработали статичные блоки, которые уже по контенту текстовому и визуальному собраны и просто как в конструкторе добавляются на страницу:
- Блок Проекты
- Блок Производство
- Блок Продукция
- Блок Контакты
Для начала создания сайта веб-дизайнер создал макеты расположения блоков на веб-странице и были утверждены с клиентом.
Главная страница
Пользователи заходят на сайт с главной страницы по брендовым запросам вроде «компания “Гранитис”» или по прямым ссылкам. Поэтому основная задача страницы — рассказать о бренде и направить пользователя к выполнению нужного сценария.
Каталог продукции
Каталог товаров — самый просматриваемый раздел на сайте. К нему обращаются 70 % посетителей сайта, и именно с него на сайт заходят более 50 % аудитории. Для сравнения: на главную заходят лишь 15 %, а на страницу «О компании» — 3 %.
Основная задача каталога — сразу зацепить пользователя: сориентировать по ассортименту и ключевым предложением продукции, помочь с выбором, поэтому на странице каталога сразу выведен модификатор подбора продукции.
ОБРАТИТЕ ВНИМАНИЕ:
Страница объединяет в себе приемы верстки классического интернет-магазина и презентации каталога продукции. Крупные фото и акцент на характеристиках.
Модификатор здесь — не просто свойства, а основной критерий выбора конкретного типа изделия.
Все решения (заголовки, названия, цены, кнопки, тексты) учитывают требования SEO для конкурирования с интернет-магазинами гранитных изделий по частотным запросам вроде «купить гранит» и «гранит в москве».
Карточка основного товара
Если на странице каталога покупатель присматривался к ассортименту, то на карточке пользователь близок к решению купить. По согласованию клиента мы не стали нагружать карточку товара так как он не хотел создавать именно интернет-магазин. Карточка товара содержит модификатор изделия и выбор гранита по месторождению.
SEO
Выполнили базовые требования поисковых систем для продвижения сайта в поисковой выдаче:
- Создали и разместили robots.txt и sitemap.xml. Запретили индексацию технических разделов.
- Составили новые тексты и разместили на страницах категории: брусчатка, бордюр, плита и тактильная плита.
- Проработали метатеги title, H1 и description — важные факторы, по которым поисковики определяют тематику страницы.
- Добавили на сайт счетчики аналитики и установили цели на конверсионные действия: как оставить заявку, заказать обратный звонок.
- Запустили в работу задачу по внешним ссылкам на релевантных тематических сайтах.
Адаптивность дизайна – мобильная версия
Дизайн сайта полностью адаптирован под все виды устройств. Покупателю будет удобно знакомится с ассортиментом.
Итог:
В процессе создания нового сайта мы решали множество задач, но глобальные векторы были такими:
Презентация бренда. Сайт должен отражать производственную мощь компании, современные технологии, а также формировать образ лидера отрасли.
Нацеленность на продажи. Сайт должен решать потребности потенциальных покупателей и действующих потребителей, а также быть удобным, презентационным и адаптивным.
Каталог + конверсионный магазин. Сайт должен иметь каталог гранитной продукции с акцентом на модификацию, то есть подбор нужного размера и типа гранита у каждой категории: бордюр, брусчатка, плита.
Простота управления контентом и стиль. Важно, чтобы при развитии сайта его стиль оставался целостным, при этом для внесения доработок и добавления новых материалов не требовалась помощь дизайнера и большие трудозатраты.
SEO. При создании сайта мы сразу учли необходимые доработки для увеличения SEO-трафика и внесли их на сайт до открытия к индексации.