1 + 1 = 1: объединяем интернет-магазин и сайт «Меликонполар»

14 января 2016 → Веб-разработка, Корпоративные сайты, Интернет-магазины

«Меликонполар» — чарующее, мягко перекатывающееся во рту слово.

meliconpolar.ru

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

1 + 1 = 1: объединяем интернет-магазин и сайт «Меликонполар» - 1

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

Бэкграунд

С «Меликонполар» мы работаем почти 10 лет.

2008 год

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

1 + 1 = 1: объединяем интернет-магазин и сайт «Меликонполар» - 2

2013 год

В 2013-м команда «Меликонполар» решила продавать свою продукцию через интернет. На этой стадии развития от нас требовалось разработать интернет-магазин тротуарной плитки. Сайт имел адрес shop.meliconpolar.ru, но сейчас того дизайна не увидеть, потому что настроен редирект на текущий адрес.

Вот как выглядел тот интернет-магазин:

1 + 1 = 1: объединяем интернет-магазин и сайт «Меликонполар» - 3

2015-2016 годы

В 2015-м были небольшие редизайны. А в 2016-м было принято решение объединить интернет-магазин и сайт компании в один на текущем домене. По сути задачей было слить воедино презентационный и коммерческий компоненты.

Большое объединение

Итак, как мы объединяли сайты?

Программную часть не писали с нуля. Сосредоточились на двух подзадачах:

Взять за основу интернет-магазин shop.meliconpolar.ru и сделать его редизайн.
Добавить в структуру сайта следующие разделы:

о компании
вакансии
контакты
специальные предложение
карта строительных материалов
специалистам
услуги по строительству

Что включал в себя редизайн?

Разработку новых дизайн-макетов:
- главной страницы,
- списка товаров,
- карточки товара,
- корзина,
- оформление заказа,
- текстовые страницы.

В новой концепции дизайна мы использовали цветовые решения, взятые со старого сайта, а также увеличили ширину сайта с 1000px до 1280px.

1 + 1 = 1: объединяем интернет-магазин и сайт «Меликонполар» - 4

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

Сложности

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

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

Результаты

В схватке «Айтроник» vs проблемы победил «Айтроник». Результатом этого стал обновленный сайт meliconpolar.ru. Теперь он выполняет и продающую, и презентационную функцию. Как понимаете, иногда бывает, что 1 + 1 = 1.

Со всеми этапами мы справились за 5 недель. Это вписывается в норму для работ такого уровня сложности.

Наталья Воропаева, менеджер проекта: «Важный момент! После обновления нужно было сохранить структуру сайта www.meliconpolar.ru, в особенности URL-адреса страниц, которые продвигались в поисковых системах. Нам удалось справиться с этой задачей, и позиции в поисковиках после обновления не изменились. Это тот редкий случай, когда отсутствие изменений – это круто.»