Как написать техническое задание: правила и требования

Представьте, что вы делаете ремонт. Если не продумать заранее расположение розеток, можно столкнуться с тем, что из-под телевизора тянутся провода и портят картинку — розетки установили не там, где нужно. Выбирать подходящее для них место надо было раньше.

Так же и в разработке. Без грамотного ТЗ, которое подробно рассказывает, как будет устроен сайт, результат получится непредсказуемым. Его придется долго и больно исправлять, когда все «электрика» уже проведена.

В этой статье мы расскажем, как написать техническое задание, и покажем примеры ТЗ по созданию сайта из нашей практики.

Что такое техническое задание на разработку сайта

Техническое задание (ТЗ) на разработку сайта — это документ, который содержит требования к будущему проекту. На основе информации, сформулированной в нем, исполнители получают задачи на разработку. Можно сказать, что это руководство для программистов по тому, как должен работать сайт, чтобы выполнять свои функции без сбоев и ошибок. 

Детальное и однозначное ТЗ страхует от непонимания и клиента, и исполнителя, а также дает наиболее предсказуемый результат, который совпадает с изначальными ожиданиями и видением.

Зачем составлять ТЗ для сайта

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

Польза технического задания для заказчика:

На каком этапе составлять ТЗ по сайту

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

разработки дизайн-концепции.

Кто должен составлять техническое задание

Техническое задание может составить исполнитель, клиент или обе стороны совместно. Разберем каждый вариант написания задания и примеры ТЗ на разработку сайта.

Исполнитель

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

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

Рассмотрим пример, как написать ТЗ для сайта. Клиент говорит, что на сайте интернет-магазина нужно реализовать бонусную систему. Однако такой формулировки недостаточно для разработчика — за ней стоит множество нюансов.

Когда будут начисляться бонусы: в момент покупки или поступления денег в биллинговой системе? Что происходит с бонусами при возврате? Когда бонусы сгорают? И так по каждой функции сайта — нужно учесть и расписать все сценарии и условия.

Представим наглядно, как это будет выглядеть в образце ТЗ для создания сайта.

Лучше доверить описание проекта исполнителю — у него есть опыт работы и команда специалистов, он больше разбирается в создании техзадания, чем клиент. К тому же компетентные и честные исполнители сами заинтересованы в создании хорошего ТЗ, потому что оно помогает работать продуктивнее.

Заказчик

Как мы уже писали выше, техзадания, составленные клиентом, обычно больше походят на набросок, чем на конечный вариант технического задания. К такому документу у исполнителя неизбежно возникнут вопросы и уточнения, придется вносить много правок. Это затянет процесс разработки сайта. Лучше сразу положиться на опытного исполнителя и доверить ему создание ТЗ с учетом ваших требований.

Совместная работа

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

Разработка техзадания происходит в ходе обсуждения. Исполнитель может предложить разные варианты реализации идей и поможет заказчику определиться в неочевидных моментах.

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

Правила составления ТЗ к сайту

Разберем правила, которые помогут составить удобное и полезное техзадание.

Точность

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

Детальное описание

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

Техническое задание для сайта — пример описания элемента главной страницы по одному из наших проектов:

Оформление

Документ должен быть лаконичным, простым и понятным в оформлении. Все части, пункты и подпункты надо озаглавить и пронумеровать. Можно для удобства вынести в начало содержание с кликабельными ссылками.

На изображении ниже — пример ТЗ на создание сайта по одному из наших проектов. Документ оформлен в Google Docs, навигация по нему реализована через заголовки.

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

Примеры

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

В примерах ТЗ для сайта могут быть и текстовые референсы. Если вам понравился tone of voice какого-либо блога, прикрепите его как образец. Ценными будут и антипримеры в духе «как делать точно не надо».

Объем

Вас не должен заботить объем технического задания — здесь нет «правильного» количества страниц. Помните: чем подробнее ТЗ, тем лучше.

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

Что включает в себя техническое задание

Сложные термины

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

Пример ТЗ для создания сайта — описание терминов по одному из наших проектов:

Общие положения

Здесь надо кратко и конкретно рассказать о компании, ее продукте или услуге:

Назначение и цели создания сайта

Исполнительная команда должна знать ЦА и род деятельности компании, чтобы понимать, для кого и зачем они разрабатывают сайт.

Цели создания сайта:

Сценарий использования сайта

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

Основные целевые действия пользователя на сайте:

Продумайте, как пользователь будет перемещаться по сайту. Для этого надо ответить на вопросы:

Количество действий и ответов в цепи может быть любым, но они должны следовать друг за другом — и в итоге приводить к результату. 

Пример технического задания для создания сайта — описание сценариев функции «Поиск» по одному из наших проектов:

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

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

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

Структура сайта

Это разделы и страницы, которые решают задачи пользователей. Их списки составляет исполнитель на основе целей сайта. Полученные страницы удобнее сразу разбить по отделам — так между ними будет проще выстроить связь и переходы.

Составленную структуру исполнитель показывает заказчику. Лучше оформить ее в виде схемы — так будет нагляднее и удобнее.

Примеры основных разделов:

Помимо разделов в структуре сайта надо отметить сквозные элементы: название, лого, поиск, номер телефона.

Также в структуре нужно заложить создание служебных страниц:

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

Добавление контента

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

Если за задачу берется исполнитель, клиент должен предоставить информацию о компании и фотографии. А затем утвердить ТЗ на написание текстов и создание изображений, анимаций и видеоматериалов.

Языковые версии сайта

Если продукты, услуги или материалы на сайте будут предназначены для нескольких стран, то и адаптировать их придется под разные языки. Это важная информация для разработчиков, ведь им придется использовать отличающиеся URL и задавать атрибуты hreflang. 

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

ТЗ для дизайнера сайта: создание прототипов для каждой уникальной страницы

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

Например, так выглядит прототип страницы, который мы создали для сайта курорта «Яровое».

Навигация по сайту

Чтобы пользователь не терялся на сайте и находил нужную информацию или товар, навигация должна быть простой, заметной и понятной.

Навигация бывает нескольких видов:

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

Несколько вариантов улучшения навигации по сайту:

Пример навигации по разделам на сайте «Ярового»:

Функциональность сайта

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

Что может понадобиться на сайте:

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

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

Образец ТЗ сайта — техническое требование по одному из наших проектов:

Чем вредит неверно составленное ТЗ?

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

Отметим и другие ошибки, которые лежат на поверхности, но совершаются довольно часто:

Вывод 

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

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