ТЗ на розробку сайту: що в ньому має бути і готовий шаблон

Технічне завдання на розробку сайту — це документ, який перетворює «хочемо гарний сайт» на конкретний перелік сторінок, функцій і дат. Він потрібен обом сторонам однаково: замовник отримує гарантію, що йому зроблять саме те, за що він заплатив, а підрядник — захист від нескінченних «додайте ще ось це, ми ж домовлялися».

ТЗ фіксує чотири речі: обсяг робіт, ціну, строки й критерії приймання. Поки ці чотири пункти не записані, кожна сторона тримає в голові власну версію проєкту — і на етапі здачі з'ясовується, що версії були різні.

Нижче — чим ТЗ відрізняється від брифу, що в ньому обов'язково має бути, які помилки найчастіше зривають строки і, головне, готовий шаблон, який можна скопіювати й заповнити за один вечір.

Навіщо потрібне ТЗ і що буде без нього

Без ТЗ проєкт не зупиняється — він просто починає розвалюватися повільно й непомітно. Типова картина виглядає так:

• Обсяг розмивається. «Ще одна сторінка», «ще одна форма», «давайте додамо блок відгуків» — кожна дрібниця здається безкоштовною, поки їх не набереться на тиждень роботи.
• Ціна й строки пливуть. Без зафіксованого обсягу неможливо сказати, чи підрядник запізнюється, чи просто робить більше, ніж домовлялися на старті.
• Немає на що спертися при прийманні. Фраза «мені не подобається» не піддається ні перевірці, ні запереченню, тому етап може тягнутися місяцями.
• Контент зависає. Найчастіша причина зриву строків — не код, а тексти й фото, за які ніхто персонально не відповідає.
• Хтось платить за непорозуміння. Замовник — повторною розробкою, підрядник — безоплатними годинами. Приємного мало в обох випадках.

Важливо розуміти: ТЗ не забороняє зміни. Воно робить їх видимими. Кожна нова вимога отримує ціну в грошах і днях, і ви свідомо вирішуєте, чи вона того варта, замість того щоб сперечатися постфактум.

Якщо в тексті ТЗ трапляються незнайомі слова — CMS, хостинг, канонічна адреса, редирект, — звіряйтеся зі словником веб-термінів. Підписувати документ, половину якого ви не розумієте, не варто.

Чим ТЗ відрізняється від брифу

Ці два слова часто вживають як синоніми, і саме тут починається плутанина. Бриф — це анкета на вході. ТЗ — результат її обробки.

Простими словами: бриф відповідає на питання «що ви хочете», а ТЗ — на питання «що саме ми зробимо, за які гроші й до якої дати». Бриф без ТЗ залишає вас із гарними намірами. ТЗ без брифу зазвичай виходить відірваним від бізнесу.

Хто пише технічне завдання: клієнт чи підрядник

Є три сценарії, і працює переважно третій.

Клієнт пише сам. Плюс у тому, що в документі буде реальна бізнес-логіка. Мінус — клієнт описує бажаний результат, а не спосіб його досягти: «щоб люди залишали заявки» замість переліку форм, полів і адресата заявок. Такий текст — це радше розширений бриф.

Підрядник пише сам. Швидко й технічно грамотно, але є ризик, що в ТЗ потрапить зручний саме йому обсяг: рівно те, що він уміє робити, і нічого зайвого. Якщо ви йдете цим шляхом, читайте документ прискіпливо й ставте запитання до кожного розділу.

Пишуть разом — робочий варіант. Клієнт закриває бізнес-частину: компанія, продукт, аудиторія, конкуренти, цілі, бюджет, хто відповідає за контент. Підрядник перекладає це в структуру сторінок, функціонал, інтеграції, вимоги до швидкості та критерії приймання. Далі обидві сторони проходять документ рядок за рядком.

Хто б не тримав ручку, підписують ТЗ обидві сторони. Як перевірити виконавця ще до передоплати — у статті фрилансер чи агенція.

Що обов'язково має бути в ТЗ

Розділів багато, але кожен закриває конкретний ризик. Нижче — навіщо потрібен кожен блок.

Бізнес-частина

1. Про компанію і продукт — щоб підрядник писав тексти й будував структуру, а не вгадував, чим ви займаєтеся.
2. Цілі сайту й цільова дія — одна вимірювана дія на сторінку, інакше нема за чим оцінювати результат після запуску.
3. Цільова аудиторія — від неї залежать структура, тон текстів, набір доказів і навіть розмір шрифту.
4. Конкуренти — 3–5 посилань із поміткою, що саме подобається і що ні. Це швидше за десять абзаців опису.

