Как подготовить техническое задание на сайт

Как подготовить техническое задание на сайт

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

Зачем нужно ТЗ, если студия и так всё знает

Опытная команда действительно может предложить типовое решение для любой ниши. Но типовое решение не учитывает ваши процессы: кто будет принимать заявки, как устроено ценообразование, какие услуги приносят основную прибыль, а какие существуют «для ассортимента». Эти вещи знает только владелец бизнеса. Техническое задание переносит это знание из головы заказчика в документ, с которым работают дизайнер, программист и контент-менеджер.

У хорошего ТЗ есть три практические функции:

  • Оценка стоимости и сроков. Без списка задач любая цена — это прикидка «на глаз», и в ней почти всегда заложен запас на неизвестность. Чем точнее описание, тем меньше этот запас.
  • Критерий приёмки. Когда проект готов, вы сверяете результат с документом, а не с ощущениями. Пункт выполнен или не выполнен — спорить не о чем.
  • Защита от расползания объёма. Новые идеи в процессе работы появляются всегда. ТЗ помогает отделить доработку, которая входила в договор, от новой задачи, которую нужно оценить отдельно.

Чем ТЗ отличается от брифа

Эти документы часто путают. Бриф — это анкета, которую заполняет заказчик в самом начале: чем занимается компания, кто клиенты, какие сайты нравятся, какой ориентировочный бюджет. Бриф отвечает на вопрос «чего мы хотим». Техническое задание отвечает на вопрос «что именно будет сделано»: какие страницы, какие блоки на них, какие формы, какие интеграции, на какой платформе.

На практике процесс выглядит так: заказчик заполняет бриф, менеджер студии проводит одну-две встречи, задаёт уточняющие вопросы, а затем на основе ответов формируется ТЗ. Если вы готовите документ сами, полезно пройти тот же путь — сначала ответить себе на вопросы брифа, а потом переходить к деталям. Иначе легко начать с выбора цвета кнопок, забыв, зачем вообще нужен сайт.

Из каких разделов состоит техническое задание

Жёсткого стандарта для небольших коммерческих сайтов нет, но удобная структура выглядит примерно так. Её можно взять за основу и сократить под свой проект.

  1. Общие сведения. Название компании, сфера деятельности, адрес существующего сайта (если он есть), контактное лицо со стороны заказчика, которое принимает решения.
  2. Цели сайта. Одна-три измеримые цели: получать заявки на расчёт, продавать товары, снизить нагрузку на менеджеров за счёт раздела с ответами на вопросы.
  3. Целевая аудитория. Кто приходит на сайт, с какого устройства, что ему важно узнать перед покупкой.
  4. Структура. Карта страниц с вложенностью: главная, разделы услуг, каталог, статьи, контакты.
  5. Описание страниц. Для каждого типа страницы — набор блоков и их порядок.
  6. Функциональные требования. Формы, калькуляторы, фильтры, личный кабинет, онлайн-оплата, поиск.
  7. Интеграции. CRM, учётная система, сервисы доставки, платёжные шлюзы, системы аналитики.
  8. Требования к дизайну. Фирменный стиль, примеры сайтов, которые нравятся и не нравятся, с объяснением почему.
  9. Контент. Кто готовит тексты и фотографии, в каком объёме, кто переносит старые материалы.
  10. Технические требования. Платформа, хостинг, адаптивность, скорость загрузки, базовая SEO-подготовка.
  11. Порядок сдачи и приёмки. Как проходит тестирование, сколько кругов правок, что передаётся заказчику по окончании.

Как описать структуру и страницы, чтобы вас поняли

Самая ценная часть ТЗ — описание страниц. Именно здесь чаще всего возникают расхождения. Фраза «страница услуги с описанием» может означать и один абзац текста, и длинный продающий лендинг с калькулятором, отзывами и формой. Поэтому описывайте страницы через блоки, а не через общие слова.

Пример хорошего описания страницы услуги:

  • первый экран: название услуги, короткое пояснение в одно предложение, кнопка «Рассчитать стоимость»;
  • блок «Что входит в работу» — от четырёх до шести пунктов с иконками;
  • таблица цен на три-пять типовых вариантов;
  • этапы работы — пять шагов;
  • два-три примера выполненных работ со ссылкой на портфолио;
  • частые вопросы — пять-семь вопросов в раскрывающемся списке;
  • форма заявки: имя, email, комментарий, согласие на обработку данных.

Такое описание одинаково понятно дизайнеру, верстальщику и автору текстов. Дизайнер видит, какие блоки рисовать, автор — сколько текста писать, а вы при приёмке легко проверите, всё ли на месте. Если страниц одного типа много (например, двадцать услуг), достаточно описать шаблон один раз и приложить список страниц, которые будут по нему собраны.

Совет от студии: нарисуйте структуру главной страницы от руки на листе бумаги — просто прямоугольники с подписями. Сфотографируйте и приложите к ТЗ. Такой набросок экономит час переписки и сразу показывает, что для вас важнее всего.

Функциональность: описываем сценарии, а не кнопки

Когда заказчик пишет «нужна форма обратной связи», программист задаёт десяток вопросов. Куда приходят заявки? На одну почту или на несколько? Нужна ли копия клиенту? Передаётся ли заявка в CRM? Какие поля обязательные? Что видит пользователь после отправки? Ответы на эти вопросы лучше дать заранее.

