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

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

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

Преимущества формирования ТЗ для разработки сайта для заказчика очевидны:

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

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

3. Страхование. Готовый сайт не соответствует заявленным требованиям? При наличии подписанного договора можно направить претензию компании и взыскать моральный вред.

4. Исключить задержку из-за смены сотрудника. Разногласия между заказчиком и разработчиком — не редкость. При возникновении спора можно передать техническое задание другой компании, исключив при этом этап его повторного составления.

Наличие технического задания также полезно и для исполнителя, поскольку:

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

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

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

Наличие официального документа позволяет:

• избежать бесплатных доработок;
• защитить свои права, если заказчик захочет внести существенные изменения в задание.

Клиент также должен участвовать в этом процессе. Он решает следующие задачи:

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

Участие заказчика в разработке ТЗ позволяет:

• точно понять, какой необходим сайт;
• определиться с бюджетом;
• контролировать специалиста в части сроков, функционала и доработок.

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

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

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

Предпроектное проектирование осуществляется с помощью офисных программ (World или Excel) или специализированных ресурсов. Также можно смоделировать шаблон сайта на листе А4.

Основу документа заказчик может разработать сам и направить потенциальному исполнителю для ознакомления. У компетентного эксперта может возникнуть ряд вопросов для уточнения и детализации задания.

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

Разработка документа осуществляется на следующих принципах:

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

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

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

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

2. Объем проектирования и разработки. Зависит от цели, которую преследует заказчик. Для сравнения: затраты на создание одностраничного лендинга и полноценного интернет-магазина с различными сервисами существенно различаются.

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

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

Все требования можно разделить на 2 группы: общие (классические) и технические.

В первый раздел включаются следующие параметры:

• потенциальная клиентская база сайта;
• цель создания ресурса;
• домен (при наличии);
• количество страниц;
• содержание шапки;
• информация, отображаемая в подвале;
• список терминов с расшифровкой их обозначений.

К техническим условиям к сайту можно отнести:

• нормальную скорость открытия ресурса (в идеале не более 3-х секунд);
• видимость во всех браузерах;
• оптимизацию под мобильные устройства;
• «легкость» графики (отсутствие проблем с загрузкой).

В эту группу входят также требования к безопасности сайта. Здесь стоит обратить внимание на:

• эффективность выбранной системы управления;
• безопасность общего и выделенного хостинга (должны обеспечивать нормальную работу ресурса при минимальной вариативности действий);
• бекап сайта (его резервное хранение).

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

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

• самописный движок;
• конструктор сайтов;
• CMS (Joomla, Drupal, Wordpress).

Использование CMS предусматривает следующие преимущества:

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

При выборе самописного движка можно получить:

• полный контроль над управлением ресурсом;
• возможность применения нестандартных функций;
• исключение уязвимостей, характерных для конструкторов сайтов и CMS.

К плюсам конструктора сайтов можно отнести:

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

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

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

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

Детальные требования необходимо включить в рабочее задание для дизайнера. Это касается оформления стартовой страницы, выбора цветовых решений, форм, размеров, трехколоночных и иных построений страниц.

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

При выборе способа навигации рекомендуем:

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

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

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

При генерации служебных страниц обратите внимание на следующие правила:

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

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

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

• задействование статистических ссылок;
• возможность самостоятельной настройки тегов;
• наличие порядка в формировании URL-файлов;
• корректную перелинковку.

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

• семантическому ядру;
• водности;
• размещению ключевых слов;
• изображениям, видео, инфографике.

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

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

• наличие мобильного приложения;
• кроссбраузерность (одинаковое отображение во всех веб-обозревателях);
• правильность и корректность кода ответа сервера;
• доступность и работоспособность ftp-сервера;
• использование карты сайта.

Домен должен удовлетворять классическим требованиям:

• число символов: от 3 до 63 символов;
• использование букв латинского алфавита и цифр.

Для повышения узнаваемости сайта в домене может быть отражено:

• наименование организации;
• название продукта;
• keywords;
• сокращение или аббревиатура.

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

• его тип;
• минимально возможную дисковую квоту;
• прогнозную нагрузку на сервер;
• расчетный трафик сайта;
• поддержку выбранных технологий.

1. Сайты-образцы можно найти на специализированных ресурсах в Интернете. В частности, на allawards.ru и Similarweb представлены креативные и функциональные сайты. Также можно обратиться к зарубежным платформам, но здесь важно учитывать, что простое их копирование — не лучшее решение, так как есть существенные различия между менталитетами пользователей.

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

3. Уделите отдельное внимание шрифту. Классическая коллекция Microsoft World используется повсеместно, поэтому обратите внимание на иные аналоги, размещенные в библиотеках шрифтов. Например, в allfont.ru можно найти уникальный шрифт для интернет-магазина.

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

1. Сайты-образцы можно найти на специализированных ресурсах в Интернете. В частности, на allawards.ru и Similarweb представлены креативные и функциональные сайты. Также можно обратиться к зарубежным платформам, но здесь важно учитывать, что простое их копирование — не лучшее решение, так как есть существенные различия между менталитетами пользователей.

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

3. Уделите отдельное внимание шрифту. Классическая коллекция Microsoft World используется повсеместно, поэтому обратите внимание на иные аналоги, размещенные в библиотеках шрифтов. Например, в allfont.ru можно найти уникальный шрифт для интернет-магазина.

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

Документ содержит следующие классические разделы:

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

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

1. В ТЗ отсутствует информация о типе сайта (новостной портал, корпоративный, интернет-магазин, авторский блог). Разработчику приходится руководствоваться собственной интуицией или задавать большое количество дополнительных вопросов.

2. В документе не указаны целевые действия, на которые он ориентирован (переход по ссылке, заполнение формы обратного звонка, добавление товара в корзину, покупка, регистрация). Это необходимо для корректной настройки аналитики.

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

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

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

6. Нет требования к установке счетчика веб-аналитики. В результате владельцу придется самостоятельно ее настраивать для оценки значимых действий пользователей.

7. Наличие сложных терминов. Их необходимо обязательно пояснить (дать расшифровку в документе), чтобы избежать неоднозначной трактовки.

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