Продуктова частина

5. Тип сайту, мови й структура сторінок — головний вимірювач обсягу. Від типу залежать ціна й строки: лендінг — від $150 і від 10 робочих днів, корпоративний сайт — від $350 і від 20 робочих днів. Якщо ви ще вагаєтеся між готовим конструктором і розробкою, почніть зі статті конструктор чи сайт під ключ.
6. Контент — хто пише тексти, хто дає фото і до якої дати. Розділ із іменем та дедлайном, а не з формулюванням «узгодимо в процесі».
7. Дизайн і брендбук — логотип, кольори, шрифти, приклади вподобаного і, обов'язково, кількість кіл правок, що входять у ціну.
8. Функціонал та інтеграції — форми, онлайн-оплата, доставка, CRM, аналітика. Кожен пункт окремим рядком із деталями. Для інтернет-магазину від $600 цей розділ зазвичай найбільший і найдорожчий.

Технічна частина

9. Вимоги до SEO і швидкості — вимірювані: унікальні мета-теги, sitemap, розмітка, цільовий PageSpeed. «Щоб сайт був у топі» вимогою не є.
10. Хостинг і домен — де розміщуємо, на кого оформлено, хто платить за продовження.
11. Доступи: хто і коли надає — домен, хостинг, аналітика, CRM. Найчастіша прихована причина зсуву строків.

Організаційна частина

12. Строки й етапи — дати прив'язані до етапів, а не до «кінця місяця», із поміткою, що саме зсуває графік.
13. Бюджет і порядок оплати — що входить у ціну, що оплачується окремо і за яким графіком. Орієнтири по типах сайтів — на сторінці з цінами.
14. Критерії приймання — умови, за яких етап вважається зданим. Без цього розділу ТЗ наполовину декоративне.
15. Підтримка після запуску — строк, обсяг робіт і вартість після його завершення.
16. Порядок внесення змін — як оформлюється й оцінюється нова вимога, що з'явилася посеред проєкту.

Шаблон ТЗ: копіюйте і заповнюйте

Скопіюйте текст нижче в Google Docs, Notion або звичайний документ, замініть усе в квадратних дужках на своє і видаліть розділи, які вам не потрібні. Якщо на якесь поле відповіді поки немає — залиште помітку «уточнити»: це нормально, частину пунктів підрядник закриє разом із вами.

# Технічне завдання на розробку сайту

