ТЗ на разработку сайта: этапы и примеры

Зачем нужно ТЗ для разработчиков

Программисты, SEO-специалисты, авторы и клиенты говорят на разных языках. Именно конкретное ТЗ позволяет быстро найти консенсус и почти наглядно объяснить, какого результата надо достичь. Техническое задание для разработчика, прежде всего, показывает, какие есть пожелания по работе и внешнему виду сайта у заказчика. А еще, и об этом мы подробнее скажем чуть позже, — какие требования к проекту выдвигает сеошник. Ну а без ТЗ, как известно, результат ХЗ…

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

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

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

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

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

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

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

Если вы обращаетесь в полноценное digital-агентство, то разработкой ТЗ на сайт может заниматься не только команда программистов, но и отдел сеошников. Такой подход, например, LZ.Media реализует в своей практике. И сейчас мы расскажем, в чем его преимущества.

Почему SEO-специалист должен ставить ТЗ разработчику

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

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

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

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

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

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

Общие требования

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

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

• Необходимая скорость загрузки;
• Требования к хостингу;
• Доменная зона;
• Наличие мобильной версии;
• Доступ через FTP;
• Наличие карты сайта.

Наш образец ТЗ на разработку сайта: начало

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

Также, если вы еще не обсуждали с разработчиком, на каком “движке” будет проект, то самое время указать в данном разделе, какая система в данном случае предпочтительнее. Пропишите, кто будет работать в административной панели CMS (например, сайтом управляют члены команды заказчика или только сеошники и разрабы с аутсорса), кто будет публиковать контент и обслуживать ресурс.

Когда CMS уже выбрана, в ТЗ указываются требования к конкретной системе. Например, мы, работая чаще с WordPress, пишем про то, какие инструменты использовать для меню, блоков, кнопок, а также напоминаем, где информация должна подтягиваться автоматически, а не заполняться вручную на каждой странице. А вот для MODX и “Битрикс” важно указывать, допустим, про смену метатегов через админку, редактирование robots.txt и генерацию sitemap.

Вредный совет: Если вы не настроены на легкое сотрудничество и у вас в запасе много времени (и денег) на доработки, избегайте в ТЗ конкретики всеми силами. Пишите что-нибудь в духе: “сайт должен работать быстро”, “сайт должен быть качественным и удобным”, “нужно, чтобы сайт нравился людям”. Ну а если такой заведомо провальный подход вам не близок, помните о важности цифр в задании и указывайте точное количество всего, что вообще может иметь исчисление на сайте.

Работа со страницами

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

Пример ТЗ для разработчика на конкретную страницу и отдельные ее блоки от LZ.Media

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

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

Так выглядит наш шаблон ТЗ для разработки отдельных блоков

Что еще должно быть в ТЗ разработчику

Начнем с полезной базы:

• Объяснение SEO-терминов и терминов из бизнес-ниши клиента. Это поможет разработчику быстрее погрузиться в контекст. Особенно такой внимательный подход важен, если вы только начали сотрудничество со специалистом. Если ТЗ составляет сам разработчик, то для понимания со стороны клиента нужно будет расшифровать сложные определения или профессиональные IT-словечки. Да, не все заказчики могут знать значения слов “движок” или “подвал сайта”.
• Скриншоты и референсы. Иногда отдельные механизмы работы сайта или структуру и оформление страниц проще показать наглядно, чем долго объяснять. Эта часть ТЗ обычно состоит из двух частей: примеры сайтов, которые нравятся заказчику, и сайты конкурентов, которые находятся в топе выдачи, согласно анализу сеошника.

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

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

На этом у нас всё. Помните: будьте к своим коллегам добрее и терпимее, и они ответят вам тем же. Мир, дружба, разработка. Ах да, и LZ.Media, конечно.

Подписывайся на наши соцсети — там мы рассказываем о своей работе и анонсируем новые статьи: LZ.Media в ВК и телеграм.