Разработка сайта проходит восемь этапов: брифинг и аналитика, техническое задание, структура и прототип, контент, дизайн, вёрстка и программирование, тестирование, запуск с передачей. Порядок важен: каждое решение, пропущенное на раннем этапе, всплывает позже и стоит в разы дороже. Разберём, что происходит на каждом шаге и где заказчику нужно участвовать.
Этап 1. Бриф и аналитика
Проект начинается не с дизайна, а с вопросов. Подрядчик выясняет, чем занимается бизнес, кто клиенты, какие у них возражения, кто конкуренты и какой результат считать успехом. Основной инструмент — бриф и встреча с владельцем или маркетологом.
Параллельно проводится аналитика:
- разбор сайтов конкурентов из выдачи Яндекса — что показывают, как подают цены, какие аргументы используют;
- сбор поисковых запросов в Яндекс Вордстате, чтобы понять, какие страницы нужны сайту;
- если сайт уже есть — данные Яндекс Метрики и Вебмастера: откуда приходят люди, какие страницы работают, где теряются заявки.
Что нужно от вас: честные ответы о клиентах и продажах, доступы к текущей аналитике, список конкурентов, которых вы считаете сильными. Самое ценное — реальные вопросы, которые задают клиенты менеджерам.
Этап 2. Техническое задание
ТЗ фиксирует, что именно будет сделано: список страниц и шаблонов, функции (фильтры, калькулятор, онлайн-запись, личный кабинет), интеграции с CRM, 1С, платёжными системами, требования к скорости, адаптивности, SEO и хостингу. Без ТЗ спор «это входило в работу или нет» неизбежен.
Хорошее ТЗ описывает поведение, а не абстракции: не «удобная форма заявки», а «форма с полями имя и телефон, отправляет заявку в CRM и на почту, фиксирует цель в Метрике, показывает страницу благодарности». Как составить такой документ — в статье техническое задание на сайт.
Этап 3. Структура и прототип
На основе запросов и целей проектируется структура: какие разделы и страницы будут, как они связаны, что находится в меню. Затем для ключевых страниц делается прототип — чёрно-белая схема блоков без дизайна.
Прототип нужен, чтобы договориться о смысле до того, как появятся цвета и шрифты. На этой стадии правки стоят дёшево: передвинуть блок в схеме — минуты, в готовом дизайне и вёрстке — часы.
Что проверить на прототипе:
- понятно ли с первого экрана, что вы предлагаете и для кого;
- есть ли на каждой странице следующий шаг для посетителя;
- где цены, доказательства, контакты;
- как это выглядит на телефоне — прототип мобильной версии обязателен, ведь большая часть посетителей многих ниш приходит со смартфонов.
Этап 4. Контент
Этап, который чаще всего срывает сроки. Тексты, фотографии, описания услуг, кейсы, отзывы, реквизиты — сайт без них не запустить. Хорошая практика — готовить контент параллельно с дизайном, а не после него: так дизайнер работает с реальными текстами, а не с «рыбой», которая потом не влезает в макет.
- Тексты пишут под структуру и запросы: у каждой услуги своя страница с ответами на вопросы клиентов.
- Фотографии — собственные: команда, объекты, производство. Если их нет, стоит заложить фотосъёмку.
- Юридические тексты: политика обработки персональных данных, согласие, при необходимости оферта.
Этап 5. Дизайн
Дизайнер превращает прототип в визуальный макет, обычно в Figma. Сначала согласуется главная страница или один ключевой шаблон — чтобы утвердить стиль, — затем остальные. Дизайн учитывает фирменный стиль, если он есть, и создаёт недостающие элементы: иконки, иллюстрации, состояния кнопок и форм.
Как давать обратную связь по дизайну продуктивно:
- Оценивайте, решает ли макет задачу, а не «нравится ли цвет».
- Собирайте замечания от всех участников в один список, а не присылайте по одному в течение недели.
- Формулируйте проблему, а не решение: «клиенты не поймут, что доставка бесплатная» полезнее, чем «сделайте шрифт больше».
Этап 6. Вёрстка и программирование
Утверждённый дизайн превращается в работающий сайт: вёрстка адаптивных шаблонов, установка CMS (WordPress, 1С-Битрикс или другой), программирование функций и интеграций, наполнение контентом. Работа ведётся на тестовом сервере, закрытом от индексации, чтобы поисковики не проиндексировали недоделанный сайт.
Уже здесь закладывается SEO-база:
- понятные адреса страниц (ЧПУ) и логичная вложенность;
- управляемые title, description и заголовки H1;
- микроразметка Schema.org для организации, услуг, товаров, хлебных крошек;
- оптимизация изображений и скорости — чтобы уложиться в рекомендации Core Web Vitals (подробнее в статье о скорости сайта);
- автоматическая карта сайта и корректный robots.txt.
Этап 7. Тестирование
Перед запуском сайт проверяют по чек-листу. Минимальный набор:
| Что проверяем | Как |
|---|---|
| Отображение | Популярные браузеры, телефоны на iOS и Android, планшет |
| Формы и заявки | Тестовые отправки, проверка доставки в CRM и на почту, попадание в спам |
| Скорость | PageSpeed Insights для мобильной и десктопной версии |
| Ссылки | Нет битых ссылок и ведущих на тестовый домен |
| Аналитика | Яндекс Метрика срабатывает, цели достигаются |
| Юридическое | Согласия на обработку данных, политика, cookie-уведомление |
| Безопасность | HTTPS, сложные пароли, резервные копии, закрытая админка |
Совет: попросите двух-трёх человек, не участвовавших в проекте, выполнить на тестовом сайте конкретную задачу — найти цену услуги, оставить заявку. Их затруднения покажут то, чего команда уже не замечает. Запишите, где они сомневались или искали дольше десяти секунд, и исправьте это до запуска.
Этап 8. Запуск и передача
Сайт переносится на рабочий хостинг и домен, открывается для индексации. Если это редизайн, критически важны 301-редиректы со старых адресов на новые — иначе накопленные позиции в поиске будут потеряны.
После запуска:
- Сайт добавляют в Яндекс Вебмастер и Google Search Console, отправляют карту сайта, проверяют главное зеркало.
- Обновляют ссылку на сайт в Яндекс Бизнесе, соцсетях и справочниках.
- Первые две-три недели следят за ошибками в Вебмастере, заявками и поведением в Метрике.
- Заказчику передают доступы: к домену, хостингу, CMS, аналитике — всё должно быть оформлено на компанию, а не на подрядчика.
- Проводят обучение: как менять тексты, цены, добавлять новости и товары.
Запуск — это не конец. Сайту нужны обновления, резервные копии и мелкие доработки, поэтому заранее договоритесь о формате технической поддержки.
Сколько длится разработка
Сроки зависят от объёма и скорости согласований. Ориентиры для типичных проектов: лендинг — несколько недель, корпоративный сайт — от полутора-двух месяцев, интернет-магазин с интеграциями — от нескольких месяцев. На практике сроки чаще сдвигаются не из-за разработки, а из-за ожидания контента и согласований со стороны заказчика. Назначьте одного ответственного за проект с правом принимать решения — это самый простой способ ускорить работу.
Частые вопросы
Можно ли пропустить прототип и сразу делать дизайн?
Для очень простого лендинга иногда можно, но обычно это ложная экономия. Без прототипа смысловые правки начинаются на этапе дизайна, а переделывать готовый макет дольше и дороже. Прототип — самый дешёвый способ договориться о содержании страниц.
На каком этапе подключать SEO-специалиста?
С самого начала — на этапе аналитики и структуры. Именно тогда решается, какие страницы будут на сайте и под какие запросы. Если позвать SEO-специалиста после запуска, часть структуры придётся переделывать, а это снова дизайн и вёрстка.
Сколько стоит разработка по всем этапам?
В Pear Advert лендинг или небольшой сайт — от 180 000 ₽, корпоративный сайт — от 450 000 ₽, интернет-магазин — от 900 000 ₽. Итог зависит от количества шаблонов, сложности функций и интеграций. Точную смету даём после брифа и составления требований.
Как платить за разработку: сразу или по этапам?
Удобнее всего поэтапная оплата: предоплата за старт, затем оплата после согласования прототипа, дизайна и запуска. Так у обеих сторон есть понятные контрольные точки, а заказчик получает результат каждого этапа — макеты, код, документацию — до перехода к следующему.
Что делать, если подрядчик пропал в середине проекта?
Сразу заберите всё, что уже сделано: макеты, код, доступы к тестовому серверу. Поэтому важно с самого начала держать домен, хостинг и репозиторий на своей компании и получать промежуточные результаты по этапам. Тогда другой подрядчик сможет продолжить работу, а не начинать с нуля.
Если вы планируете новый сайт, в Pear Advert мы ведём проект по всем этапам — от брифа до запуска и поддержки. Подробнее о процессе на странице создание сайтов, а начать можно с брифа.