- Замовник: [назва компанії або ФОП]
- Контактна особа: [ім'я, телефон, e-mail, Telegram]
- Виконавець: [назва підрядника]
- Дата і версія документа: [дд.мм.рррр, версія 1.0]

## 1. Про компанію і продукт

- Чим займається компанія: [1–2 речення]
- Що саме продаємо: [товари / послуги / підписка]
- Головна перевага перед конкурентами: [чим ми кращі]
- Географія роботи: [місто / Україна / ЄС]
- Чинний сайт: [адреса або «немає»]

## 2. Цілі сайту й цільова дія

- Головна мета: [заявки / продажі онлайн / онлайн-запис / довіра]
- Цільова дія: [заповнити форму / написати в Telegram / оформити замовлення]
- Як вимірюємо результат: [заявки з форми у GA4, дзвінки, замовлення]
- Чого на цьому етапі не робимо: [особистий кабінет, блог, каталог]

## 3. Цільова аудиторія

- Сегмент 1: [хто це, вік, місто, що для нього важливо]
- Сегмент 2: [хто це, вік, місто, що для нього важливо]
- Головні заперечення: [дорого / довго / не довіряю / не розумію]
- Пристрої: [орієнтовна частка смартфонів і десктопів]

## 4. Конкуренти

- Конкурент 1: [адреса] — подобається: [що саме]
- Конкурент 2: [адреса] — не подобається: [що саме]
- Конкурент 3: [адреса] — коментар: [думка]
- Чим ми маємо від них відрізнятися: [позиціювання]

## 5. Тип сайту, мови й структура сторінок

- Тип: [лендінг / корпоративний сайт / інтернет-магазин / каталог]
- Мовні версії: [українська; англійська — так/ні; інші]
- Хто робить переклад: [клієнт / підрядник / бюро]
- Перелік сторінок і блоків:
  - Головна: [перший екран, послуги, кейси, відгуки, FAQ, форма]
  - Про нас: [блоки]
  - Послуги: [скільки окремих сторінок]
  - Портфоліо / каталог: [скільки позицій]
  - Контакти: [форма, карта, реквізити]
  - [інші сторінки]
- Загальна кількість сторінок: [число]

## 6. Контент: тексти й фото

- Тексти пише: [клієнт / підрядник] — дедлайн: [дата]
- Фото надає: [клієнт / стоки / фотозйомка] — дедлайн: [дата]
- Відео: [є / немає / потрібно зняти]
- Логотип у векторі: [є / потрібно розробити]
- Хто вичитує й затверджує фінальні тексти: [ім'я]

## 7. Дизайн і брендбук

- Брендбук: [є / немає]
- Кольори: [HEX-коди або «на розсуд дизайнера»]
- Шрифти: [назви або «на розсуд дизайнера»]
- Приклади дизайну, які подобаються: [2–3 посилання]
- Чого точно не хочемо: [приклади]
- Кількість кіл правок дизайну в межах ціни: [число]
- Адаптивність: [смартфон, планшет, десктоп]

## 8. Функціонал та інтеграції

- Форми: [які саме, набір полів, куди надходять заявки]
- Онлайн-оплата: [потрібна / ні; який сервіс]
- Доставка: [Нова пошта / Укрпошта / самовивіз / кур'єр]
- CRM: [назва; які поля передаємо]
- Аналітика: [GA4, Search Console, пікселі, перелік цілей]
- Месенджери: [кнопки Telegram, Viber, WhatsApp]
- Інше: [калькулятор, онлайн-запис, фільтри, особистий кабінет]
- CMS: [потрібна / ні; що клієнт редагує самостійно]

## 9. Вимоги до SEO і швидкості

- Унікальні title та description на кожній сторінці: [так]
- Один H1 на сторінку, структура H2/H3: [так]
- robots.txt, sitemap.xml, canonical: [так]
- Розмітка Schema.org: [організація, послуги, FAQ, хлібні крихти]
- Цільовий PageSpeed на мобільних: [90+]
- Запити, під які будуємо структуру: [список або «збирає підрядник»]
- Перенесення зі старого сайту: [301-редиректи зі старих адрес, так/ні]

## 10. Хостинг і домен

- Домен: [адреса; на кого зареєстрований]
- Хостинг: [чинний / підбирає підрядник; на чий акаунт]
- SSL-сертифікат: [хто налаштовує]
- Пошта на домені: [потрібна / ні]
- Резервні копії: [частота, хто відповідає]

## 11. Строки й етапи

- Структура і прототип: [дата]
- Дизайн: [дата]
- Розробка: [дата]
- Наповнення і тестування: [дата]
- Запуск: [дата]
- Що може зсунути графік: [контент від клієнта, доступи, додаткові правки]

## 12. Бюджет і порядок оплати

- Бюджет проєкту: [сума]
- Що входить у ціну: [дизайн, верстка, CMS, базове SEO, тести, навчання]
- Що оплачується окремо: [домен, хостинг, фотозйомка, платні сервіси]
- Графік оплати: [етап 1 — %, етап 2 — %, етап 3 — %]

## 13. Критерії приймання

- Коректне відображення в: [Chrome, Safari, Firefox, мобільні браузери]
- Усі форми надсилають заявки на: [пошта / чат / CRM]
- PageSpeed на мобільних не нижче: [90]
- Немає битих посилань і сторінок з помилкою 404: [так]
- Аналітика фіксує цільову дію: [так]
- Клієнт самостійно може: [змінити текст, додати товар, опублікувати новину]
- Строк на перевірку етапу клієнтом: [робочих днів]

## 14. Доступи: хто і коли надає

- Домен і DNS: [хто, до якої дати]
- Хостинг: [хто, до якої дати]
- Чинний сайт і база даних: [хто, до якої дати]
- Google Analytics і Search Console: [хто]
- Соцмережі та рекламні кабінети: [хто]
- CRM і платіжний сервіс: [хто]

## 15. Підтримка після запуску

- Строк безкоштовної підтримки: [місяців]
- Що входить: [виправлення помилок, дрібні правки, консультації]
- Час реакції на звернення: [робочих годин]
- Вартість робіт після завершення підтримки: [ставка або пакет]
- Що передається клієнту: [код, доступи, інструкція до CMS]

## 16. Порядок внесення змін

- Нова вимога оформлюється: [доповненням до цього ТЗ]
- Підрядник оцінює зміну в: [грошах і робочих днях]
- Зміна йде в роботу після: [письмового погодження обох сторін]

---

Підписи сторін: [замовник] / [виконавець]. Дата: [дд.мм.рррр]

Далі шаблон проходить чотири кроки:

1. Заповніть бізнес-частину самостійно — розділи 1–4 і 6. Ніхто не знає ваш продукт краще за вас.
2. Надішліть документ підряднику. Він допише технічні розділи й дасть оцінку в грошах і днях.
3. Пройдіться по кожному рядку разом. Усе, що можна прочитати двома способами, переформулюйте.
4. Додайте фінальну версію до договору як додаток і підпишіть. Далі документ змінюється лише доповненнями.

Етапи проєкту: що фіксувати і хто відповідає

Ще один зріз того самого ТЗ — за етапами. Ця таблиця зручна, щоб перевірити, чи нічого не загубилося.

Типові помилки в ТЗ

Нижче — формулювання, які ми бачимо найчастіше, і те, чим їх замінити.

• Розмиті вимоги. «Сучасний дизайн», «швидкий сайт», «зручне меню» неможливо ні прийняти, ні відхилити. Замінюйте на вимірюване: PageSpeed 90+ на мобільних, меню не більше ніж на сім пунктів, три кола правок дизайну.
• «Зробіть як у конкурента». Чужий сайт — це орієнтир, а не завдання. Напишіть, що саме вам подобається: структура першого екрана, спосіб подачі цін, стиль фото. Інакше кожен зрозуміє цю фразу по-своєму, а копія чужого сайту ще й не враховує вашу аудиторію.
• Немає критеріїв приймання. Якщо не записано, за яких умов етап вважається зданим, він не здається ніколи: завжди знайдеться ще одна правка.
• Не вказано, хто відповідає за контент. Класичний сценарій: дизайн готовий, розробка готова, а сайт стоїть три тижні, бо тексти й фото «ось-ось будуть».
• Функції одним рядком. «Інтеграція з CRM» — це і година роботи, і два тижні. Пишіть, з якою саме CRM, які поля передаються і що відбувається, якщо запит не пройшов.
• ТЗ живе в месенджері. Домовленості в листуванні губляться між мемами й голосовими. ТЗ — це один документ із датою та номером версії.
• Немає порядку внесення змін. Зміни будуть завжди. Заздалегідь опишіть, як вони оформлюються й оцінюються, і суперечок буде значно менше.

Як ми працюємо з ТЗ у LogicFlow

Порядок у нас простий і однаковий для всіх проєктів. Перша консультація безкоштовна: ви розповідаєте задачу, ми ставимо уточнювальні питання й надсилаємо бриф. Оцінку ціни й строків даємо протягом робочого дня.

Далі ми складаємо ТЗ разом із вами: ви закриваєте бізнес-частину, ми — структуру, функціонал, інтеграції та критерії приймання. Готовий документ стає додатком до договору, де зафіксовані обсяг, ціна й строки. Оплата поетапна: наступний етап стартує лише після того, як ви прийняли попередній.

Домен, код і всі доступи належать вам, у кожен проєкт входять CMS і базове SEO, а після запуску діють 6 місяців безкоштовної підтримки. Якщо ТЗ у вас уже є — надішліть його, і ми дамо оцінку саме за ним, зазначивши пункти, які варто уточнити до старту.

Підсумок

• ТЗ фіксує обсяг, ціну, строки й критерії приймання — і захищає обидві сторони однаково.
• Бриф — анкета на вході, ТЗ — документ, що стає додатком до договору.
• Найкраще ТЗ пишуть разом: бізнес-частина від клієнта, технічна від підрядника.
• Обов'язкові розділи, без яких документ не працює: структура сторінок, відповідальний за контент, перелік інтеграцій, критерії приймання й порядок внесення змін.
• Замінюйте оцінні слова на вимірювані: не «швидкий сайт», а конкретна цифра.

Заповнили шаблон і хочете оцінку? Напишіть нам або одразу надішліть документ у Telegram @logicflowsolution чи в Instagram @logicflowsolution — подивимося ТЗ і назвемо ціну та строки протягом робочого дня.