Как мы сделали сайт для промышленного B2B и попали в ТОП-3 Яндекса — реальный кейс

Кейс: Сайт для B2B-продаж оборудования с SEO-выходом в ТОП Яндекса

Привет! На связи Азам, основатель агентства azawa.ru.

В этом кейсе покажу, как мы полностью переработали сайт компании «Ирбистех», которая продаёт оборудование для очистки сухим льдом, и за 2 месяца вывели его в топ Яндекса.

Кому лень читать — вот видео на YouTube с полным разбором (10 минут).

С чем пришёл клиент

У компании был старый сайт, сделанный на шаблонном решении. Он не соответствовал современным требованиям и плохо выполнял задачи бизнеса:

• Сайт устарел по дизайну и структуре.
• Был неудобен пользователям.
• Информация о продукции была неполной и сложной для восприятия.
• Сайт плохо индексировался поисковиками.

Какие задачи стояли перед нами:

• Полный редизайн старого шаблонного сайта.
• Современный и удобный интерфейс.
• Детальную презентацию оборудования.
• Улучшение позиций сайта в поисковых системах.
• Возможность самостоятельно управлять контентом.
• Срок реализации проекта под ключ — 3 месяца, включая аналитику, дизайн, верстку, разработку админки, SEO и полное наполнение контентом.

Что мы сделали под ключ:

• Анализ конкурентов и ЦА
• Прототипирование и дизайн 45 страниц
• Адаптивная верстка с нуля
• Кастомная админка на WordPress
• Двух-язычный сайт (RU + EN)
• SEO-оптимизация под 60+ ключей

Мудборд и концепция

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

Цвета и шрифты

Выбрали строгую и современную палитру с ярко выраженными акцентами на важные элементы. Основные цвета: синий (цвет льда), белый и графитовый. Шрифты — современные и лёгкие для восприятия.

Прототип главной страницы

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

Прототип остальных страниц

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

Разработка главной страницы

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

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

Мы разработали уникальный, современный блочный дизайн, который сочетает в себе:

• Чёткую визуальную иерархию
• Крупные акцентные блоки с большим количеством «воздуха»
• Простую навигацию и фокус на продукции
• Поддержание фирменной цветовой палитры и айдентики клиента

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

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

Видео главной страницы

Отрисовка всех страниц сайта

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

Всего было отрисовано 44 уникальных экранов, включая:

• Страницы оборудования с подробной информацией по каждой модели
• Разделы с технологией очистки
• Многоуровневую структуру под модификации
• Страницы «О компании», «Сервис», «Контакты», а также типовые страницы: 404, «Политика»
• Полноценный раздел с документацией, файлами и видеоинструкциями

Все страницы были выполнены в едином стиле, с соблюдением UI-гайдов и логики, которую мы заложили на этапе прототипирования.

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

Посмотреть визуал кейса

Кстати, если вам интересно взглянуть только на визуальную часть проекта — дизайн, прототипы, интерфейсы — можно посмотреть кейс на Dprofile по ссылке

Там же вы найдёте и другие наши работы

Верстка на чистом коде

После того как были отрисованы все 45 страниц, мы приступили к верстке.

Сайт был сверстан на чистом, семантически правильном HTML, CSS и JavaScript, без использования готовых шаблонов или конструкторов.

Мы уделили особое внимание:

• Адаптивности под все устройства
• Скорости загрузки и оптимизации медиафайлов
• Чистоте и читаемости кода
• Кроссбраузерности
• Анимациям и плавности интерфейса

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

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

Админ-панель и функциональность

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

Через админку можно легко:

• Редактировать тексты и изображения
• Добавлять и удалять страницы
• Управлять карточками оборудования и документацией
• Обновлять новости и ресурсы

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

Дополнительно мы разработали страницу с ресурсами — это статьи, документы, видео и инструкции. Фильтрация реализована на JavaScript: пользователь может сортировать материалы по категориям без перезагрузки страницы, что делает взаимодействие максимально плавным.

Такой подход не только улучшает UX, но и повышает глубину просмотра и вовлечённость на сайте.

SEO-продвижение и результат

После запуска провели базовую SEO-оптимизацию:

• Составили и внедрили семантическое ядро.
• Прописали Title и Description под ключевые запросы.
• Оптимизировали скорость загрузки и корректность отображения на всех устройствах.

Сразу после запуска сайт начал стабильно расти в поисковой выдаче. Уже в первые недели мы увидели отличную динамику:

• 20 ключевых фраз — в ТОП-1–3
• 34 ключевых фразы — в ТОП-1–10
• 14 ключевых фраз — в ТОП-11–30

Это включает высокочастотные запросы вроде: «оборудование для очистки сухим льдом», «производство сухого льда», «аппарат сухой лёд купить» и другие.

Благодаря грамотно составленной структуре, SEO-оптимизации и скорости сайта, ресурс начал приносить заявки без дополнительной рекламы.

Таймлайн проекта:

• 1. Неделя 1–2: Аналитика, структура, мудборд
• 2. Неделя 3–5: Прототипы и UX
• 3. Неделя 6–8: Дизайн всех 45 экранов
• 4. Неделя 9–11: Верстка, разработка, интеграция
• 5. Неделя 12: Наполнение и SEO

Запуск проекта — через 3 месяца после старта

Отзыв клиента

В завершение — небольшой фрагмент из благодарственного письма от заказчика:

Итог работы

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

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

Две строчки в описании результата — а сколько работы за ними стоит!

Хотите себе сайт, который будет работать на результат?