Удобный приём — описывать функции как сценарии пользователя. Например: «Посетитель выбирает тип объекта и площадь, калькулятор показывает ориентировочную стоимость, посетитель нажимает "Получить точный расчёт", оставляет email, заявка с выбранными параметрами приходит менеджеру на почту, а посетитель видит сообщение о том, что ответ придёт в течение рабочего дня». В таком описании нет технических терминов, но разработчику понятно всё: какие поля, какая логика, какие уведомления.

Отдельно отметьте функции, которые «хорошо бы иметь, но можно позже». Разделение на обязательное и желательное помогает уложиться в бюджет: первая версия сайта запускается быстрее, а дополнительные модули подключаются, когда сайт уже приносит заявки.

Интеграции, о которых часто забывают

  • передача заявок в CRM или в мессенджер менеджера;
  • выгрузка товаров и остатков из учётной системы;
  • расчёт стоимости доставки через сервис службы доставки;
  • приём оплаты банковской картой на сайте;
  • подключение систем веб-аналитики и настройка целей;
  • автоматическая отправка писем клиентам после заказа.

Каждая интеграция — это отдельный объём работы, иногда сопоставимый с вёрсткой нескольких страниц. Если о ней вспомнить после утверждения сметы, сроки сдвинутся.

Дизайн и контент: самые субъективные пункты

Описать дизайн словами сложно, поэтому лучше работать с примерами. Подберите три-пять сайтов, которые вам нравятся, и для каждого напишите, что именно понравилось: цветовая гамма, крупные фотографии, лаконичное меню, удобный каталог. Так же полезно привести один-два примера того, что вам категорически не подходит. Это сужает поле для фантазии дизайнера и сокращает количество правок.

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

С контентом ситуация ещё важнее. Сайт без текстов и фотографий невозможно сдать, а их подготовка — одна из главных причин затягивания сроков. В ТЗ обязательно зафиксируйте:

  • кто пишет тексты — заказчик, копирайтер студии или сторонний автор;
  • кто предоставляет фотографии и в каком качестве;
  • нужно ли переносить материалы со старого сайта и в каком объёме;
  • к какому этапу проекта контент должен быть готов.

Типичные ошибки при подготовке ТЗ

За годы работы мы видели множество технических заданий — от одной строки до сотни страниц. Ошибки в них повторяются.

ОшибкаЧем грозитКак исправить
Размытые формулировки: «современный дизайн», «удобный каталог»Каждая сторона понимает по-своему, спор при приёмкеЗаменить на конкретные блоки, примеры и сценарии
Копирование ТЗ с чужого проектаЛишние функции в смете и отсутствие нужныхБрать чужое ТЗ только как чек-лист вопросов
Нет ответственного за решенияПравки от нескольких сотрудников противоречат друг другуНазначить одно контактное лицо с правом согласования
Не указан контентГотовый сайт неделями стоит с заглушкамиЗафиксировать, кто и к какому сроку готовит материалы
Попытка описать всё до мелочейПодготовка ТЗ занимает больше времени, чем разработкаДетализировать ключевые страницы, остальное — шаблонами

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

Можно ли обойтись без самостоятельного ТЗ

Да, и для небольших проектов это нормальная практика. Если вы не готовы писать документ сами, студия может подготовить его на основе брифа и встреч. В «Граф Орлов» мы обычно так и работаем: заказчик рассказывает о бизнесе и задачах, наши специалисты задают вопросы, а затем присылают структуру сайта и описание страниц на согласование. Заказчику остаётся прочитать документ, внести замечания и подтвердить. Подробнее о том, как устроен этот процесс, можно узнать на странице создания сайтов.

Важно другое: даже если ТЗ пишет исполнитель, читать и согласовывать его должен заказчик. Подписанный документ, который вы не открывали, не защищает ни вас, ни студию. Выделите час, пройдитесь по каждому пункту и задайте вопросы по всему, что непонятно. Это самый дешёвый способ избежать переделок.

Вывод

Техническое задание — это не бюрократия, а инструмент, который экономит деньги и нервы обеим сторонам. Начните с целей и аудитории, затем составьте карту страниц, опишите ключевые страницы через блоки, а функции — через сценарии пользователя. Отдельно зафиксируйте интеграции, требования к дизайну и ответственность за контент. Не стремитесь к идеальной полноте: лучше короткий, но конкретный документ, чем объёмный и расплывчатый. Если хотите обсудить свой проект и получить структуру сайта от наших специалистов, напишите нам через страницу контактов — подготовим предложение и ответим на вопросы по техническому заданию.

Читайте также

Ещё несколько материалов из рубрики «Создание сайтов»

Сайт-визитка: кому он подходит
Создание сайтов

Сайт-визитка: кому он подходит

Небольшой сайт из нескольких страниц — самый быстрый способ появиться в интернете. Но подходит он не всем. Разбираем, для каких задач сайт-визитка идеален, что в нём должно быть и когда лучше сразу выбрать другой формат.

Время чтения: 7 мин
Лендинг или многостраничный сайт: что выбрать бизнесу
Создание сайтов

Лендинг или многостраничный сайт: что выбрать бизнесу

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

Время чтения: 8 мин
Из чего складывается стоимость сайта
Создание сайтов

Из чего складывается стоимость сайта

Почему одна студия называет цену в 30 тысяч, а другая — в 300? Разбираем смету сайта по статьям: что входит в работу, какие факторы двигают стоимость вверх и где экономия действительно разумна, а где обернётся переделками.

Время чтения: 8 мин

Остались вопросы?

Опишите задачу — специалисты студии ответят на почту и предложат решение для вашего сайта.

Нажимая кнопку, вы соглашаетесь с политикой конфиденциальности сайта