Техническое задание на сайт: пример и готовый шаблон ТЗ

В этой статье разберем, как составить техническое задание на сайт так, чтобы команда разработки поняла бизнес‑цели, сроки и качество, а вы — получили предсказуемый результат без «доделок». Даем структуру, пример формулировок и готовый шаблон, который можно сразу отдать подрядчику.

Зачем бизнесу формальное ТЗ и что оно решает

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

• Сокращает время на согласования: все решения фиксируются заранее.
• Делает бюджет управляемым: понятна трудоемкость и состав релизов.
• Упрощает приемку: есть измеримые критерии и чек‑лист.
• Повышает скорость онбординга команды: новый участник читает ТЗ и включается в контекст.

Естественно интегрируйте в ТЗ смежные потоки: UX‑исследования, дизайн, контент, QA, веб‑аналитику и SEO. Если требуются сложные сценарии или личные кабинеты — сразу вынесите это в раздел «Функциональные требования» и «Роли/права» или рассмотрите формат Разработка веб-приложений.

Техническое задание на сайт: структура разделов

Ниже — устоявшаяся структура ТЗ на разработку сайта, которой хватает для 90% проектов.

1. Введение и цели проекта.
2. Заинтересованные стороны и роли.
3. Объем работ (in scope/out of scope).
4. Карты пользовательских сценариев и персоны.
5. Информационная архитектура и структура разделов.
6. Функциональные требования и бизнес‑правила.
7. UI/UX и контент: источники, форматы, требования к доступности.
8. Технические требования к сайту: платформа, стек, интеграции, окружения.
9. Производительность и безопасность.
10. SEO‑требования и аналитика.
11. Тестирование и приемка: критерии, тест‑кейсы, метрики.
12. План релизов, сроки, роли в процессах.
13. Риски, допущения, зависимости.
14. Приложения: прототипы, словарь терминов, схемы интеграций.

Пример формулировок для ключевых разделов

Используйте конкретные, измеримые требования. Ниже — выдержки, как формулировать без размытостей.

• Цели: «Сократить среднее время заявки до 60 секунд с лендинга. Достичь CR формы 3% на трафике из РСЯ. Обновить бренд‑видимость в конкурентной нише».
• Объем работ: «В scope: главная, продукты (до 10), блог, контакты, форма заявки, интеграция с CRM. Out of scope: личный кабинет, мультивалютность».
• Сценарии: «Гость → Каталог → Фильтр → Карточка → Добавить в корзину → Оформление → Оплата».
• Функционал: «Фильтры по цене, бренду, атрибутам; сортировка по популярности/цене/новизне; сравнение до 4 товаров».
• Технические требования: «CMS: WordPress + WooCommerce; PHP ≥ 8.1; MySQL ≥ 8; Redis для кеширования; Nginx; Docker‑окружение dev/stage/prod».
• Производительность: «LCP ≤ 2.5 s на 75‑м перцентиле, CLS ≤ 0.1, TTFB ≤ 0.8 s; Pagespeed Mobile не ниже 85 на проде».
• Безопасность: «HTTPS (TLS 1.2+), HSTS, CSP, reCAPTCHA v3, WAF, ежедневный бэкап БД + файлов».
• SEO и аналитика: «Indexable страницы — каталог, карточки, блог; noindex для фильтров; ЧПУ; генерация sitemap.xml и robots.txt; микроразметка Product/Article/BreadcrumbList; Яндекс.Метрика и GA4 с событиями; сквозная CRM‑склейка лидов». Подробнее про аналитику — в статье
  .

ТЗ для разных типов сайтов: нюансы

Проект специфичен — ТЗ тоже. Обозначьте отличия, чтобы не дописывать «по ходу».

• ТЗ для корпоративного сайта. Акцент на структуру разделов (о компании, услуги, отраслевые кейсы, вакансии), бренд‑гайд, формы лидов, мультиязычность. Важно зафиксировать требования к CMS для редакции контента и правам. Если нужен надежный фундамент под контент‑маркетинг и продажи — смотрите услугу
  .
