Представьте: вы потратили три месяца и полмиллиона рублей на разработку сайта. Дизайн получился красивым, анимации плавными, мобильная версия отзывчивой. Сайт запустили — и тишина. Заявок нет. SEO-специалист смотрит на структуру и говорит: «Нужно переделывать». Знакомая история? К сожалению, она случается чаще, чем хотелось бы признавать.
Корень проблемы — отсутствие прототипа сайта до начала дизайна и разработки. Прототип сайта под SEO и заявки — это не наброски на салфетке и не приблизительная схема «куда что примерно поставим». Это детально проработанная коммерческая модель будущего сайта: структура страниц, логика блоков, сценарии пользователя, SEO-зоны, формы обращений, точки конверсии и перелинковка. Документ, который позволяет дизайнеру, разработчику и SEO-специалисту работать в одном направлении, а не друг против друга. Именно от того, насколько правильно спроектирован прототип, зависит, будет ли сайт продвигаться и давать заявки — или потребует дорогостоящего редизайна через полгода после запуска.
Если вы сейчас думаете о создании сайта под SEO-продвижение или планируете редизайн существующего ресурса, эта статья — ваш практический ориентир на каждом этапе проектирования.
Что такое прототип сайта
Прототип простыми словами
Прототип сайта — это схема, которая показывает: какие страницы будут на сайте, что находится на каждой из них, в каком порядке расположены блоки, где стоит форма заявки, где кнопка, где текст, где заголовок, где блок с ценами. Без цветов, без шрифтов, без картинок. Только логика, структура и функция.
Визуально прототип выглядит как набор серо-белых схем — плоских блоков с подписями: «H1», «Блок преимуществ», «Форма заявки», «Кнопка: Получить расчёт», «FAQ», «Отзывы». На профессиональном языке это называется wireframe — каркас страницы. Именно по этому каркасу дизайнер создаёт визуальный макет, а верстальщик — рабочие страницы.
Прототип существует для того, чтобы все участники разработки — заказчик, дизайнер, разработчик, SEO-специалист — видели один и тот же образ будущего сайта ещё до того, как начнётся реальная работа. Это экономит месяцы переделок и сотни тысяч рублей.
Чем прототип отличается от дизайна
Путаница между прототипом и дизайном — одна из самых частых ошибок заказчиков. Кажется, что это одно и то же, просто дизайн красивее. Но это принципиально разные документы с разными задачами.
Прототип отвечает на вопросы: что находится на странице и зачем. Дизайн отвечает на вопрос: как это выглядит. Прототип — это функциональная схема. Дизайн — визуальное воплощение этой схемы. Делать дизайн без прототипа — всё равно что строить дом без проекта: стены поднимутся, но где окна, двери, несущие конструкции — выяснится в процессе, дорогой ценой.
Хороший прототип экономит дизайнеру треть рабочего времени: не нужно думать, что куда поставить — нужно только красиво оформить уже продуманную логику. А разработчику — ещё больше: понятная структура означает предсказуемый технический результат.
Чем прототип отличается от SEO-ТЗ
SEO-ТЗ на разработку сайта — это технический документ с требованиями к структуре URL, тегам, скоростям загрузки, микроразметке, редиректам, мета-тегам и другим техническим параметрам. Он описывает, как должен быть настроен сайт с точки зрения поисковой оптимизации.
Прототип же — это визуальная схема, которая показывает что именно проектируется. SEO-ТЗ и прототип — не конкуренты, а союзники. Идеальная последовательность: сначала собирается семантика и карта посадочных страниц, затем на её основе создаётся прототип, затем к прототипу пишется SEO-ТЗ и техническое задание для разработчика. Эта цепочка исключает ситуацию, когда разработчик создаёт сайт «как получится», а SEO-специалист потом пытается вписать продвижение в чужую архитектуру.
Почему прототип нужен до дизайна и верстки
Простой аргумент: вносить правки в прототип — это час работы. Вносить те же правки в готовый дизайн — день. Переделывать в вёрстке — неделя. Исправлять после запуска — месяц и риск потери уже набранных позиций.
Прототип — самый дешёвый момент для того, чтобы сказать «здесь не так» и получить исправление без потерь. Это страховка от разработки сайта, который внешне красив, но коммерчески бессилен.
Зачем бизнесу нужен прототип сайта
Можно ли запустить сайт без прототипа? Технически — да. Тысячи сайтов запускаются именно так: «дизайнер сам придумает», «у нас есть референс», «сделайте как у конкурента». И большинство этих сайтов потом либо не продвигаются, либо не конвертируют. Либо и то, и другое одновременно.
Прагматичные причины, по которым прототип окупает себя многократно:
Согласование структуры до разработки. Вы видите полный список страниц будущего сайта, их иерархию и связи. Можно добавить забытую страницу услуги, убрать дублирующийся раздел, переосмыслить навигацию — до того, как всё это запрограммировано.
Понимание, какие страницы нужны под SEO. Сбор и кластеризация семантического ядра даёт список запросов — прототип показывает, под какие из них создаются отдельные посадочные страницы, а какие объединяются. Без этого у сайта нет SEO-архитектуры, только набор хаотичных страниц.
Проектирование пути пользователя. Воронка продаж на сайте — это не абстрактная концепция, а конкретный маршрут: откуда пришёл пользователь, что увидел первым, куда кликнул, какой блок убедил его оставить заявку. В прототипе этот маршрут проектируется заранее — шаг за шагом.
Закладывание SEO-блоков. Место под H1, зона для SEO-текста на странице категории, блок FAQ, хлебные крошки, блок перелинковки — всё это проектируется в прототипе и затем переносится в вёрстку без доработок.
Продумывание форм заявки. Где форма? Сколько полей? Что предлагает CTA? Есть ли вторичный призыв для тех, кто ещё не готов оставлять заявку? Прототип отвечает на все эти вопросы до того, как программист напишет первую строку кода.
Снижение стоимости разработки. Разработчик, работающий по чёткому прототипу, тратит на 20–40% меньше времени. Меньше вопросов — меньше правок — меньше бюджета. Это математика, а не маркетинговое обещание.
Как прототип помогает SEO
Прототип — это не просто инструмент дизайнера. Это фундамент, на котором строится SEO-продвижение. Давайте разберём конкретно, каким образом.
Помогает распределить посадочные страницы
Каждый коммерческий запрос должен иметь свою посадочную страницу. «Ремонт ванной» и «ремонт ванной под ключ» — это разные запросы с разным интентом, и под каждый в идеале нужна своя страница. Прототип показывает, как эти страницы вписываются в общую структуру сайта: какая является родительской, какие — дочерними, как они связаны навигацией.
Если структуру не спланировать заранее, часть запросов окажется без страниц, часть страниц — без запросов. Это прямые потери трафика, которые потом придётся исправлять долго и дорого.
Заранее задаёт структуру H1–H2
H1, H2, H3 — это не просто оформление текста. Это сигналы для поисковой системы о том, что является главной темой страницы, а что — подтемой. В прототипе каждый заголовок фиксируется как отдельный элемент с подписью. Дизайнер видит: «H1 — здесь», «H2 — здесь, здесь и здесь». Разработчик получает правильные теги с первого раза, без последующих правок.
Попытка внедрить правильную структуру заголовков в уже готовый сайт — болезненная операция, которая нередко ломает вёрстку. Прототип исключает такую необходимость.
Показывает места для SEO-текста
На коммерческих страницах SEO-текст нужен, но его нельзя «прилепить куда получится». У него должно быть своё место в структуре страницы: обычно в нижней части после основного контента — чтобы не мешать пользователю, но быть доступным для поисковой системы. На странице категории интернет-магазина — в начале или конце листинга. В прототипе эта зона обозначается явно: «SEO-текст, 1500–3000 символов».
Без такого планирования разработчик просто не знает, что этот блок нужен, — и не делает его. В итоге после запуска SEO-специалист просит «добавить текстовый блок», что снова стоит денег и времени.
Помогает спланировать внутреннюю перелинковку
Внутренние ссылки — один из ключевых инструментов SEO: они передают вес между страницами, помогают поисковой системе понять структуру сайта и удерживают пользователя в нужном разделе. В прототипе перелинковка видна как явные элементы: «блок похожих услуг», «раздел «Смотрите также»», «ссылки на статьи блога», «ссылка на прайс».
Если эти блоки не заложены в прототипе — они, как правило, не появятся в готовом сайте. Или появятся в последний момент, кое-как, без продуманной логики.
Снижает риск дублей и каннибализации
Дублированный контент и каннибализация семантики — типичные проблемы сайтов, сделанных без структурного планирования. Два раздела с похожими услугами, две категории с похожими товарами — и поисковая система не знает, какую из страниц показывать. Обе теряют позиции.
Прототип наглядно показывает, где могут возникнуть дубли — ещё до создания страниц. Исправить это на этапе схемы занимает минуты, а не недели переработок.
Помогает связать статьи, услуги и формы заявок
Информационный трафик из блога — ценный ресурс. Но только если статьи связаны со страницами услуг и ведут пользователя к обращению. В прототипе это связывание происходит явно: «в конце каждой статьи — блок с ссылкой на профильную услугу», «из категории блога — CTA на соответствующую страницу».
Без прототипа статьи существуют в информационном вакууме: трафик есть, переходов на услуги нет, заявок нет. Прототип — это карта, которая превращает разрозненный контент в единую воронку.
Как прототип помогает получать заявки
SEO приводит пользователя на сайт. Но заявку он оставит только тогда, когда структура страницы ведёт его к этому решению последовательно и убедительно. Именно здесь прототип становится инструментом конверсии.
Первый экран
Первый экран — это единственный шанс удержать пользователя за первые 3–5 секунд. Если за это время он не понял, куда попал и что здесь можно получить, — он ушёл. Возможно, к конкуренту.
В прототипе первый экран проектируется до пикселя по составу элементов:
- H1 — чёткое название услуги или предложения
- Подзаголовок — уточнение: для кого, что включает, в чём выгода
- УТП на сайте — одна конкретная фраза, которая отличает компанию от конкурентов
- Основная кнопка CTA — «Получить расчёт», «Оставить заявку», «Узнать стоимость»
- Вторичный элемент — номер телефона или кнопка мессенджера для тех, кто предпочитает позвонить
- Доверительный сигнал — 3–5 лет опыта, 200+ проектов, гарантия — небольшой блок прямо на первом экране
Если в прототипе первый экран содержит только красивую картинку и логотип — заявок не будет, какой бы хороший дизайн ни вышел.
Коммерческие блоки
Пользователь, который прошёл первый экран, начинает изучать страницу. Его задача — принять решение. Ваша задача — помочь ему сделать это в вашу пользу. Коммерческие блоки — это аргументы, которые снимают сомнения.
Коммерческие факторы — это то, что поисковая система тоже проверяет на коммерческих страницах. Их наличие влияет на ранжирование напрямую. В прототипе каждый из этих факторов должен быть явным элементом:
- Блок с ценами или диапазонами стоимости
- Блок этапов работ — снимает страх неизвестности
- Блок преимуществ — конкретных, а не «мы профессионалы»
- Блок гарантий — что произойдёт, если что-то пойдёт не так
- Блок кейсов — реальные примеры выполненных работ
- Блок отзывов — желательно с именами, фотографиями, ссылками
- FAQ — ответы на типичные возражения до того, как пользователь их озвучил
Каждый из этих блоков в прототипе — это конкретный прямоугольник с подписью, расположенный в определённом месте страницы. Не идея «где-то внизу добавим отзывы», а точная позиция в структуре.
Формы и CTA
Форма из SEO-трафика — это не просто поля «Имя» и «Телефон». Это продуманный коммерческий инструмент. В прототипе формы проектируются с учётом:
- Количества полей (чем меньше — тем выше конверсия, оптимум — 2–3 поля)
- Формулировки кнопки отправки (не «Отправить», а «Получить расчёт бесплатно»)
- Сопроводительного текста под кнопкой («Ответим в течение часа»)
- Расположения на странице — форма должна быть видна без прокрутки хотя бы в одном месте страницы
Внутренний CTA в статье и на страницах услуг — это не дублирование, а стратегия. CTA может встречаться трижды: на первом экране, в середине страницы (после блока преимуществ или цен) и в конце. Пользователи принимают решение в разные моменты — и каждый из CTA работает для своей аудитории.
Квиз (пошаговый опросник) и калькулятор — продвинутые инструменты, которые в прототипе обозначаются как отдельные блоки. Они снижают барьер обращения: вместо «оставьте заявку» предлагают «узнайте стоимость», что психологически легче для пользователя.
Доверие
Доверие — фундамент конверсии. Пользователь не оставит заявку компании, которой не доверяет, каким бы убедительным ни был текст. Блоки доверия в прототипе:
- Реальные отзывы с именами и, по возможности, ссылками на источник
- Сертификаты, лицензии, членство в ассоциациях
- Фотографии команды — люди доверяют людям, а не логотипам
- Портфолио и кейсы с конкретными цифрами
- Юридические реквизиты — особенно важно для B2B
- Счётчики: «N лет на рынке», «N выполненных проектов», «N клиентов»
В прототипе UX сайта — это не абстракция, а конкретная расстановка элементов доверия в точках, где пользователь чаще всего колеблется: перед формой заявки, после блока с ценами, в подвале страницы.
Что должно быть в прототипе страницы услуги
Страница услуги — главная конверсионная страница коммерческого сайта. SEO-продвижение сайта услуг начинается именно здесь: пользователь, пришедший по коммерческому запросу, попадает на эту страницу и принимает решение об обращении.
| Блок | Задача |
|---|---|
| Первый экран (H1 + оффер + CTA) | Сразу объяснить услугу и предложить действие |
| Проблема клиента | Показать, что компания понимает задачу |
| Решение | Объяснить услугу простыми словами, без жаргона |
| Этапы работ | Снять страх неопределённости, показать процесс |
| Цена / факторы цены | Усилить коммерческий интент, ответить на «сколько стоит» |
| Кейсы / примеры | Повысить доверие через реальные результаты |
| Преимущества | Конкретные отличия от конкурентов |
| Отзывы | Социальное доказательство |
| FAQ | Закрыть типичные возражения |
| Форма заявки | Перевести пользователя в обращение |
| SEO-текст | Усилить релевантность страницы для поиска |
| Блок перелинковки | Связать услугу со статьями и смежными разделами |
Обратите внимание: блок «Проблема клиента» — это не банальность. Это мощный психологический инструмент: пользователь видит, что компания понимает его ситуацию, а не просто продаёт услугу. Это снижает психологическое сопротивление и создаёт ощущение диалога.
Этапы работ — тоже не проформа. Большинство пользователей боятся непредсказуемости: «А вдруг начнут, а потом бросят?», «Как это вообще происходит?». Блок с чёткими этапами и временными рамками снимает эти страхи лучше, чем любые слова о профессионализме.
В прототипе страницы услуги все перечисленные блоки присутствуют как отдельные секции с подписями, расположенные в логической последовательности. Дизайнер получает не свободу фантазии, а чёткое задание: вот что здесь должно быть, вот в каком порядке, вот каков смысловой вес каждого блока.
Прототип интернет-магазина
Для интернет-магазина прототипирование — ещё более критичная задача, чем для сайта услуг. Здесь архитектура каталога напрямую влияет на способность сайта ранжироваться по тысячам запросов. SEO-продвижение интернет-магазина с большим каталогом невозможно без чётко спроектированной структуры с самого начала.
Структура каталога. В прототипе каталог — это не просто список категорий. Это иерархия с чётко определёнными уровнями: главная → раздел → категория → подкатегория → карточка товара. Каждый уровень имеет свои SEO-задачи и свои конверсионные блоки.
Страница категории. На ней должны быть: заголовок с ключевым запросом (H1), фильтры и сортировка, листинг товаров с корректным отображением цены и кнопки «В корзину», SEO-текст (в начале или конце страницы), FAQ по теме категории, хлебные крошки для навигации и SEO, блок перелинковки на смежные категории.
В прототипе страница категории — это полноценная схема с 8–12 блоками, а не просто «здесь будет список товаров». Именно эта детализация позволяет SEO-продвижению интернет-магазина работать по широкому семантическому ядру.
Карточка товара. Один из самых недооценённых типов страниц. Прототип карточки включает: фотогалерею с подписями (alt-текст — SEO-задача), блок с ценой и кнопкой «В корзину», блок характеристик, вкладку с описанием (SEO-текст), раздел отзывов, блок «С этим товаром покупают», хлебные крошки, микроразметку Product/Offer.
Страницы фильтров. Фильтрация — мощнейший источник низкочастотного трафика. «Диваны угловые синие» или «смартфоны 256 ГБ до 30 000 рублей» — это запросы с чёткой коммерческой интентцией. В прототипе страницы фильтров проектируются как самостоятельные посадочные страницы с уникальным H1 и мини-текстом, а не просто технические страницы пагинации.
Корзина и оформление заказа. В прототипе эти страницы прорабатываются с точки зрения конверсии воронки: что видит пользователь в корзине, насколько просто перейти к оформлению, сколько шагов до завершения покупки, есть ли возможность оформить заказ без регистрации. Каждый лишний шаг в оформлении заказа — это потеря части покупателей.
Блоки доставки и оплаты. На страницах категорий и в карточке товара должны быть видны условия доставки и способы оплаты. Это коммерческие факторы, которые проверяет Яндекс при ранжировании коммерческих страниц. Если их нет — сайт теряет позиции.
SEO-зоны в категориях. В прототипе для каждой категории обозначается зона размещения SEO-текста: обычно после листинга товаров. Это позволяет писать тексты для категорий без привязки к дизайну — достаточно знать, что блок есть и где он находится.
Прототип сайта в Figma
Figma стала стандартом индустрии для создания прототипов сайтов — и не случайно. Это облачный инструмент, который работает в браузере, не требует установки и позволяет одновременно работать с файлом нескольким участникам команды.
Почему Figma удобна для согласования
Ссылка на файл в Figma — это живой документ. Заказчик открывает её в браузере на любом устройстве, видит актуальную версию прототипа, оставляет комментарии прямо на макете. Не нужно пересылать PDF-файлы, договариваться о встречах, объяснять «вот тот блок справа вверху» — всё доступно онлайн, всё наглядно.
Для согласования прототипа сайта в Figma создаются отдельные страницы под каждый тип страниц сайта: главная, услуга, категория, карточка, контакты, статья. Каждая страница — полноценный wireframe с подписями всех элементов.
Что такое кликабельный прототип
Кликабельный прототип — это следующий уровень после статичного wireframe. В нём блоки связаны между собой переходами: кликаешь на кнопку — открывается следующий экран, нажимаешь в меню «Услуги» — попадаешь на страницу услуги. Это имитация реального поведения сайта, которая позволяет протестировать сценарии пользователя до начала разработки.
Кликабельный прототип особенно ценен в двух случаях: когда нужно проверить воронку продаж на сайте — пройти путь пользователя от первого экрана до формы заявки, — и когда нужно согласовать логику с заказчиком, который лучше понимает интерактив, чем статичные схемы.
Какие размеры экранов учитывать
В Figma прототип создаётся под несколько разрешений:
- Desktop: 1440px — стандартный экран ноутбука или монитора
- Tablet: 768px — планшет
- Mobile: 375px — экран смартфона (iPhone SE / стандарт)
Мобильная версия — не адаптация десктопного прототипа, а самостоятельная схема. На мобильном устройстве меняется всё: навигация становится бургер-меню, блоки перестраиваются в одну колонку, формы упрощаются, CTA становится фиксированным внизу экрана. Проектировать мобильный прототип отдельно — это не лишняя работа, это защита от ситуации, когда «на телефоне всё сломалось».
Что отдавать дизайнеру, верстальщику и SEO-специалисту
После согласования прототипа каждый участник разработки получает свою версию документа:
Дизайнер получает wireframes в Figma с комментариями о функции каждого блока. Его задача — создать визуальный стиль, сохранив структуру и порядок блоков.
Верстальщик получает готовый дизайн на основе прототипа, в котором уже прописаны все SEO-теги, структура заголовков, атрибуты изображений. В идеале — отдельное техническое задание с требованиями к вёрстке.
SEO-специалист получает прототип на ранней стадии — и это принципиально важно. Именно SEO-специалист должен проверить: все ли посадочные страницы на месте, правильно ли расставлены заголовки, есть ли зоны для текста, заложены ли блоки FAQ и перелинковки. Согласование прототипа с SEO-специалистом до начала дизайна — это редизайн сайта без потери SEO-позиций в качестве стандарта, а не исключения.
Сколько стоит прототип сайта
Цена прототипа сайта зависит от множества переменных — и понимать их заранее важно, чтобы бюджет не стал сюрпризом.
Тип сайта. Прототип лендинга — от 5 000 до 15 000 рублей. Прототип корпоративного сайта на 10–20 страниц — от 20 000 до 60 000 рублей. Прототип интернет-магазина с каталогом, фильтрами, карточками и воронкой заказа — от 40 000 рублей и выше.
Количество страниц. Чем больше уникальных типов страниц — тем выше стоимость. Главная, страница услуги, страница категории, карточка товара, статья блога, страница контактов — это шесть разных wireframes. Если добавляются страницы филиалов, страницы акций, отдельные лендинги под услуги — количество страниц растёт.
SEO-структура. Если в прототип включается проектирование посадочных страниц на основе семантики — это дополнительная аналитическая работа. Стоимость прототипа с SEO-проектированием выше, но окупается тем, что сайт не придётся переделывать после запуска.
Мобильная версия. Отдельный прототип для мобильного устройства — дополнительный объём работы. Обычно добавляет 30–50% к стоимости десктопной версии.
Кликабельность. Кликабельный прототип в Figma с настроенными переходами стоит дороже статичного wireframe. Но для сложных сайтов с нелинейной навигацией — это необходимость, а не опция.
Формы и сценарии заявок. Проектирование форм с разными состояниями (пустая, заполненная, ошибка, успех), квизов, калькуляторов — это отдельная задача, которая влияет на итоговую стоимость.
ТЗ для дизайнера и разработчика. Если к прототипу готовится сопроводительная документация — технические требования, описание логики, требования к вёрстке, SEO-ТЗ — это дополнительный объём работы аналитика.
| Тип задачи | Ориентировочная стоимость |
|---|---|
| Прототип лендинга (1 страница, desktop) | от 5 000 ₽ |
| Прототип сайта услуг (5–10 страниц) | от 20 000 ₽ |
| Прототип + SEO-структура + мобайл | от 35 000 ₽ |
| Прототип интернет-магазина | от 50 000 ₽ |
| Кликабельный прототип корпоративного сайта | от 40 000 ₽ |
Создание прототипа сайта — это инвестиция, которая окупается снижением стоимости разработки, отсутствием переделок после запуска и тем, что продвижение сайта под заявки начинается с правильной базы, а не вопреки структурным ошибкам.
Ошибки при создании прототипа сайта
Плохой прототип — это почти то же самое, что его отсутствие. Вот типичные ошибки, которые убивают и SEO, и конверсию.
Начинать с красивого дизайна без структуры. Дизайнер рисует привлекательный макет, заказчик восхищается, разработчик верстает. А потом выясняется, что структура не соответствует SEO-требованиям, формы расположены неудобно, а ключевые блоки отсутствуют. Переделки обходятся дороже, чем вся первоначальная разработка.
Не учитывать SEO-страницы. Прототип сделан для главной и трёх услуговых страниц, а потом SEO-специалист говорит, что нужно ещё 15 посадочных страниц под региональные и услуговые запросы. Архитектура сайта не рассчитана на такое расширение.
Не закладывать блоки под ключевые запросы. На странице нет зоны для SEO-текста, нет FAQ, нет блока H2 под вторичные запросы. Добавить их потом — это переделывать вёрстку.
Забывать про CTA. Страница услуги без явного призыва к действию — это страница-рассказчик, а не страница-продавец. Пользователь изучил информацию и… ушёл, потому что не понял, что нужно сделать дальше.
Делать форму заявки только внизу страницы. 70% пользователей не доскролливают коммерческую страницу до конца. Единственная форма внизу означает, что 70% трафика уходит без возможности обратиться.
Не проектировать мобильную версию. По данным Яндекс.Метрики, на большинстве коммерческих сайтов доля мобильного трафика превышает 60%. Прототип только для десктопа означает, что больше половины пользователей получат непродуманный интерфейс.
Не продумывать перелинковку. Статьи существуют отдельно от услуг. Категории не связаны с похожими разделами. Карточки товаров не ведут на смежные категории. В итоге сайт — это набор изолированных страниц, а не связанная экосистема.
Смешивать разные услуги на одной странице. «Ремонт квартир, офисов и загородных домов» — это три разных запроса с тремя разными аудиториями. Одна страница на все три темы не ранжируется ни по одной из них нормально.
Не учитывать цену и коммерческие факторы. Прототип без блока «цены» или «факторы стоимости» — это прямой путь к низкой конверсии. Пользователь не хочет звонить, чтобы узнать цену. Он хочет понять диапазон ещё на странице — и только потом решить, стоит ли обращаться.
Не согласовывать прототип с SEO-специалистом. Прототип согласован заказчиком и дизайнером — но не SEO-специалистом. В итоге запускается сайт с красивой, но непродвигаемой структурой. Исправить это без переделки болезненно и дорого.
Когда стоит заказать прототип сайта
Вопрос не в том, нужен ли прототип — он нужен всегда. Вопрос в том, осознаёте ли вы это до начала разработки или после её завершения.
Сайт запускается с нуля. Это идеальный момент: нет никаких ограничений существующей структуры. Прототип создаётся с чистого листа, под конкретную семантику и конкретные бизнес-задачи.
Планируется редизайн. Редизайн сайта без потери SEO-позиций возможен только при тщательном проектировании новой структуры с учётом текущих позиций. Прототип позволяет сохранить всё, что работает, и улучшить то, что не работает.
Нужно сделать сайт под SEO. SEO-структура закладывается на этапе прототипирования, а не добавляется потом. Создание сайта под SEO-продвижение без прототипа — это строительство без проекта.
Есть трафик, но нет заявок. Причина часто в структуре страниц: нет правильных блоков, нет CTA в нужных местах, нет форм в зоне видимости. Прототип для редизайна конверсионных страниц решает эту задачу.
Текущая структура сайта хаотичная. Страницы добавлялись по мере необходимости, логика не прослеживается, пользователь не понимает, куда идти. Прототипирование с нуля — это сброс и перезапуск.
Нужно запустить новые услуги. Новые услуговые страницы должны вписываться в существующую структуру — или структуру нужно пересматривать. Прототип показывает, как это сделать без ущерба для действующих страниц.
Интернет-магазин расширяет каталог. Новые категории, подкатегории, фильтры — всё это требует спроектированной архитектуры, иначе каталог превращается в лабиринт без навигации и SEO-логики.
Подрядчик просит ТЗ на дизайн и разработку. Прототип — это и есть основа ТЗ. Дизайнер и разработчик работают не с описанием словами, а с наглядной схемой.
Бизнес хочет избежать переделок после запуска. Это, пожалуй, самый убедительный аргумент: правки в прототипе стоят в 10–20 раз дешевле, чем те же правки в готовом сайте.
FAQ
Что такое прототип сайта?
Прототип сайта — это схема будущих страниц: структура, блоки, логика, CTA, формы, навигация, перелинковка и путь пользователя. Он создаётся до дизайна и разработки и показывает, как сайт будет работать на практике — без цветов, шрифтов и изображений.
Сколько стоит прототип сайта?
Стоимость прототипа сайта зависит от его типа, количества страниц, глубины SEO-проектирования, наличия мобильной версии, кликабельности, сложности форм и каталога. Прототип лендинга — от 5 000 рублей, корпоративного сайта — от 20 000 рублей, интернет-магазина — от 50 000 рублей.
Чем прототип отличается от дизайна?
Прототип — это структура и логика страницы, дизайн — её визуальное оформление. Прототип отвечает на вопросы «что здесь?» и «зачем?», дизайн — на вопрос «как это выглядит?». Правильный порядок: сначала прототип, потом дизайн.
Зачем прототип нужен для SEO?
Прототип позволяет заранее заложить все SEO-элементы: посадочные страницы, структуру H1–H2, зоны для SEO-текста, FAQ, блоки перелинковки, хлебные крошки, микроразметку. Это исключает необходимость дорогостоящей переработки структуры после запуска.
Можно ли делать сайт без прототипа?
Технически — да. Но это означает принять риск структурных ошибок, слабой конверсии и плохого SEO. Большинство сайтов, которые «красиво сделали, но не работает», запускались без прототипирования.
Что входит в прототип коммерческой страницы?
Первый экран с H1, оффером и CTA, блок проблемы и решения, этапы работ, цены, кейсы, преимущества, отзывы, FAQ, форма заявки, SEO-текстовая зона, блок перелинковки. Каждый элемент обозначен явно с описанием функции.
Как прототип помогает получать заявки?
Прототип позволяет заранее продумать первый экран, расположение форм, количество и место CTA, блоки доверия, путь пользователя от первого касания до заявки. Это превращает сайт из информационного ресурса в коммерческий инструмент.
Нужно ли делать мобильный прототип?
Обязательно. Более 60% трафика на большинстве коммерческих сайтов — мобильный. Мобильный прототип — это самостоятельная схема с адаптированной навигацией, упрощёнными формами и фиксированным CTA.
В какой программе делать прототип сайта?
Отраслевой стандарт — Figma. Это облачный инструмент, доступный в браузере, с возможностью совместной работы, комментирования и создания кликабельных переходов между экранами.
Когда лучше заказать прототип: до SEO-ТЗ или после?
Параллельно или чуть позже сбора семантики. Идеальная последовательность: семантическое ядро → карта посадочных страниц → прототип → SEO-ТЗ → дизайн → разработка. Прототип создаётся на основе семантики, SEO-ТЗ создаётся на основе прототипа.
