Разработка интернет-магазина по продаже кровельных материалов

s

Задача

Разработать адаптивный интернет-магазин на современном готовом решении


Период: 2022

Какие велись работы

Ссылка на проект

arkada32.ru

О клиенте

Торговая компания «Аркада-маркет» работает на рынке города Брянска и соседних областей с 2004 года, занимаясь продажей современных кровельных и отделочных материалов.

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

Главная страница нового сайта

Задачи проекта

Старый сайт-каталог был разработан еще в 2015 году.

Главная страница старого сайта

Главная страница старого сайта

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

При этом большая часть трафика шла именно со смартфонов:

Это означало, что для большей части аудитории сайт не подстраивался под устройство, и им было неудобно пользоваться:

Старый сайт АРКАДЫ с мобильного устройства

Старый сайт АРКАДЫ с мобильного устройства

Это не только потерянный трафик, но и потерянные заказы: как розничные, так и оптовые.

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

Это стало основой для поиска нового современного решения:

  • адаптивность под мобильные устройства,
  • современное готовое решение для интернет-магазинов.

   

Реализация

Мы остановили свой выбор на готовом решении АСПРО: Максимум. Оно отлично подходит для быстрого запуска интернет-магазина.

Почему мы выбрали именно это решение?

1. Адаптивная версия «Под большой палец»

Адаптивная верстка сайта – один из самых популярных способов сделать так, чтобы сайт красиво выглядел на всех мобильных устройствах сразу. Благодаря гибкому макету адаптивный сайт корректно выводится как на смартфонах, так и на планшетах. Размер экрана при этом вообще не играет никакой роли.

Почему адаптивность необходима любому современному сайту:

  1. Текст на странице остается полностью читаемым
  2. Адаптивные изображения подстраиваются под экран
  3. Кроссбраузерность – сайт хорошо выглядит с любого браузера
  4. Повышение юзабилити – пользователям удобно пользоваться сайтом, они проводят больше на нем времени и с большей вероятность делают заказ
  5. Положительные сигналы при ранжировании в поиске
  6. Простая публикация нового контента, внедрение нового функционала и любых других изменений на сайте

Как выглядит новый сайт на разных устройствах:

2. Большой выбор элементов для оформления главной страницы

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

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

Чтобы мотивировать посетителей сайта к покупке, разместили блок с Лучшими предложениями и Акциями:

Блок «Лучшие предложения»

Блок «Лучшие предложения»


Блок «Выгодные предложения» (Акции)

Блок «Выгодные предложения» (Акции)

3. Быстрая скорость загрузки

Посетители сайта обращают внимание на скорость загрузки проекта в первую очередь. Если на телефоне сайт загружается более 3 секунд, то 53% клиентов покинет страницу. Такие данные приводит Google.

Также скорость влияет на ранжирование в поисковых системах.

За быструю загрузку в решении Аспро: Максимум отвечает технология LazyLoad. Она направлена на загрузку изображений и блоков сайта по мере просмотра. Сначала загружается только та часть, которую увидит пользователь на первом экране. А по мере пролистывания страниц – остальной контент.

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

Как мы реализовали каталог и карточки товаров на новом сайте

Каталог на старом сайте. Все разделы каталога можно было посмотреть только из меню сайта:

А сами разделы каталога товаров имели сложную и запутанную структуру:

Как выглядит каталог на новом сайте

Интуитивно понятный каталог:

Основные разделы каталога

Основные разделы каталога

Есть подразделы со списком товаров на одном экране:

Товары

Товары

Карточки товаров на старом сайте

Как таковых их не было. Вместо карточек товаров были статьи с общим описанием без конкретных характеристик и цен:

Чтобы узнать цены на товары пользователю нужно было скачать файл xls в разделе «Цены». Нужно было регулярно следить за актуальностью файла:

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

Карточки товаров на новом сайте

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

Карточка товара

Карточка товара

Для каждого товара предусмотрены вкладки:

  • описание
  • характеристики
  • отзывы
  • как купить
  • оплата
  • доставка

Товары можно добавить в Избранное или добавить в Сравнение. Также есть возможность оформить заказ по одному клику.

Товары в разделе «Сравнение»

