Техническое задание на разработку сайта: как правильно составить и оформить

Вступление

Что нужно писать в техзадании? Кто и зачем должен этим заниматься? Специалисты DIART AGENCY делятся полезными инструкциями и рекомендациями, которые помогут разработать техническое задание на разработку сайта правильно.

Для чего нужно техническое задание

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

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

Преимущества ТЗ для заказчика

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

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

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

Преимущества ТЗ для исполнителя

Исполнитель, проект-менеджер digital-агентства или разработчик-фрилансер, также заинтересован в составлении подробного вдумчивого техзадания по ряду причин. К ним относятся:

Способ ясно обозначить задачу. Быстро и без проблем разработать нужный ресурс поможет описание всех значимых для заказчика деталей.
Возможность «блеснуть». Классное ТЗ наглядно продемонстрирует экспертность исполнителя.
Защита проделанной работы (и гарантия оплаты). Представьте ситуацию: подрядчик берет в работу крупный проект, разрабатывает сложный веб-ресурс, погружается в тематику, тратит свое время…и представляет готовый сайт заказчику. Но заказчик недоволен! Он утверждает, что хотел CMS на Java, а не на PHP. Что делать? Обратиться к ТЗ. Если тот или иной нюанс не был прописан в документе, то клиент не может требовать его выполнения.
Способ заработать. ТЗ – это первый важный шаг при создании сайта. На этом документе базируется техническое и смысловое содержание ресурса. А потому нередко агентства и фрилансеры расценивают составление техзадания, как отдельно оплачиваемую услугу.

Особенно большое значение техзадание имеет при создании крупных веб-ресурсов со сложной структурой. Не поленитесь и сделайте ТЗ качественно…или делегируйте задачу специалистам DIART AGENCY. Мы на разработке сайтов собаку съели, а потому зададим все нужные вопросы и уточним важные детали быстро и прицельно точно. В результате вы получите подробный профессионально выполненный документ для создания 100% эффективного ресурса. Поверьте, это сэкономит ваше бесценное время и нервы.

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

В чьи обязанности входит составление ТЗ: заказчика или исполнителя? На этот вопрос нет однозначного ответа.

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

Составление ТЗ — это совместная работа заказчика и исполнителя.

Бриф на разработку сайта

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

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

После в дело вступает исполнитель и уточняет все необходимые технические детали по проекту и заносит их в документ.

Структура и объем технического задания

Каждое ТЗ состоит из двух основных смысловых разделов: организационной и технической частей.

Организационная часть: общая информация о проекте

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

Общие сведения о компании и целях создаваемого сайта.
Подробное описание ЦА сайта, ее интересов и «болей».
Описание объема работ. Важно, чтобы каждый специалист, работающий над проектом, видел «картину» в целом. Разработка простого сайта-визитки и создание интернет-магазина с поддержкой всех необходимых сторонних сервисов – это разные вещи.
Информация об особенностях будущего сайта, деталях, на которые нужно обратить особое внимание.
Сроки выполнения работы.

Разработка сайта на шаблоне занимает примерно от 2 до 4 недель. На реализацию сложных проектов, включающих создание уникального дизайна и/или внедрение сложного функционала, потребуется от 1 месяца и более.

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

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

Система управления контентом сайта (CMS). Выбор «движка» – один из первых важных выборов, с которыми предстоит столкнуться при разработке веб-ресурса. «Движок» может быть коммерческим (как 1C-Битрикс), бесплатным (как WordPress, Joomla, OpenCart) или самописным, то есть создаваемым разработчиком с нуля по требованию заказчика.
Кроссбраузерность. Важно указать, на каких версиях популярных браузеров должен работать будущий сайт.
Адаптивность. На каких устройствах будет чаще всего использоваться сайт? Нужна ли ему мобильная версия? Эту информацию также необходимо добавить в ТЗ.

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

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

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

1. Сквозные элементы

Сквозными структурными элементами называют те элементы, которые демонстрируются на всех страницах сайта. К ним относятся:

Хедер (header, шапка сайта) — отдельный информационный блок, располагающийся вверху на каждой странице сайта. В хедере содержатся название и логотип компании, элементы навигации по сайту (меню), контакты, корзина (если речь об интернет-магазине), кнопка «вход/выход» (если на сайт добавлена возможность регистрации).
Футер (footer, подвал сайта) — нижний информационный блок с полезной, но не первостепенно важной информацией. В футер обычно выносятся ссылки на социальные сети компании, полные контактные данные, навигационное меню.
Сайдбар (sidebar) — закрепленная боковая панель сайта, которая размещается справа или слева от основного контента и улучшает показатели юзабилити ресурса. Размещенная в сайдбаре информация упрощает навигацию, а также может содержать анонсы или комментарии, рекламу.
Всплывающие окна, попапы (pop-up) — элемент интерфейса, появляющийся поверх основного контента на странице в ответ на определенное действие пользователя. В попап может быть добавлена форма подписки на рассылку, заполнения заявки, заказа звонка.

