На момент старта проекта сайт содержал большой массив материалов, структура и визуальная подача которого формировались постепенно и не обеспечивали удобного пути к продукции и документации. Клиент подготовил новый дизайн-макет, но он содержал не все важные страницы, из-за чего между визуальной концепцией и реальной логикой сайта оставались пробелы. Наша задача заключалась в том, чтобы аккуратно объединить существующую структуру с обновленным дизайном.
В основе стратегии было работать не с готовым шаблоном, а с индивидуальным решением на базе дизайн-макета клиента, сохранив привычную структуру сайта и улучшив удобство его использования. Поэтому мы построили процесс как последовательную сборку:
В начале работы мы собрали и зафиксировали фактическую структуру сайта, чтобы при переходе на новый дизайн не потерять привычные для пользователей сценарии.
Структуру детально проработали с учетом SEO: уточнили названия разделов, уровни вложенности и точки входа, чтобы ключевые страницы совпадали с основными поисковыми запросами и могли продвигаться как приоритетные.
Структура сайта
Старая версия прайс-листа требовала нескольких переходов и не давала пользователю быстро получить доступ к нужным позициям. Мы переработали структуру и подготовили новый макет, сократив путь к прайсу до одного клика и сделав подачу информации более удобной.
Прайс-лист до
Прайс-лист после
Для каталога с большим количеством позиций важно, чтобы переход от общих разделов к конкретным товарам был понятным. Поэтому на примере раздела «Измерительные системы объемно-массового учета» мы подготовили макет второго уровня, который стал опорным шаблоном для подобных страниц.
Что мы сделали?
Собрали страницу, где сверху пользователь видит название и описание группы оборудования, а ниже список доступных позиций, оформленный по единому принципу. Это позволяет поддерживать порядок в каталоге и легко масштабироваться без доработки дизайна.
Зачем это нужно?
Такой подход задает стандарт для всех разделов второго уровня, и тем самым упрощает дальнейшее наполнение и помогает пользователю быстрее ориентироваться в продуктах внутри выбранного направления.
Макет страницы второго уровня по вложенности 
Карточки являются одним из самых содержательных блоков на сайте, поэтому мы их значительно доработали. В старой версии сайта структура могла отличаться от товара к товару, информация была размечена без единого принципа. Новая карточка получила четкую и повторяемую структуру, которую можно масштабировать на абсолютно весь ассортимент.
Как мы доработали карточку:
До:
После:
Главная страница должна сразу объяснять, чем занимается компания и куда двигаться дальше. В исходном макете этот блок отсутствовал, поэтому мы добавили информативный раздел «О компании», чтобы усилить первое впечатление и дать пользователю четкую точку входа.
Итоговый вид главной страницы
Часть изменений мы показали на примерах прайс-листа, каталога и карточек, но проект затронул и другие разделы. На этом этапе мы собрали и адаптировали страницы, которые не попали в отдельные блоки реализации, чтобы новый дизайн и структура работали последовательно по всему сайту.
Мы привели сайт к состоянию, в котором им действительно удобно пользоваться. Главное, что изменилось: сайт наконец стал предсказуемым для пользователя и управляемым для тех, кто с ним работает.
Теперь у проекта есть четкая структура, единый визуал и шаблоны для ключевых типов страниц. Это дало ощущение стабильности и избавило от хаотичного роста, так как теперь сайт можно обновлять и расширять без риска потерять порядок или поломать интерфейс.
Фактически клиент получил платформу, на которую можно опираться и для ежедневной работы, и для развития компании онлайн.
Отзыв клиента
