Как составить грамотное ТЗ на разработку сайта

Алексей Штарев
CEO PromoPult

Техническое задание (ТЗ) — это документ, необходимый для разработки эффективного сайта, который решает бизнес-задачи заказчика. Нельзя сделать качественный интернет-ресурс без четких требований и понимания, как он должен работать. Требование сделать «красивый и эффективный сайт» несостоятельно, если вы не опишете, как именно он должен работать.
Без техзадания готовый ресурс может оказаться неэффективным, из-за чего его придется переделывать, тратить деньги и время. Именно поэтому важно ставить четкое и понятное ТЗ на разработку сайта. Разберемся, как именно это можно сделать и что включить в документ.
Оглавление
- Что такое техническое задание на разработку сайта
- Зачем нужно ТЗ и какие проблемы оно решает
- Что нужно подготовить до написания ТЗ
- Кто должен писать ТЗ и в каком формате
- Структура грамотного ТЗ на разработку сайта
- Общая информация
- Тип и структура
- Функциональные требования
- Требования к дизайну и UX
- Технические требования
- SEO и контент
- Сроки, этапы и стоимость
- Тестирование, приёмка и критерии готовности
- Техническая поддержка после разработки
- Частые ошибки при составлении ТЗ
- Нежелание советоваться с разработчиком
- Слишком общее описание
- Не указан тип интернет-ресурса
- Недостаточно примеров на отдельные блоки или сайты в целом
- Не прописаны технические нюансы
- Отсутствие целей и сценариев пользователей
- Нет критериев приёмки
- Попытка писать код вместо результата
- Отсутствие приоритетов
- Рекомендации и заключение
Что такое техническое задание на разработку сайта
Техническое задание на разработку сайта — это документ, в котором описаны его структура, функциональность, дизайн, требования, ограничения. ТЗ составляется до заключения договора: это нужно, чтобы заказчик и исполнитель смогли представить цель в выполнимой, понятной форме. Благодаря этому специалист сможет указать на невыполнимые требования ещё до того, как подпишется на работу, оценить реалистичные сроки, запросить соответствующую цену.
Составляется техническое задание на основе пожеланий заказчиков, откорректированных или оформленных специалистами в ходе заполнения брифа (опросника для клиента), его обсуждения. После составления ТЗ считается официальным документом, оно включается в договор. По нему клиент и исполнитель будут в процессе сверять перечень и качество выполненных работ при приемке.
Техническое задание требуется всем участникам процесса: заказчику, разработчику, веб-дизайнеру, SEO-оптимизатору, контент-менеджеру, другим специалистам. Оно четко очерчивает обязанности каждого исполнителя, желаемый результат, задачи, которые нужно выполнить.
Зачем нужно ТЗ и какие проблемы оно решает
Техническое задание на сайт необходимо для точной, подробной, информативной постановки задачи исполнителю. Оно помогает сформулировать цель, конкретизировать ее, выразить понятно для подрядчика. В нем описаны как общие представления, требования, так и важные технические нюансы — например, движок или язык программирования, варианты оплаты в корзине, дополнительные инструменты конверсии.
Помимо этого ТЗ выполняет целый ряд задач:
- Фиксирует объём работ. В техзадании подробно прописывается, что и в каком размере исполнитель должен передать заказчику.
- Описывает функционал. Важно закрепить, какие задачи должен выполнять ресурс, что нужно для этого внедрить.
- Помогает точно оценить сроки сдачи проекта, его стоимость. При заключении договора учитываются пожелания обеих сторон, их возможности. Точные сроки и цены помогают соблюдать права клиента и исполнителя.
- Упрощает приёмку готового сайта. Пошагово сравнивая результат с описанным в ТЗ, можно удостовериться в работоспособности каждой функции.
- Снижает риск «доработок по умолчанию». Подробно прописанное техническое задание исключает правки, которые не соотносятся с указанными в нем функциями, работами. Благодаря этому исполнитель точно выполнит всё необходимое, а заказчик не потребует большего.
- Служит опорным документом при спорах. Благодаря зафиксированной в ТЗ информации исполнитель может доказать, что он всё сделал правильно, а заказчик — что разработчик не выполнил нужные работы.
Если техническое задание составлено неправильно, недостаточно полно или вовсе отсутствует, исполнителю будет значительно труднее закончить работу. Он просто не будет знать, куда ему двигаться и за что хвататься. Кроме того, если заказчик не описал подробно, что он хочет получить, подрядчик может выполнить работы по своему разумению — например, расположить блоки на сайте иначе, выбрать не подходящий, по мнению клиента, дизайн для ключевых элементов и т. д.
Что нужно подготовить до написания ТЗ
Перед тем как составить документ необходимо собрать информацию, которая поможет обозначить требования к сайту, обрисовать конечный результат:
- Цели создания — продажи, заявки, имидж, контент. Помогут выбрать тип ресурса, основные блоки, контент, дизайн, аналитику, другие важные элементы.
- Целевая аудитория. Отображает, для кого вы делаете ресурс: пол, возраст, интересы, технические навыки, геолокация и т. д. О том, как составить портрет ЦА, мы подробно рассказывали здесь.
- Анализ конкурентов. Позволяет определить наиболее удачные решения конкретно в вашей отрасли, сильные стороны соперников по рынку, собрать семантическое ядро.
- Сценарии поведения пользователей. Требуются для выбора оптимальной структуры сайта, оформления интерактивных элементов, постройки «пути» к целевому действию.
- Примеры сайтов (что нравится или не нравится). Это покажет разработчикам, к чему стремиться, чего избегать, что стоит учесть при разработке и в дизайне.
- Ограничения — сроки, бюджет, платформа. Определяет рамки, в которых исполнителю нужно держаться. Выбор платформы может лежать на заказчике, если он знает, какая лучше подойдет и будет удобнее.
- Предварительная структура: какие блоки должны быть, как они будут располагаться, где находится меню, товары или статьи и т. д.
- Кто будет администрировать, обновлять контент. Некоторые компании могут поддерживать интернет-ресурс, тогда как другие просто сдадут его заказчику, а администрировать, обновлять его тот будет сам. Уточните, какой вариант вам лучше подходит. Это также позволит настроить «админку» сайта для удобного использования без глубоких технических познаний.
К созданию ТЗ желательно привлечь специалистов, которые будут напрямую работать с сайтом (SEO-специалистов, маркетологов, администраторов, аналитиков, контент-менеджеров).
Кто должен писать ТЗ и в каком формате
Техническое задание на разработку сайта — документ, который должен быть составлен правильно. От него напрямую зависит качество, эффективность ресурса, время его создания. Поэтому желательно, чтобы клиент и исполнитель работали над ним сообща. Это позволит избежать ошибок, недосказанности или путаницы.
Составляется ТЗ в том числе на основе брифа — опросника, который исполнитель высылает заказчику заранее. В нем клиент рассказывает об основных функциях, элементах, внешнем виде будущего сайта, прикрепляет примеры понравившихся интернет-ресурсов. Исполнитель изучает бриф, готовит черновик техзадания, после чего они договариваются с заказчиком обо всех нюансах, сроках, стоимости, а затем подписывают договор.
Вместо заполнения брифа клиент может прислать уже готовое техническое задание, если он точно знает, чего хочет. Но для этого ему нужно самому разбираться в создании сайтов, иначе требования могут быть нереалистичными или неполными.
В создании ТЗ важно задействовать всех специалистов, которые понимают, какие задачи должен выполнять будущий интернет-ресурс. Это позволит составить перечень функций и элементов, которые важны для выполнения разных задач. Например, маркетолог подумает о том, как эффективнее приводить лидов к целевым действиям, аналитик — о сборе важной для анализа информации, редактор — об удобстве восприятия контента, SEO-специалист — о поисковой оптимизации.
Техническое задание нужно подготовить в формате, который будет удобен для восприятия. Если накидать рисунки на бумаге от руки, предоставить ворох заметок, исполнитель может в этом потоке информации что-то упустить. Лучше всего составить структурированное техническое задание с подзаголовками, блок-схемами, иллюстрациями, таблицами, другой информацией при необходимости. Для этого подходят следующие варианты:
- Google или Яндекс Документы. Оптимальный вариант, если в создании ТЗ участвует несколько человек. Каждый может параллельно заполнять свою часть документа, оставлять комментарии, активно обсуждать их. Но схемы и прототипы придется рисовать в других программах или сервисах.
- Файл в формате PDF. По сути, тот же документ, только в уже «закрепленной» форме. Прикрепленный к договору ПДФ уже ни одна сторона не сможет отредактировать.
- Блокнот Notion. Позволяет структурировано подать информацию в ТЗ, вести работу параллельно нескольким людям. Есть сложности с доступом из России, но это все еще возможно.
- Figma. Подходит, если в ТЗ много иллюстраций или их нужно расположить в особом порядке для понимания. Идеальна для рисования схем, прототипирования, составления мудбордов. Поддерживает параллельную работу нескольких человек .
При составлении ТЗ на разработку сайта важно помнить: его можно, даже нужно обсуждать и редактировать. Это документ, который необходимо изучить всем сторонам до подписания договора, уточнить технические и организационные неточности.
Структура грамотного ТЗ на разработку сайта
На основе предварительно собранной информации можно приступать к формированию технического задания. В идеале стоит делать это вместе с менеджером подрядчика или с самим исполнителем. Учитывайте, что чем сложнее и объемнее проект, тем больше информации придется собрать и оформить в ТЗ для веб-разработки. Тогда как для простых сайтов-визиток достаточно небольшого объема данных. Пройдемся по основным разделам ТЗ.
Общая информация
Основная информация о будущем сайте. Нужно описать, какой интернет-ресурс вы хотите получить, что на нем должно быть, какие задачи он будет выполнять.
- Описание проекта. Название, назначение ресурса.
- Цели и задачи. Те функции, которые он должен выполнять. Например, демонстрировать ассортимент товара, быть каналом связи с компанией, информировать о новостях бренда, продавать и т. д.
- Кратко о компании и продукте. Название, сфера деятельности, логотип, фирменный стиль и другие данные, которые помогут выбрать оформление, функции.
- Конкурентное преимущество. Что-то, что должно отличать сайт от других участников рынка. Например, что-то общее (цены, ассортимент, качество) или конкретно особенность сайта (более удобный каталог, калькулятор материалов).
- Целевая аудитория. Расскажите, кто будет пользоваться ресурсом. Это важно как для проектирования его «скелета», так и для наполнения контентом, дизайна, выбора наиболее эффективных инструментов и функций.
- Конкуренты. Предоставьте разработчику информацию о сайтах других компаний, опишите их сильные стороны. Это поможет с позиционированием вашего ресурса, сбором ключевых слов, поиском решений для удобства клиентов.
Если подозреваете, что посещаемость будет высокой из-за большого количества клиентов, тоже укажите этот момент — он позволит рассчитать нагрузку на сервера.
Тип и структура
Обозначьте в ТЗ, какой тип сайта нужен: лендинг, онлайн-магазин, визитка, корпоративный сайт, интернет-портал, форум и т. д. Это позволит выбрать базу, на которой будет спроектирован ресурс. Подробно все типы сайтов разобрали в этой статье.
После этого составьте схему, как должен выглядеть будущий сайт:
- Укажите, основные страницы: например, услуги, блог, контакты, история бренда. Не забудьте про обязательные страницы — политика конфиденциальности, пользовательское соглашение, доставка, оплата и прочие.
- Пропишите подразделы для каждой страницы. Например, если у вас широкий ассортимент столов, стульев и кресел, логично на странице «Каталог» разместить несколько подразделов под каждую категорию товаров. А внутри этой категории сделать фильтры по цвету, материалу, размеру и т. д. На этом этапе идеально подключить SEO-специалиста, чтобы выяснить, какие именно подразделы и фильтры в каталоге стоит создавать с учетом пользовательского интереса.
- Для каждой страницы набросайте макет, как будет выглядеть контент на ней. Достаточно простейшей схемы: покажите, где будут располагаться изображения, заголовки, кнопки, категории и т. д. Если вам сложно нарисовать, проиллюстрируйте примерами с других сайтов.
- Продумайте меню и навигацию. Важно, чтобы эти элементы были очевидны для пользователей, иначе они не найдут нужного на сайте. Расположите в меню самые важные разделы, укажите, что нужно также встроить поиск по ресурсу.
- Укажите, что будет находиться в «подвале» сайта. Обычно там располагаются контакты, ссылки на основные страницы и подстраницы, социальные сети. Отдельные компании добавляют туда форму обратной связи или карту, на которой показан офис. Подробнее про футер и что в нем должно быть читайте здесь.
Именно структура является фундаментом будущего сайта. Уделите ей особое внимание. Возникают сомнения — проконсультируйтесь с разработчиком, маркетологом, изучите конкурентов. Если неправильно составить «скелет», пользоваться ресурсом будет неудобно.
Функциональные требования
Укажите, какие функции должен выполнять сайт. От этого зависит перечень интерактивных элементов:
- Формы — заявка, обратная связь, расчет стоимости и т. д.
- Личный кабинет и регистрация в нем, если он нужен.
- Корзина, каталог, фильтры, онлайн-оплата (для e-commerce).
- Поиск по сайту.
- Интерактивные графики, карты, калькуляторы и прочее.
- Комментарии или отзывы.
- Страница 404.
- Административная панель для публикации контента, управления, модерации.
Здесь же пропишите, с чем нужно интегрировать сайт — например, с сервисами аналитики, складским ПО для учета остатков, платежными системами, базами данных и т. д.
Требования к дизайну и UX
Требования к оформлению и пользовательскому опыту в ТЗ должны включать:
- Основной, фоновый, дополнительный цвета. Подберите под них и цвет шрифта, чтобы он гармонировал, но оставался контрастным для удобства чтения. Укажите их цветовые коды.
- Шрифты. Лучше указать несколько вариантов из стандартных шрифтов, доступных для свободного использования. Пропишите предполагаемые размеры заголовков, подзаголовков, меню, основного контента.
- Графика. Укажите иконки, иллюстрации, фотографии, графики или другой контент, который необходимо разместить на сайте. Пропишите также их расположение.
- Анимация. Расскажите, в каких случаях должны активироваться анимированные элементы, какими они должны быть. Например, при наведении на корзину или кнопку та должна увеличиться в размере.
- Общая стилистика. Проиллюстрируйте или опишите «настроение» сайта, желаемый стиль, внешний вид. Если есть брендбук или уже наработанное оформление бренда, используйте их.
- Адаптивность. Укажите, под какие устройства нужно оптимизировать страницы. Это сделает их доступным для большего числа пользователей. Подробный гайд по мобильной адаптации найдете в этом материале.
Идеально будет, если помимо описания в ТЗ вы прикрепите примеры, иллюстрации, шрифты, цвета и прочее в единую «доску настроения» (мудборд), чтобы дизайнер смог на неё ориентироваться в работе. Это можно сделать через презентацию или сервисы вроде Figma.
Технические требования
Раздел описывает «изнанку» сайта, которую исполнитель должен воплотить. В частности:
- CMS или фреймворк. На чем должен базироваться сайт. Важно, если вы планируете самостоятельно администрировать или обновлять ресурс: на CMS это проще сделать, чем на «самописном» движке. Топ-10 CMS для сайта найдете в этом обзоре.
- Хостинг и домен (если известно). Отдельно пропишите, что именно заказчик отвечает за выбор домена и хостинга, их регистрацию, у него будет доступ к управлению, оплате. Учитывайте при выборе хостинга тарифы, объем, скорость и расположение сервера.
- Скорость загрузки. Зависит от объема контента и выбранных технических решений. Гайд по увеличению скорости загрузки — в этой статье.
- Безопасность. В частности, нужно прописать регулярные обновления, устранение возникших уязвимостей, а также указать, что сайт должен быть защищен от QL-инъекций, DDoS и XSS-атак.
- Поддержка браузеров. Пропишите наиболее популярные браузеры (Google Chrome, Яндекс Браузер, Edge, Safari, мобильные).
Заказчику стоит самостоятельно заполнять этот раздел, если он точно понимает, что ему нужно и как это работает. Иначе лучше согласовать его с разработчиком или техническим специалистом.
SEO и контент
Здесь важно перечислить указания по SEO-оптимизации интернет-ресурса. Сюда входят:
- Файл robots.txt — нужен для направления поисковых ботов (краулеров) на важные разделы сайта, также в нем можно прописать запрет на посещение определенных страниц (например, служебных или конфиденциальных). О том, как составить правильный robots для Яндекса и Google, рассказали в этой статье.
- Человекопонятные адреса страниц (ЧПУ URL). Ссылки должны формироваться так, чтобы даже человек без технических знаний понимал, куда они идут. Например, в формате domen.ru/category (раздел сайта)/nazvanie (название товара или страницы). Всё про URL рассказали в этой статье.
- XML-карта сайта. Необходима для индексации поисковыми роботами. Подробнее о ее роли и правильной структуре — здесь.
- Возможность прописать метатеги и заголовки для каждой страницы.
- Заголовки в контенте. Должны быть на каждой странице, требуются для структурирования и SEO.
- Изображения. Каждая картинка должна иметь оптимальный размер и вес, сопровождаться альтернативным текстом для поисковых систем. Про оптимизацию изображений в блоге PromoPult есть отдельная статья.
Также желательно прописать требования к каноническим ссылкам (главным для поисковых систем, если есть несколько копий страницы в сети), редиректу (перенаправлению с устаревших страниц на актуальные).
В этом же разделе определите, кто занимается первичным наполнением сайта текстами, изображениями. Если это заказчик — он должен подготовить материалы и передать разработчику или самостоятельно добавить их уже после сдачи проекта. Если это исполнитель, то он сам ищет подрядчика и сдает клиенту уже готовый наполненный интернет-ресурс.
Модули и инструменты PromoPult упрощают наполнение и оптимизацию сайта. В модуле SEO запустить продвижение сайта в топ Яндекса и Google сможет даже новичок, а если пополните баланс на сумму от 3000 рублей, проект бесплатно настроит специалист платформы. AI инструменты быстро соберут семантику, проведут аудит вашего ресурса и конкурентов, выберут площадки для размещения ссылок. Все задачи выполняются по чек-листу и в срок. Протестировать SEO в PromoPult можно бесплатно за 2 недели.
Реклама. ООО «Клик.ру», ИНН: 7743771327, ERID: 2Vtzqw3VCJw
Сроки, этапы и стоимость
В этом пункте укажите, как вы планируете контролировать разработку, в какие сроки ожидаете результаты, в каком формате желаете получать отчеты. Это важно, поскольку без надзора даже лучшие исполнители могут расслабиться и доделывать проект в последние дни перед дедлайном.
Договоритесь о поэтапной сдаче сайта — например, сначала разработчики готовят структуру и макет, затем предоставляют главную страницу, а потом доделывают остальные разделы, в конце занимаясь интеграциями или подключением оплаты. Пропишите очередность. Учитывайте, что конечным этапом будет тестирование и приемка, для них тоже нужны сроки. В таком формате вы контролируете разработку, можете вовремя заметить ошибки или неточности, исправить их.
Укажите дедлайны по каждому этапу. Договоритесь, как вам будут сдавать работу — например, в виде созвона-презентации или при личной встрече.
Исходя из всей информации укажите стоимость разработки. Этот этап согласовывается с исполнителем: готов он взяться за работу по этой цене или нет. Но можно указать пожелания по бюджету, чтобы разработчик ориентировался на них.
Тестирование, приёмка и критерии готовности
Пропишите, что разработчик перед сдачей должен протестировать интернет-ресурс на работоспособность по важным для вас критериям (совместимость с браузерами, адаптивность под разные устройства, работоспособность всех функций, интеграции, отсутствие «битых» ссылок и т. д.). Если в процессе тестирования или приёмки обнаружатся ошибки и нарушения изначального ТЗ, исполнитель должен их исправить.
На основе готового технического задания составьте чек-лист, по которому будете принимать сайт. В нем важно учесть все перечисленные функции, дизайн, страницы, интеграции, другие элементы. По каждому пункту нужно пройтись и удостовериться, что он выполнен. Опишите также, что считается готовым сайтом — полностью функционирующий ресурс, доступный для администрирования, использования в бизнесе. В процесс приема-передачи сайта должны быть включены предоставление документации, ресурсов и доступов к нему. Только после конечной приемки проект считается завершенным, а сайт готовым к использованию.
Техническая поддержка после разработки
Дополнительно вы можете заключить с разработчиком соглашение о технической поддержке сайта в процессе его работы. В него входят исправления ошибок, регулярные обновления, администрирование, обеспечение доступности, резервные копии, другие задачи. Глубина такого обслуживания обсуждается исходя из возможностей исполнителя и пожеланий заказчика.
Частые ошибки при составлении ТЗ
Нежелание советоваться с разработчиком
Как клиент вы понимаете, какой цели желаете добиться. Но опытный исполнитель лучше разбирается в своей работе: он подскажет, как получить тот или иной результат, что можно удалить без вреда для проекта, а что добавить. Без этих знаний вы рискуете получить неэффективный ресурс или поставить невыполнимую задачу.
Слишком общее описание
Если исполнитель вместо технического задания получит «размышления на тему создания сайта» или просто общее описание в духе «сделайте просто, понятно, красиво», результат может не понравиться клиенту. Потому что разработчик не способен заглянуть заказчику в голову, чтобы понять, чего же тот действительно хочет. Важно подробно указать основные требования, проиллюстрировать их, подчеркнуть важные элементы для реализации.
Не указан тип интернет-ресурса
Для качественной разработки исполнитель должен понимать, что именно он делает. У каждого сайта есть тип — блог, интернет-магазин, форум, корпоративный сайт, визитка и т. д. У них есть отличительные особенности и обязательный функционал, который важно реализовать.
Недостаточно примеров на отдельные блоки или сайты в целом
Чем больше иллюстраций и ссылок получит исполнитель, тем лучше он сможет понять ожидания клиента.
Не прописаны технические нюансы
Помимо внешнего вида сайта важно наполнить его функциями, которые помогут с ним работать. Например, веб-аналитика покажет, что и как именно пользователи делают на сайте. А без правильной семантической разметки поисковые системы не смогут быстро извлечь информацию со страницы.
Отсутствие целей и сценариев пользователей
Чтобы сайт работал, вы должны сами понимать, что клиенты будут на нем делать, с какими целями обращаться к интернет-ресурсу. Это важно для правильного оформления, настройки аналитики, расположения блоков, а также десятка других мелких элементов, которые приводят к выполнению целевых действий и продажам.
Нет критериев приёмки
После окончания работ клиент должен оценить и принять результат. Для этого в ТЗ важно указывать, по каким критериям можно судить о выполнении задачи. Это защитит и клиента от ленивых разработчиков, и исполнителя от слишком придирчивых заказчиков.
Попытка писать код вместо результата
Не нужно объяснять разработчикам, как и с помощью чего они должны реализовать функцию. Опишите результат, а разработчик уже поймет, какими средствами его воплотить.
Отсутствие приоритетов
Невозможно выполнить все задачи сразу — например, из-за отсутствия времени, ресурсов или данных. Поэтому заранее определите наиболее или наименее важные пожелания, чтобы исполнитель понимал, за что ему браться в первую очередь, а с чем можно повременить.
Рекомендации и заключение
Техническое задание — важный документ для описания разработки сайта. Он отображает все важные для заказчика нюансы, от дизайна до SEO. При грамотном подходе техзадание экономит время, деньги, нервы и упрощает процесс разработки. Это одновременно фундамент будущего сайта и инструмент, необходимый для управления проектом, от заключения договора до начала использования. Вот почему к ТЗ нельзя относиться как к простой формальности.
ТЗ может быть чрезвычайно подробным, когда требуется создать объемный интернет-ресурс со множеством функций или страниц. Но если вам нужен небольшой сайт-визитка или интернет-магазин на десяток товаров, достаточно небольшого техзадания.
Техническое задание должно быть подробным, точным и конкретным, но без излишней информации вроде истории компании на рынке или пространных описаний вашего пользователя. Требования должны быть четкими, однозначными, понятными. Это повышает шанс на разработку сайта, который действительно решает бизнес-задачи.

Алексей Штарев
CEO PromoPult
Источник: blog.promopult.ru
