Як написати ТЗ на розробку сайту: структура, приклади й готові формулювання

Коротка відповідь: ТЗ — це не «хочу гарний сайт», а документ, за яким студія може назвати точну ціну і строк, а ви — прийняти роботу. Добре ТЗ відповідає на 8 блоків: цілі й метрики, аудит поточного сайту, структура сторінок, функціонал, контент, дизайн-очікування, інтеграції та технічні вимоги (швидкість, SEO, доступність), плюс критерії приймання. Нижче — як написати таке ТЗ самостійно.

Блок 1. Цілі й метрики, а не «гарно»

Почніть з бізнесу, а не з картинок. Запишіть:

• Навіщо сайт: збирати заявки, продавати товари, інформувати, виходити на новий ринок/мову.
• Одна головна метрика: заявок/міс, конверсія, дохід, частка органіки.
• Хто клієнт і що він має зробити на сайті (цільова дія).

Блок 2. Аудит поточного сайту (якщо він є)

Що залишити, що полагодити, що прибрати: позиції й трафік із Search Console, слабкі сторінки, швидкість (Lighthouse), зручність на мобільному, що не працює в CRM-приймачі заявок. Це захищає від «з нуля все переписати», коли 70% можна зберегти. Повʼязане — редизайн без втрати SEO.

Блок 3. Структура сторінок

Пропишіть карту сайту і по одній цілі на сторінку:

Сторінка	Задача	Обовʼязкові елементи
Головна	зачепити + перевести в послугу	оффер, переваги, кейси, CTA
Послуга / товар	конвертувати	склад, ціни «від», FAQ, форма
Кейси	довести	задача → рішення → цифра
Про компанію	довіра	команда, реквізити, сертифікати
Блог	трафік	категорії, пошук, підписка
Контакти	заявка	карта, клікабельний телефон, месенджери

Блок 4. Функціонал: що має працювати

Перелічіть по пунктах, а не «і загалом усе»:

• форми (які поля, куди падають, спам-захист), онлайн-чат, зворотний дзвінок;
• калькулятор вартості, фільтри/пошук по каталогу, особистий кабінет;
• багатомовність і локалі (мови, валюти);
• оплата й доставка (для магазину);
• ролі й права в адмінці, хто й що редагує.

Блок 5. Контент і CMS

• Хто пише тексти і де фото — ви, студія чи копірайтинг у пакеті.
• Що редагуєте самі — тоді потрібна headless CMS: правки сторінок і блоків без розробника. Чому це важливо — у гайді headless vs WordPress та на сторінці контент-платформ.
• Перенесення старого контенту (обсяг сторінок, товари, статті) — окремим рядком.

Блок 6. Дизайн: очікування й референси

• 3–5 сайтів-референсів «подобаеться/не подобається» і чому.
• Бренд: чи є гайд, логотип, фірмові кольори.
• Стиль: мінімалізм/преміум/темна тема; чи потрібні анімації й 3D (це впливає на ціну й швидкість — див. анімації, які продають).
• Дизайн-концепція до коду: зафіксуйте, що ви її затверджуєте.

Блок 7. Технічні вимоги

Блок 8. Інтеграції (окремою таблицею)

Система	Навіщо	Дані
CRM (Bitrix24/HubSpot/своя)	жодної втраченої заявки	контакт, угода, джерело
1С/BAS	актуальні залишки й ціни	номенклатура, склад
Телефонія	запис дзвінків у картку	номер, тривалість
Оплата/доставка	прийом замовлень	статус, чек
GA4 + Search Console	міряти результат	події, запити

Як це будується під капотом — інтеграція сайту з CRM і 1С.

Блок 9. Критерії приймання й строки

Прямо в ТЗ запишіть, що вважається «зроблено»:

• сторінки з версткою за затвердженим макетом, крос-браузерно;
• Lighthouse ≥ 90 на 3 ключових сторінках (додати звіт);
• форми доставляють заявку в CRM, цілі шлються в GA4;
• контент перенесено, метатеги заповнені, sitemap віддає 200;
• навчили редагувати, передали доступи й вихідники;
• гарантія на баги (наприклад, 6–12 місяців).

Міні-зразок ТЗ (скопіювати й заповнити)

1. Проєкт: сайт компанії X. Ціль: ≥ N заявок/міс, конверсія ≥ Y%. 2. Аудит: поточний сайт — позиції, швидкість, проблеми. 3. Структура: головна, 4 послуги, кейси, про нас, блог, контакти. 4. Функціонал: форми → CRM, калькулятор, багатомовність (UK/EN), пошук. 5. Контент: тексти — студія, фото — замовник, перенесення 12 сторінок. 6. Дизайн: референси A/B/C, темна тема, GSAP-анімації, концепт до коду. 7. Техніка: Lighthouse 90+, CWV зелені, hreflang, GA4+цілі, мікророзмітка. 8. Інтеграції: CRM, телефонія, оплата. 9. Приймання: звіт Lighthouse, тест форм, передача доступів і вихідників, гарантія 12 міс. 10. Бюджет і етапи: фікс-кошторис, демо щотижня.

Підсумок

Гарне ТЗ — це переклад бізнес-цілі на мову сторінок, функцій і критеріїв приймання. Заповніть 9 блоків вище — і ви отримаєте точний кошторис, передбачуваний строк і сайт, що вирішує задачу, а не «просто є».

Отримати ТЗ і кошторис під ваш сайт → — на безкоштовному брифі допоможемо оформити цілі в техзавдання і назвемо фіксовану ціну. Читайте також: як обрати веб-студію та лендінг чи сайт.