• ТЗ для интернет‑магазина. Детализируйте карточку товара, вариации (SKU), неликвид/архив, атрибуты для фильтров, остатки, логику ценообразования и промо, интеграции с ERP/CRM, оплату и доставку, фискализацию, чек/возвраты, статусные e‑mails/SMS, правила SEO индексации фильтров. Для масштабируемых e‑commerce решений — услуга
  .
• ТЗ для лендинга. Ключевые блоки, оффер, лид‑магниты, A/B‑эксперименты, скорость загрузки, AMP/скоростные шаблоны, пиксели/конверсии. Зафиксируйте схему UTM и план тестов. Про продуктовую воронку и гипотезы см.
  .

UI/UX и контент: как зафиксировать в ТЗ

Отдельный раздел ТЗ должен описывать, на какой стадии дизайн и контент, какие артефакты есть и что считается «готово».

• Исследования: задачи, методы, объём респондентов, артефакты (JTBD, CJM, прототипы).
• Прототипы: ссылка, уровень детализации (low/mid/high‑fidelity), статус согласования.
• Дизайн: бренд‑гайд, токены, сетка, адаптивные брейкпоинты, компоненты; требования к доступности (WCAG 2.1 AA).
• Контент: кто поставляет тексты/медиа, форматы, тональность, правила нейминга.
• Дизайн‑система и handoff: Figma library, naming, экспорт ассетов, spec для разработчиков.

Если вам нужна выверенная логика интерфейсов и конверсионные макеты — посмотрите UX/UI дизайн сайтов.

Технические требования к сайту и интеграции

Этот раздел экономит месяцы. Фиксируйте платформу, инфраструктуру и внешние сервисы.

• Платформа/CMS/фреймворк: версии, лицензии, плагины (только whitelisted), ограничения на кастом.
• Архитектура: монолит/микросервисы, API‑шлюз, очереди, кеш‑слои (Redis/Varnish), CDN.
• DevOps: Git‑flow, CI/CD, окружения, миграции БД, секреты/хранилища, мониторинг.
• Интеграции: CRM, ERP, каталоги, оплата, доставка, KYC, маркетинговые сервисы.
• Логи и аудит: уровни логирования, ротация, доступ к логам для поддержки.
• Доступность и юридические требования: персональные данные, политика cookies, 152‑ФЗ/Закон о рекламе (при актуальности).

Для сложных интеграций и high‑load сценариев ориентируйтесь на формат Разработка веб-приложений.

SEO и аналитика: что обязательно должно быть в ТЗ

• Карта URL и индексации: что index/noindex, пагинация, canonical, hreflang.
• Метаданные: шаблоны title/description/h1, Open Graph, микроразметка.
• Техническое SEO: веб‑виталии, lazy load, критический CSS, кеширование, оптимизация изображений (AVIF/WebP), sitemap, robots, 301‑редиректы, 404/410, обработка 5xx.
• Аналитика: GA4, Яндекс.Метрика, серверные события (по возможности), планирование целей/событий, сквозная аналитика с CRM. Дополнительно: серверные логи для атрибуции и антиспам.

Про влияние технички и контента на трафик — в материале SEO‑продвижение: что реально влияет на рост трафика (техничка, контент, ссылки, поведенческие).

Готовый шаблон ТЗ на сайт (скопируйте и подставьте своё)

Ниже универсальный шаблон. Уберите лишнее, добавьте специфику проекта.

1. Введение и цели

• Проект: [Название]
• Цели: [SMART‑формулировки]
• KPI запуска: [например, LCP ≤ 2.5 s, CR формы ≥ 3%]
• Ограничения: [срок/бюджет/наследие]

2. Стороны и роли

• Заказчик: [ФИО/роль/контакты]
• Подрядчик: [Компания/роль/контакты]
• Вовлеченные: [PM, UX, Dev, QA, SEO, Аналитик]
• Каналы связи и SLA ответов: [например, Slack, 4 рабочих часа]

