Разработка интернет-магазина с SEO-фундаментом
Разработка интернет-магазина: структура каталога, карточки, категории, формы, аналитика, скорость и SEO-шаблоны.
Открыть: Разработка интернет-магазина с SEO-фундаментомДизайн · разработка · SEO
Rock HouseРок-магазин: чистый код и рост
Перенесли большой рок-магазин с Tilda на собственный код, сохранили каталог и добавили новые пути выбора: по группе, жанру, типу товара и городу доставки. Затем связали магазин с журналом и удобной админкой.
Реальные экраны проекта · компьютер и телефон
РЕЗУЛЬТАТ ДЛЯ БИЗНЕСА
Готовая витрина для выбора и ежедневной работы
Магазин получил самостоятельную основу, где посетитель выбирает рок-атрибутику, а команда обновляет ассортимент и редакционные материалы через закрытый интерфейс.
- Каталог
- Выбор по категориям, группам и жанрам
- Покупатель может начать поиск с типа товара, исполнителя или музыкального направления.
- Журнал
- Материалы связаны с ассортиментом
- Материалы о группах, жанрах и рок-культуре продолжают знакомство с ассортиментом.
- Управление
- Закрытый кабинет для команды
- Товары, статьи, промоблоки и заказы собраны в одном интерфейсе.
ПРОЕКТ В ТРЁХ ШАГАХ
От задачи к работающему решению
- Задача
- Сохранить товары, контент и привычные адреса большого каталога, сделав выбор понятнее.
- Решение
- Перенесли витрину на собственный код, выделили категории, группы и жанры, связали каталог с журналом.
- Что получилось
- Опубликована витрина с каталогом, журналом и закрытым кабинетом для товаров и материалов.
01 / ИСТОРИЯ ПРОЕКТА
Большой ассортимент перерос прежнюю витрину
Rock House — магазин музыки, мерча, аксессуаров и украшений в Томске с доставкой по России. В исходном каталоге было более четырёх тысяч записей, а покупателю приходилось разбираться в общем ассортименте и фильтрах. Задача состояла в полноценном переносе: сохранить товары, контент и привычные адреса, перестроить выбор и подготовить сайт к дальнейшей редакционной и SEO-работе.
Сохранить характер рок-магазина. Дать покупателю точный выбор. Дать команде инструмент, которым можно управлять каждый день.
02 / ИСТОРИЯ ПРОЕКТА
Характер сцены — в интерфейсе магазина
Крупная типографика, контраст и реальные товары поддерживают характер бренда. Первый экран объясняет, что здесь можно найти; рядом появляются входы в каталог, лейблы, доставку и журнал. Категории не теряются среди баннеров, а товарная карточка связывает изображение, наличие, параметры и действие. На телефоне сохраняется тот же путь — от интереса к конкретной вещи.
03 / ИСТОРИЯ ПРОЕКТА
Что сделали
- 01
Перенесли сайт с Tilda на чистый код
Собрали самостоятельный сайт на Next.js и TypeScript с импортом и нормализацией каталога. У проекта появились собственные шаблоны, управление содержанием и контролируемые обновления. Старые товарные и контентные адреса учтены в миграции и совместимых картах сайта.
- 02
Превратили фильтры в понятные страницы выбора
Выделили самостоятельные категории товаров, страницы исполнителей и жанров. Теперь покупатель может начать с футболки, любимой группы или музыкального направления. Связанные товары и материалы ведут дальше по его интересу.
- 03
Развили доставку по России
Добавили городские страницы с условиями доставки и отобранные сочетания города с категорией. Это отдельные входы для регионального спроса; ассортимент и применимость категории учитываются при формировании страницы.
- 04
Соединили магазин и журнал
Развили интервью, рецензии и практические материалы о музыке, коллекционировании, одежде и украшениях. Из публикаций можно перейти к связанным изданиям, исполнителям и категориям. Контент помогает разобраться в выборе и вернуться в магазин.
- 05
Сделали админку для ежедневной работы
В закрытом кабинете собраны товары, статьи, промоблоки и заказы. Команда может искать и редактировать каталог, загружать изображения, готовить черновики, смотреть предпросмотр и задавать дату публикации. Для повседневного обновления контента не требуется править исходный код.
- 06
Проверили выпуск и сохранили возможность отката
Проверяли адреса, метаданные, разметку и мобильные сценарии. В релизе админки от 4 сентября прошли 347 автоматизированных тестов, проверка типов и сборка. Обновление развёрнуто с сохранением предыдущей версии.
04 / ИСТОРИЯ ПРОЕКТА
Экраны и материалы
Материалы предыдущего этапа, сентябрь 2026. Текущая главная: характер бренда, каталог и предложения.
Материалы предыдущего этапа, сентябрь 2026. Мобильный экран: предложение и переход к выбору.
Материалы предыдущего этапа, сентябрь 2026. Новый путь выбора: товары по любимой группе.
Материалы предыдущего этапа, сентябрь 2026. Журнал связывает музыкальную культуру, материалы выбора и каталог.
Материалы предыдущего этапа, сентябрь 2026. Дополнительный срез Google: 3–9 → 10–16 августа — 83 → 114 кликов и 1 369 → 1 845 показов. Это рендер сохранённой выгрузки GSC, не скриншот кабинета.
05 / ИСТОРИЯ ПРОЕКТА
Каналы и точки контакта
На сайте
Поисковые категории
Чистые адреса категорий, групп и жанров раскрывают товарный спрос и связывают его с ассортиментом.
На сайте
Журнал
Интервью, рецензии и гайды развивают интерес к музыке и помогают выбирать физические издания, мерч и аксессуары.
На сайте
Региональный поиск
Городские страницы и выбранные товарные направления объясняют получение заказа за пределами Томска.
Материалы подготовлены
Новости и социальные анонсы
Для редакционных публикаций готовятся отдельные анонсы. Их выпуск и переходы из социальных площадок проверяются по фактическим размещениям.
06 / ИСТОРИЯ ПРОЕКТА
Тот же магазин. Другой уровень подачи
Слева — сохранённый экран прежней Tilda-версии. Справа — главная после переноса, снятая 6 сентября 2026 года. Это сравнение предыдущего этапа; свежие октябрьские экраны расположены в начале кейса. Изображения можно открыть крупнее.
До: рабочая главная Tilda из аудита 10 августа 2026 года.
Главная после переноса, снимок 6 сентября 2026. Актуальный октябрьский экран показан в начале кейса.
07 / ИСТОРИЯ ПРОЕКТА
Поисковых визитов стало в 2,4 раза больше
Сравнили два полных месяца в одном счётчике Яндекс Метрики. Поисковый трафик вырос с 867 до 2 080 визитов. Общая посещаемость и число посетителей также увеличились. Ниже — реальные экраны отчёта с датами и источниками трафика.
1–31 июля → 1–31 августа 2026 · по 31 дню · Яндекс Метрика · 100% данных
- Визиты из поисковых систем
- 867→2 080
- +139,9%
- Все визиты
- 1 666→2 864
- +71,9%
- Посетители
- 1 352→2 587
- +91,3%
- Просмотры страниц
- 5 456→6 198
- +13,6%
Это динамика сайта за период работ, а не изолированный эффект одного изменения. Общие показатели включают все источники, поисковые визиты показаны отдельно. Глубина просмотра снизилась с 3,27 до 2,16, доля отказов — с 15,07% до 11,87%. Данные о выручке и оплаченных заказах в это сравнение не входят.
До: 1–31 июля 2026. 1 666 визитов, из них 867 — из поисковых систем.
После: 1–31 августа 2026. 2 864 визита, из них 2 080 — из поисковых систем.
08 / ИСТОРИЯ ПРОЕКТА
299 новых тематических страниц
Шесть направлений расширения: товарные категории, группы, жанры, рубрики журнала и два уровня региональной структуры. Считаем самостоятельные тематические страницы без карточек товаров и общих хабов. Сравнение — с URL-обходом прежнего сайта от 5 августа; новая структура сверена по проекту 6 сентября.
| Раздел | До | После | Изменение |
|---|---|---|---|
| Товарные категории | Фильтры внутри каталога | 51 страница | Самостоятельные входы: CD, винил, футболки, нашивки и другие категории. |
| Группы и исполнители | Нет отдельного раздела | 48 страниц | Metallica, Pink Floyd, AC/DC и другие группы с достаточным ассортиментом. |
| Музыкальные жанры | Нет отдельного раздела | 8 страниц | Выбор по направлению музыки с переходами к группам и товарам. |
| Рубрики журнала | Общая лента публикаций | 6 рубрик | Интервью, рецензии, музыкальная культура, одежда, коллекционирование и украшения. |
| Города доставки | Нет городских страниц | 31 город | Условия получения заказа и региональные входы. |
| Город × категория | Нет отдельных страниц | 155 страниц | Отобранные сочетания города и товарного направления. |
| Лейблы | 2 страницы лейблов | 2 профиля + общий раздел | Перестроили подачу уже существовавших направлений, не считаем их новыми темами. |
09 / ИСТОРИЯ ПРОЕКТА
Свой кабинет — для команды магазина
Чистый код не означает, что каждый текст должен менять разработчик. Для Rock House сделан закрытый кабинет: каталог, редакция и промоматериалы управляются через интерфейс. Обновление админки опубликовано и проверено 4 сентября 2026 года.
- 01
Товары и фотографии
Поиск, фильтры и страницы каталога, создание и копирование карточки, цена, наличие, остатки и характеристики. При загрузке фотографии подготавливаются в WebP.
- 02
Редакция и публикации
Черновики, предпросмотр, дата публикации, связанные товары и восстановление редакционных версий. Материал можно подготовить заранее и проверить до выпуска.
- 03
Промоблоки
Управление баннерами главной: изображения, тексты и переходы поддерживают актуальные предложения магазина.
- 04
Заказы и доступ
Для операционной работы предусмотрен раздел заказов и CRM. Кабинет требует входа и закрыт от индексации; клиентские данные не показываются в публичном кейсе.
Обзор управления: товары, материалы, баннеры и заказы. Локальная демонстрация настоящего интерфейса без клиентских данных.
Редактор материала: черновик, рубрика, предпросмотр и дата публикации. Локальная демонстрация нового материала.
ДЕТАЛИ ПРОЕКТА
Материалы и аналитика
Собственная витрина рок-магазина с маршрутами выбора, журналом и закрытым управлением контентом.
Что сделано
- Выбор
- Категории, группы и жанры
- Пути в каталоге помогают начать поиск с типа товара, исполнителя или музыкального направления.
- Контент
- Журнал связан с каталогом
- Интервью, рецензии и гайды продолжают выбор и ведут к релевантным товарам.
- Управление
- Свой кабинет магазина
- Товары, материалы, промоблоки и заказы собраны в закрытом интерфейсе для команды.
rock-house.org · снимок 3–4 октября 2026 · компьютер.
rock-house.org · снимок 3–4 октября 2026 · телефон.
Статистика за август — сентябрь 2026Все показатели, источник и условия сравнения+
В сентябре поиск остался основным источником: 1 415 визитов и 60,94 % в отчёте. При этом объём ниже августовского — это отдельный приоритет для разбора страниц и спроса.
ИсточникЯндекс Метрика · Источники трафика
Показатели за период
- Визиты за сентябрь
- 2 322
- За август: 2 864.
- Поисковые визиты за сентябрь
- 1 415
- За август: 2 080.
- Доля поиска в сентябре
- 60,94 %
- Доля визитов с определённым источником перехода.
- Изменение поисковых визитов, август → сентябрь
- −665 (−32,0 %)
- Снижение при сравнении полного августа с полным сентябрём.
10 / ИСТОРИЯ ПРОЕКТА
Следующий маршрут
- 01 / Контент
Продолжать редакционный цикл
Выпускать интервью, рецензии и материалы выбора, поддерживать связь с релизами и наличием товаров. Проверять переходы из журнала в каталог.
- 02 / Каталог
Углублять полезные страницы
Развивать страницы с реальным спросом и ассортиментом: параметры изданий, размеры одежды, отличия товаров и ответы на вопросы. Обновлять страницы по данным поисковых отчётов.
- 03 / Бизнес
Связать посещения с заказами
Сопоставлять поиск, просмотр товара, корзину и подтверждённую покупку. Следующий уровень оценки — качество заказов и вклад направлений в продажи.
11 / ИСТОРИЯ ПРОЕКТА
Магазин получил собственную основу для развития
За 80 000 ₽ подготовлен и опубликован сайт на чистом коде с админкой. SEO-ведение — 20 000 ₽ без линкбилдинга. Проект объединяет товарную витрину, редакцию, региональные страницы и управление содержанием. В сравнении июля и августа подтверждён рост поисковых визитов до 2 080; дальнейшая работа опирается на эту базу и данные магазина.
- Сайт на чистом коде
- Админка магазина
- Поиск: 867 → 2 080
- 299 тематических страниц
Связанные страницы
Что посмотреть дальше
SEO для интернет-магазина
SEO для интернет-магазина: категории, фильтры, карточки, индексация, schema, скорость, sitemap и коммерческие факторы.
Открыть: SEO для интернет-магазина
Веб-дизайн, который не ломает SEO
Веб-дизайн посадочных и сайтов услуг: первый экран, доверие, мобильная версия, кейсы, формы и конверсионная структура.
Открыть: Веб-дизайн, который не ломает SEOЗаявка
Обсудить развитие моего проекта
Коротко опишите задачу и оставьте удобный способ связи. Сайт можно не указывать, если его ещё нет.
Удобнее в Telegram? Написать ↗Что будет после заявки
- Иван, основатель Rank Craft, посмотрит задачу и свяжется с вами по оставленному контакту.
- Уточним цель и необходимые материалы. Для первого разговора пароли и доступы не нужны.
- Предложим первый шаг: бесплатный экспресс-разбор или согласованный объём работ. Состав, срок и смету зафиксируем до оплаты.
Если задача срочная, укажите желаемую дату в сообщении. Возможность и время старта подтвердим в ответе.
