Этапы разработки сайта: от брифа до запуска
Этапы разработки сайта по порядку: бриф, семантика, прототип, дизайн, вёрстка, наполнение, SEO, тесты и запуск. Что делает студия, что заказчик и что на выходе.
Разработка сайта проходит десять этапов: бриф, анализ ниши и семантика, структура и прототип, дизайн, вёрстка и программирование, наполнение, SEO-настройка, тестирование, запуск и поддержка. Порядок важнее скорости: структура должна появиться до дизайна, тексты — до вёрстки, а SEO закладывается с первого этапа, иначе после запуска сайт придётся переделывать. Ниже по каждому этапу — что делает студия, что делаете вы и что получаете на выходе.
Почему порядок этапов имеет значение
Сайт можно сделать «с конца»: нарисовать красивый первый экран, сверстать, а потом думать, что писать и какие страницы нужны. Так делают часто, и результат предсказуем: дизайн не вмещает реальные тексты, под важные запросы нет страниц, а при переезде со старого сайта теряется накопленный поисковый трафик. Каждый этап ниже отвечает на вопрос, без ответа на который следующий этап делается наугад.
1. Бриф
Что делает студия. Проводит созвон или встречу, задаёт вопросы о бизнесе, клиентах, конкурентах, целях сайта, сроках и бюджете. Смотрит текущий сайт, если он есть: что работает, откуда приходят заявки, какие страницы в поиске.
Что делает заказчик. Рассказывает, кто покупает и почему, какие услуги или товары приоритетны, что не нравится в текущем сайте, какие сайты нравятся и чем. Даёт доступ к Метрике и Вебмастеру, если они есть.
На выходе. Заполненный бриф и общее понимание задачи. Если проект большой, из брифа вырастает техническое задание — о том, как его составить, мы писали в статье ТЗ на разработку сайта.
2. Анализ ниши и семантика
Что делает студия. Изучает сайты конкурентов из выдачи: какие у них разделы, как подают цены, что есть на страницах услуг. Собирает запросы, по которым ищут ваши услуги или товары, группирует их по смыслу.
Что делает заказчик. Подтверждает, какие направления действительно важны, и отсекает то, чем компания не занимается.
На выходе. Список групп запросов и понимание, какие страницы нужны сайту. Этот этап часто пропускают, и зря: именно он определяет, сможет ли сайт получать поисковый трафик после запуска.
3. Структура и прототип
Что делает студия. Строит карту сайта: разделы, страницы, их вложенность и адреса. Потом рисует прототип — схему страниц без дизайна: какие блоки, в каком порядке, где кнопки, формы, цены, отзывы.
Что делает заказчик. Проверяет, что в структуре есть все услуги и товары, что в прототипе есть всё, что спрашивают клиенты перед покупкой. Правки на этом этапе стоят дёшево, потому что двигаются серые прямоугольники, а не готовый дизайн.
На выходе. Утверждённая структура с адресами страниц и прототипы ключевых шаблонов. Подробнее о том, зачем нужен прототип и как его согласовывать, — в статье прототип сайта: что это.
4. Дизайн
Что делает студия. Разрабатывает визуальный стиль и макеты страниц на основе прототипа: главная, раздел, карточка услуги или товара, статья, контакты. Обязательно — мобильные версии, потому что большая часть посетителей приходит с телефона.
Что делает заказчик. Даёт логотип, фирменные цвета, шрифты, фотографии. Оценивает макеты с точки зрения клиента: понятно ли с первого экрана, чем занимается компания и как связаться.
На выходе. Утверждённые макеты для десктопа и телефона и набор элементов (кнопки, формы, карточки), из которых собираются все страницы.
5. Вёрстка и разработка
Что делает студия. Превращает макеты в работающий сайт: вёрстка, адаптивность, формы, каталог, фильтры, корзина, админка, интеграции с CRM или 1С. Выбирает платформу под задачу — конструктор, CMS или собственный код.
Что делает заказчик. Даёт доступы к сервисам, которые нужно подключить: CRM, телефония, платёжная система, доставка. Отвечает на уточняющие вопросы по логике работы.
На выходе. Рабочая версия сайта на тестовом адресе, закрытая от индексации, с админкой, в которой вы сами можете менять тексты, цены и товары.
6. Наполнение
Что делает студия. Пишет или редактирует тексты под запросы каждой страницы, заводит карточки товаров и услуг, обрабатывает и сжимает фото, переносит материалы со старого сайта.
Что делает заказчик. Даёт факты: цены, сроки, условия, гарантии, фото работ, сертификаты, отзывы, описания товаров. Проверяет тексты на точность.
На выходе. Наполненный сайт, где на каждой странице есть ответ на вопрос клиента, цена или вилка цен и понятный следующий шаг. Именно на этом этапе проекты чаще всего застревают, поэтому сбор материалов лучше начинать параллельно с дизайном.
7. SEO-настройка
Что делает студия. Прописывает title, description и H1 для всех страниц, настраивает микроразметку (организация, товары, услуги, хлебные крошки, вопросы и ответы), генерирует sitemap.xml, настраивает robots.txt и канонические адреса. Если сайт переезжает со старой версии, составляет таблицу соответствия старых и новых адресов и настраивает 301-редиректы.
Зачем нужна разметка и какие её типы бывают, мы разбирали в статье про микроразметку Schema.org.
Что делает заказчик. Ничего сложного: подтвердить, что старые адреса, которые приносили клиентов, учтены.
На выходе. Сайт, который поисковик сможет правильно прочитать с первого дня, и сохранённый трафик старых страниц. Что ещё проверить при переезде, мы собрали в статье редизайн без потери позиций.
8. Тестирование
Что делает студия. Проверяет сайт на разных телефонах и браузерах, измеряет скорость загрузки, отправляет все формы и проверяет, что заявки доходят, настраивает и проверяет цели в Метрике, ищет битые ссылки, ошибки ответа сервера и пустые страницы.
Что делает заказчик. Проходит сайт глазами клиента: находит нужную услугу, оставляет заявку, оформляет тестовый заказ, звонит по номеру с сайта.
На выходе. Список найденных ошибок, исправленный до запуска, и цели, которые будут считать заявки с первого дня.
9. Запуск
Что делает студия. Переносит сайт на рабочий домен, настраивает DNS и HTTPS, снимает запрет индексации, проверяет редиректы на живом адресе, добавляет сайт в Яндекс Вебмастер, отправляет sitemap и уведомляет поисковики о новых страницах через IndexNow.
Что делает заказчик. Даёт доступ к домену или меняет DNS-записи по инструкции.
На выходе. Работающий сайт на вашем домене, с вашими доступами к админке, хостингу, Метрике и Вебмастеру.
10. Поддержка
Что делает студия. Первые недели после запуска следит за индексацией и ошибками в Вебмастере, исправляет найденное, обновляет движок и модули, делает резервные копии, вносит доработки.
Что делает заказчик. Обновляет цены, добавляет новые работы и товары, пишет о проблемах, которые замечают клиенты.
На выходе. Сайт, который не устаревает через год. Техподдержка у нас стоит от 10 000 ₽ в месяц.
Что вы получаете на каждом этапе: сводная таблица
| Этап | Результат | Кто утверждает |
|---|---|---|
| Бриф | Заполненный бриф, при необходимости ТЗ | Заказчик |
| Анализ ниши и семантика | Группы запросов, список нужных страниц | Заказчик |
| Структура и прототип | Карта сайта с адресами, прототипы шаблонов | Заказчик |
| Дизайн | Макеты для десктопа и телефона | Заказчик |
| Вёрстка и разработка | Рабочая версия на тестовом адресе, админка | Заказчик после демонстрации |
| Наполнение | Тексты, карточки, фото на всех страницах | Заказчик проверяет факты |
| SEO-настройка | Метатеги, микроразметка, sitemap, robots.txt, таблица редиректов | Студия |
| Тестирование | Исправленные ошибки, работающие формы и цели | Студия и заказчик |
| Запуск | Сайт на домене, HTTPS, Вебмастер, IndexNow | Студия |
| Поддержка | Мониторинг, обновления, доработки | По договору |
Как заказчику не затянуть проект
Большая часть задержек в разработке связана с согласованиями и материалами. Несколько простых правил заметно экономят время.
- Назначьте одного ответственного. Когда макет согласуют директор, маркетолог и собственник по очереди и с противоречивыми правками, этап растягивается в разы. Один человек собирает мнения внутри компании и передаёт студии итоговый список.
- Собирайте материалы заранее. Фото работ, цены, условия, сертификаты, отзывы можно начать готовить сразу после брифа. К этапу наполнения они должны лежать в одной папке.
- Давайте правки списком. Одно письмо со всеми замечаниями по макету проще и быстрее, чем десять сообщений в мессенджере в течение недели.
- Не возвращайтесь к утверждённым этапам без причины. Изменение структуры после готового дизайна тянет за собой переделку макетов и вёрстки. Если без этого нельзя, лучше сказать сразу и обсудить, как это повлияет на смету.
- Проверяйте тестовую версию сами. Студия проверит формы и скорость, но только вы знаете, правильно ли указаны цены и условия.
Как понять, что студия не пропускает этапы
Перед договором спросите, какие материалы вы получите на каждом этапе, и попросите показать примеры из прошлых проектов. Вот что должно насторожить:
- Первым делом предлагают выбрать дизайн из шаблонов, а о структуре и запросах никто не спрашивает.
- В коммерческом предложении нет ни прототипа, ни SEO-настройки, ни тестирования.
- Про переезд со старого сайта и сохранение адресов не говорят, пока вы сами не спросите.
- Доступы к хостингу, домену и админке оформляются на студию, а не на вас.
- Метрику и Вебмастер предлагают подключить «потом».
Частые ошибки при разработке сайта
Дизайн до структуры
Сначала рисуют красивую главную, потом выясняется, что услуг двенадцать, а в меню помещается пять, и что для каждой услуги нужна своя страница. Дизайн переделывают или, что хуже, всё сводят на одну длинную страницу, которая не выходит в поиске ни по одному запросу.
Тексты в последний момент
Сайт сверстан, а текстов нет. Их пишут за пару дней, «чтобы было», или вставляют заглушки. Итог — страницы без цен, условий и фактов, которые не убеждают ни клиента, ни поисковик. Материалы нужно собирать параллельно с дизайном.
SEO не заложено на старте
Адреса страниц придуманы без учёта запросов, заголовки сделаны картинками, нет страниц под важные направления. После запуска всё это приходится исправлять, часто с переделкой шаблонов.
Переезд без редиректов
Старый сайт удаляют, новый запускают с другими адресами. Страницы, которые были в поиске, начинают отдавать ошибку 404, и накопленный трафик пропадает. Поисковику нужно время, чтобы найти и оценить новые страницы, а клиенты в это время уходят к конкурентам.
Нет целей в Метрике
Сайт запущен, а сколько он приносит заявок, неизвестно. Через полгода невозможно понять, окупился ли он.
Пример: как мы перенесли магазин Айцех
Айцех — магазин оригинальной техники Apple в Нижнем Новгороде. Раньше у него был сайт на Тильде, который получал 5–10 визитов в сутки, почти все — по названию магазина. В карте сайта было 34 страницы и ни одного товара, а товары жили на адресах вида /tproduct/232076750692-…, которые поисковик почти не видел.
Мы пересобрали магазин на Next.js со своей админкой, пройдя все этапы выше:
- Каталог: 83 модели, больше 1 100 вариантов, 34 категории.
- У каждой карточки свой title и description с актуальной ценой.
- Раздел «Лаборатория» — 63 экспертные статьи под информационные запросы.
- Все 83 старых адреса товаров перенаправлены 301-редиректом на новые карточки.
- Перед запуском проверили 189 страниц — без ошибок. PageSpeed на компьютере — 100 из 100.
Новый сайт запустили 5 октября 2026 года. По Метрике переходов из поиска было 8 в день запуска, 93 на второй день и 329 на третий. Статья «Как перенести данные на новый iPhone» за первые дни дала 301 вход. Это ранние цифры, но они показывают, что сайт с правильной структурой и настроенным SEO может начать получать поисковый трафик уже в первые дни после запуска.
Сколько стоит разработка
Цена зависит от типа сайта и объёма работ на каждом этапе. Ориентиры у нас: сайт-визитка от 70 000 ₽, лендинг от 90 000 ₽, корпоративный сайт от 250 000 ₽, интернет-магазин от 400 000 ₽, редизайн от 100 000 ₽. Итоговая цена называется после брифа. Работаем по договору, оплата идёт этапами, доступы к сайту, Метрике и Вебмастеру остаются у вас.
Частые вопросы
Можно ли пропустить прототип и сразу делать дизайн?
Для одностраничного сайта иногда можно. Для многостраничного лучше не надо: правки в прототипе стоят дёшево, а в готовом дизайне или вёрстке — дорого.
Кто пишет тексты?
Обычно студия, но на основе фактов от заказчика: цены, условия, примеры работ, гарантии. Без этих фактов текст получается общим и не продаёт.
Нужна ли семантика, если сайт не планируют продвигать?
Да, хотя бы базовая. Она показывает, какие страницы нужны сайту и как клиенты называют ваши услуги. Даже если SEO начнётся позже, переделывать структуру не придётся.
Что будет со старым сайтом при переезде?
Старые адреса, которые были в поиске и приносили посетителей, перенаправляются 301-редиректом на новые страницы. Так поисковик переносит накопленное на новый сайт, а люди со старых ссылок попадают туда, куда нужно.
Можно ли запустить сайт частями?
Можно, если основные коммерческие страницы готовы. Например, сначала услуги и контакты, потом блог. Но запускать сайт с заглушками и пустыми разделами не стоит.
Итог
Сайт делается по порядку: бриф, семантика, структура и прототип, дизайн, разработка, наполнение, SEO-настройка, тестирование, запуск и поддержка. От студии нужна работа на каждом этапе, от вас — факты о бизнесе, материалы и быстрые согласования. Если сайт переезжает со старой версии, редиректы и проверка страниц перед запуском обязательны.
Хотите сайт, который сделан по всем этапам и готов к продвижению с первого дня, — посмотрите, как мы работаем, на странице разработки сайтов под ключ.
Сайты, которые сразу готовы к продвижению: структура по семантике, скорость, разметка.