Товары в разделе «Сравнение»

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

  • возможность внедрить промокоды

  • наглядная демонстрация выгоды от покупки:

  • умные персональные рекомендации:

Для нового сайта выбрали вид корзины «В шапке». Иконка корзины располагается в соответствующей области с правой стороны. Клик по иконке перемещает посетителя, готового оформить заказ, на страницу с выбранными товарами.

Корзина

Корзина

При оформлении заказа вся необходимая информация по выбору способа оплаты и доставке у покупателя «под рукой»:

С понятным интерфейсов в процессе оформления заказа:

Оформление заказа

Оформление заказа

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

1. Мультирегиональность» – для каждого города своя информация. Отдельное SEO-продвижение для каждого региона.

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

2. Умное SEO – широкий выбор инструментов для оптимизации сайта и привлечения трафика из органической выдачи:

Что еще интересного мы реализовали для интернет-магазина

1. Каталог выгружается на основе API системы

Чтобы выгружать большой ассортимент товаров автоматически, нам нужно было наладить выгрузку товаров из базы данных поставщика; из баз данных клиента и поставщиков. Для реализации мы использовали API – инструмент для взаимодействия нескольких программ.

Далее мы разработали личный кабинет для заказчика. При авторизации появляется функционал скачивания файлов по API.

Функционал выгрузки по API

Функционал выгрузки по API

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

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

  • 1 файл содержит полностью структуру разделов,
  • 2 файл содержит полностью все карточки товаров (около 100 000).

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

Для удобства мы настроили 3 вида выгрузки:

  • новые товары отдельно, без затрагивания старых,
  • обновление цен полностью на всю номенклатуру товаров,
  • обновление разделов – если у поставщика появились новые разделы (либо удалялись старые).

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

2. Скрипт для товаров без картинок

Для большого количества товаров пока нет картинок в карточках товаров. Мы использовали скрипт, который выводит на первые места товары, которые имеют картинки. Так разделы выглядят более наполненными, а сайт презентабельным.

Пример заполнения раздела

Пример заполнения раздела

Краткие выводы о том, чтобы было сделано

    1. Разработали интернет-магазин адаптивный под разные устройства:

       

    2. Сформирована структура сайта и заполнены разделы

    3. Оформлена главная страница

    4. Переработан каталог и настроена карточка товаров

    5. Настроена корзина и маркетинговые инструменты

    6. Настроили выгрузку каталога на основе API системы

    7. Добавлен скрипт для товаров без картинок

    8. Настроили 3 вида выгрузки товаров

Была выполнена объемная работа по созданию и настройке интернет-магазина, которую клиент высоко оценил и оставил классный отзыв:

Вы хотите быть сильнее своих конкурентов?

Обеспечим стабильный рост и развитие вашего бизнеса в Интернете!

Получить персональное коммерческое предложение

Готовы начать?

Позвоните нам:
+7 (499) 686-01-14

Или оставьте заявку на сайте
и мы свяжемся с Вами.

s

Лев?..

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

Специалисты «Веб-Центра» сильно увеличат приток клиентов и обеспечат вашему проекту мощную отдачу интернет-рекламы! ×
Наши менеджеры готовы прямо сейчас обсудить ваши задачи!
Петр

Петр

Позвоните нам или оставьте заявку на бесплатную консультацию,
мы ответим в течение 1 часа (в рабочее время) и расскажем, как мы сможем решить ваши задачи!

Обсудить задачу
СПАСИБО!

Благодарим за доверие и подписку на рассылку Веб-центра"


Будем рады видеть тебя в наших друзьях в группе VK. Там мы обсуждаем материалы и отвечаем на вопросы о продвижении в интернете.

Поздравляем!
Ваш приз: Учебник по внедрению CRM

Держи телефон рядом!
Мы позвоним и расскажем, как получить подарок!

Наш менеджер свяжется с вами и объяснит как забрать подарок
Испытайте свою удачу
Раскрутите барабан и получите приз
*вращать барабан можно только 1 раз
Отправляя форму, вы соглашаетесь на обработку персональных данных, защищенных политикой конфиденциальности и обрабатываемых для выполнения заявки.