3. Объем работ

• In scope: [страницы/фичи]
• Out of scope: [исключения]
• Артефакты на выходе: [код, дизайн, гайды, документация]

4. Пользователи и сценарии

• Персоны: [описания]
• CJM/Use‑cases: [основные пути]
• Нефункциональные ожидания: [скорость, доступность]

5. Информационная архитектура

• Карта сайта: [иерархия]
• Навигация/хлебные крошки
• Поиск/фасеты (если есть)

6. Функциональные требования

• Карточка продукта/услуги: [поля/логика]
• Формы: [поля, валидация, антиспам]
• Каталог/фильтры/сортировка
• Сравнение/избранное/корзина (для e‑commerce)
• ЛК/роли/права (если есть)

7. UI/UX и контент

• Прототипы: [ссылки]
• Дизайн: [ссылки на Figma, токены, адаптив]
• Контент: [источник, форматы, объем]
• Доступность: [WCAG 2.1 AA]

8. Технические требования

• Платформа/стек: [CMS/фреймворк/версии]
• Хостинг/окружения: [dev/stage/prod]
• CI/CD и миграции: [git‑flow, автодеплой]
• Интеграции: [CRM/ERP/оплаты/доставки]
• Логи/мониторинг: [инструменты]

9. Производительность и безопасность

• Виталии: [LCP/CLS/INP]
• Оптимизация: [кеш, CDN, минификация]
• Безопасность: [HTTPS, CSP, WAF, бэкапы]

10. SEO и аналитика

• Индексация: [index/noindex, canonical]
• Метаданные/схемы: [шаблоны, микроразметка]
• Аналитика: [GA4/Я.Метрика/события]
• Конфиденциальность: [cookies/баннер/политика]

11. Тестирование и приемка

• Типы тестов: [unit, e2e, кросс‑браузер, нагрузка]
• Критерии приемки: [чек‑лист]
• Дефект‑политика: [severity/SLA]

12. Сроки и релизы

• План релизов: [MVP → R1 → R2]
• Контрольные точки: [демо/ретро]
• Ответственные: [PM, лиды]

13. Риски и зависимости

• Риски: [задержки контента, интеграций]
• План реагирования: [митигация]

14. Приложения

• Словарь терминов
• Макеты/прототипы
• Схемы интеграций

Ошибки в ТЗ на сайт, которые срывают сроки и бюджет

• Размытые формулировки («современный дизайн», «быстрая загрузка») без метрик.
• Отсутствие out of scope — всё внезапно становится «обязательным».
• Неполные сценарии: не описаны пустые состояния, ошибки, edge‑кейсы.
• Нет стратегии индексации: фильтры и пагинация создают мусорный индекс.
• Отсутствие требований к данным: кто владелец, где хранится, схема бэкапов.
• Несогласованные интеграции: нет тестовых стендов и контактных лиц поставщиков.
• Игнорирование мобильного first и доступности.
• Нет плана приемки: команда спорит «готово/не готово».

Чек‑лист для быстрого аудита ТЗ

• Цели и KPI измеримы и достижимы.
• Прописаны роли, каналы и SLA коммуникаций.
• Есть scope и out of scope.
• Сценарии покрывают edge‑кейсы и ошибки.
• Структура сайта утверждена и согласована с SEO.
• Функциональные требования детализированы по состояниям.
• UI/UX артефакты перечислены, handoff понятен.
• Технические требования к сайту и интеграциям сформулированы с версиями и доступами.
• Производительность и безопасность имеют конкретные метрики.
• Настройка аналитики и события описаны.
• План тестирования и критерии приемки зафиксированы.
• Сроки и релизы с контрольными точками определены.

Вывод

Хорошо написанное ТЗ экономит ресурсы и снижает риски. Берите шаблон, адаптируйте под свой проект и фиксируйте ключевые решения до старта. Если нужно быстро упаковать требования и пройти путь от прототипов до релиза — обращайтесь: поможем со стратегией, UX/UI и разработкой под задачи бизнеса.