В ТЗ нужно добавить как можно более подробное описание вышеуказанных элементов.

2. Уникальные страницы

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

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

Уникальными могут быть страницы самых разных типов. Из описания могут быть примерно такими:

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

Каждую уникальную страницу нужно описать максимально подробно и добавить к описанию все имеющиеся вспомогательные файлы.

3. Прочие страницы

Нередко специалисты, составляющие ТЗ на разработку сайта, забывают добавить описание структуры типовых страниц, к которым относятся:

Страницы ошибок. То есть те страницы, которые увидит пользователь в том случае, если на сайте что-то пойдет не так.

Больше примеров оформления таких страниц можно посмотреть тут.

Страница результатов поиска по сайту.
Страница авторизации пользователей.
Типовая текстовая страница. То есть структура, на основе которой будут создаваться все новые страницы сайта.

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

Лайфхаки по составлению ТЗ

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

Где взять сайты-образцы

На просторах интернета можно найти множество сайтов-образцов для вдохновения. Особо обратить внимание стоит на креативную медиа-платформу Behance, сайт конкурса профессиональных веб-дизайнеров и разработчиков Awwwards и собирающий лучшие сайты мира ресурс All Awards.

Как определить цветовую гамму

Не знаете, как выбрать цвета для сайта? Попробуйте поискать в интернете палитры хорошо сочетающихся оттенков, просто вбив в поисковую строку «подборки цветов». Или воспользуйтесь сервисами для создания цветовых схем: Adobe Color CC, Colormind, Coolors и тому подобными.

Как подобрать шрифты для сайта

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

В интернете легко найти альтернативу вышеуказанным сервисам. Найдите ту, что подойдет именно вам!

Есть ли специальные требования для написания ТЗ

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

Ошибки при написании ТЗ

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

Нет ограничений во времени

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

Отсутствие наглядности

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

Утрата данных доступа

Важно отнестись к данным доступа серьезно. Получив все нужные логины и пароли (к примеру, для входа на хостер или DNS-регистратор) от разработчика, следует аккуратно приложить их к ТЗ и не потерять впоследствии.

Качественные прилагательные

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

«На усмотрение разработчика»

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

Не прописана цель создания сайта

Нужно сразу определить, какие ключевые (читай, продающие) действия ожидаются от пользователя. В дальнейшем это значительно упростит настройку сквозной аналитики проекта.

Не учтена семантика

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

Нет пользовательских сценариев

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

Пример-образец технического задания

Заключение

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

Техническое задание на разработку сайта: как правильно составить и оформить

Вступление

Для чего нужно техническое задание

Преимущества ТЗ для заказчика

Преимущества ТЗ для исполнителя

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

Бриф на разработку сайта

Структура и объем технического задания

Организационная часть: общая информация о проекте

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

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

1. Сквозные элементы

2. Уникальные страницы

3. Прочие страницы

Рекомендации для составления ТЗ

Пишите однозначно и точно

Укажите общую информацию

Поясните сложные термины

Опишите инструменты и требования к хостингу

Перечислите требования к работе сайта

Укажите структуру сайта

Объясните, что будет на каждой странице

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

Определите, кто отвечает за контент

Опишите дизайн (если сможете)

Лайфхаки по составлению ТЗ

Где взять сайты-образцы

Как определить цветовую гамму

Как подобрать шрифты для сайта

Есть ли специальные требования для написания ТЗ

Ошибки при написании ТЗ

Нет ограничений во времени

Отсутствие наглядности

Утрата данных доступа

Качественные прилагательные

«На усмотрение разработчика»

Не прописана цель создания сайта

Не учтена семантика

Нет пользовательских сценариев

Пример-образец технического задания

Заключение

Популярное

Подпишитесь на нашу рассылку

Смотрите наши проекты

Политика в отношении обработки персональных данных

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

2. Основные понятия, используемые в Политике

3. Оператор может обрабатывать следующие персональные данные Пользователя

4. Цели обработки персональных данных

5. Правовые основания обработки персональных данных

6. Порядок сбора, хранения, передачи и других видов обработки персональных данных

7. Трансграничная передача персональных данных

8. Заключительные положения

Смотрите
наши проекты