Разрабатываем ТЗ на разработку сайта грамотно. Основные рекомендации, примеры и разбор ошибок

ТЗ на сайт – так ли оно нужно

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

Мало кто обходится без составления технического задания при разработке сайта. Работать без него нецелесообразно, тем более в digital сфере. Обоснуем.

Заказчику ТЗ необходимо, так как оно:

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

Подрядчику этот документ помогает:

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

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

Как составляется ТЗ и кто этим занимается

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

Главные пункты технического задания

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

Организационные моменты:

  • сроки готовности сайта. Этот параметр индивидуален для каждого конкретного проекта. Так, создание сайта с нуля, со сложным функционалом и разветвленной структурой, потребует минимум одного месяца. Разработка сайта, создаваемого с помощью шаблона, займет от 2 до 4 недель. Лендинг на шаблоне делается еще быстрее;
  • описание объема работ. Естественно, сайт-визитка и интернет-магазин с каталогом и возможностью продаж, требуют разных трудозатрат. Что и уточняется в соответствующем разделе;
  • подробное описание каждого этапа, начиная от дизайна, особенностей движка, структуры, содержания, предпочтительного контента и заканчивая доменным именем. Обо всем этом и многом другом поговорим чуть ниже.

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

Здесь прописываются следующие нюансы:

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

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

Примеры. Как это может выглядеть

Ниже приводим пример из ТЗ, в котором указано содержание документа.

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

Оглавление

  1. Термины и определения
  2. Общие положения
  3. Цели проекта
  4. Задачи проекта
  5. Структура Сайта
  6. Требования к функциональному назначению страниц сайта
  7. Типы данных
  8. Требования к html-вёрстке страниц
  9. Требования к CMS
  10. Требования к хостингу
  11. Условия приёмки работ и требования к передаче сайта
  12. Гарантийные обязательства
  13. Требования к ведению проекта, согласованию и предоставлению результатов работ
  14. Ожидаемые результаты исполнения Договора
  15. Права на результаты интеллектуальной деятельности

А вот так выглядит фрагмент из пункта «Задачи проекта»:

  1. Задачи проекта

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

4.1.  Аналитика и проектирование:

4.1.1.  Сбор и обработка входящих требований, аналитика.

4.1.2. Проектирование ключевых страниц сайта.

4.2. Создание дизайн-концепции:

4.2.1.  Разработка дизайн-концепции сайта на примере 1 главной и 2 внутренних страниц.

4.3. Создание дизайн-макетов всех страниц Сайта:

4.3.1. Разработка дизайн-макетов внутренних страниц Сайта.

4.4. Верстка

4.4.1. Подготовка макетов к верстке;

4.4.2. Верстка шаблонов;

4.4.3. Адаптивная верстка.

4.5. Настройка CMS и программирование

4.5.1. Создание и настройка структуры сайта, меню, статических страниц.

4.5.2. Настройка шаблонов страниц в соответствии с прототипами сайта.

4.5.3. Настройка стандартных компонентов и основного функционала CMS 1С-Битрикс.

4.5.4. Разработка динамических компонентов и дополнительного функционала сайта.         

Еще один пример, где регламентируется структура сайта.

Необходимо создать структуру (шаблон) сайта, состоящую из следующих элементов:

  1. “шапка” (хедер). В данном блоке необходимо расположить логотипы предприятия и герб города, также название предприятия;
  2. блок отображения меню главного меню сайта. Данный блок должен содержать перечень всех основных страниц. Требования к меню будут изложены далее. Меню должно поддерживать иерархическую структуру, дочерние элементы меню должны быть “выпадающими” (данный эффект необходимо создать с использованием языка JavaScript). Меню должно располагаться слева на сайте;
  3. Блок отображения нескольких последних новостей;
  4. Блок для входа зарегистрированных пользователей на сайт;
  5. Блок отображения погоды;
  6. “подвал” (футер) сайта. В данном блоке необходимо разместить краткую контактную информацию о предприятии;
  7. Блок отображения различного рода графической информации (рекламные баннеры, изображения и т.п.). Данные блоки могут добавляться по мере необходимости.

Выбираем движок сайта (CMS)

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

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

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

  • Drupal, WordPress, OpenCart, Joomla,
  • самописный движок,
  • фреймворк,
  • SaaS-платформы – Tilda, Wix.

Дизайн

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

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

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

Основные разделы сайта

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

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

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

Содержимое страниц и их главные элементы

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

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

Генерация страниц

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

Страницы с фильтрами

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

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

  • Использование только статических ссылок с семантическим URL для страниц фильтров первого уровня или для пересечения двух параметров. Обеспечение возможности самостоятельной настройки тегов (Title, Description, заголовки H1-H6, Keywords).
  • Соблюдение порядка при создании URL-фильтров позволит избежать ошибок или неработающих параметров.
  • Настройка индексирования страниц-фильтров и корректно работающая перелинковка внутри сайта.

Контент

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

О поддерживаемых технологиях

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

  1. Обязательное наличие мобильной версии сайта и как вариант – адаптивного шаблона.
  2. Кроссбраузерность – верстка, предполагающая корректное и идентичное отображение сайта во всех современных браузерах.
  3. Попадание в «зеленую» зону по системе оценки пользовательского контента Google Core Web Vitals по следующим позициям:
  • скорость загрузки основного контента (LCP ) – менее 2,5 секунд,
  • показатель смещения элементов во время загрузки страницы (CLS) – ниже 0,1 балла,
  • время ожидания до первого взаимодействия с контентом (First Input Delay) LCP— менее 100 миллисекунд.
  1. Первоначальная поисковая оптимизация поисковых страниц.
  2. Корректный код ответа для всех страниц.
  3. Настроенный доступ посредством FTP.
  4. Семантический URL.
  5. Наличие стандарта ограничения доступа роботам в документе robots.txt.
  6. Карта сайта (пользовательская и XML).

Доменная зона и доменное имя

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

  • Присутствие в доменном имени продающих слов kupibilet, salesshop.
  • Включение названия компании в состав доменного имени: vkusnoitochka.ru, eldorado.ru.
  • Использование дополнительных ключевых слов, близких тематике сайта. Предоставляется заказчиком.
  • Предпочтительная доменная зона: .RU, .COM, .BIZ, .UK, .ORG и пр.
  • Тематика или категория доменного имени: одежда, мебель, образование, медицина и пр.

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

Хостинг и провайдер и требования к ним

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

  • Разновидность хостинга (виртуальный, серверы, VPS).
  • Функция быстрой установки CMS.
  • Наличие следующих технологий: защита от DDoS-атак, доступ по SSH, возможность бекапов.
  • Минимальная дисковая квота.
  • Указание ориетировочной статической нагрузки аккаунта.
  • Примерный трафик: предполагаемое количество пользователей на сайте за сутки.
  • Встроенный файловый менеджер.
  • Возможность бесплатного переноса сайта.

Ошибки при создании ТЗ, которых следует избегать

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

  • Не обозначен тип сайта. Без знания этой детали надеяться на положительный итог не стоит. Исполнитель точно должен знать с чем ему придется работать Иначе досадных недоразумений не избежать.
  • Не ясна цель и не понятны действия, ради которых создается сайт. Без этого уточнения исполнителю трудно понять, чего, собственно, хочет клиент для своего бизнеса. Страдает первичная настройка аналитики, что в будущем негативно отразится на продажах.
  • Отсутствует упоминание о пользовательских сценариях, то есть о том, для какой цели пользователи вообще будут заходить на этот сайт.
  • Клиентом не предоставлены референсы – примеры сайтов. Разработчику трудно будет понять, от чего отталкиваться. Тогда как при наличии образцов дело пойдет значительно быстрее.
  • Упущен момент установки счетчиков веб-аналитики. Для минимального набора это Яндекс Метрика и Google Search Console.
  • Не оговорен вопрос о семантической разметке сайта, которая обеспечивает лучшее понимание контента поисковой системой. Это особенно актуально для коммерческих сайтов, занимающихся продажами.

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

Закажите анализ сайта

Оставьте свои данные для обратной связи в форме заявки и наш менеджер свяжется с вами в течении 20 минут

Выберите удобный способ связи для консультации
Телефон
E-mail
Whatsapp
Telegram
Введите Имя корректно
Введите Телефон корректно
Введите Сайт корректно
Заполняя форму, я принимаю условия передачи информации
Введите Имя корректно
Введите E-mail корректно
Введите Сайт корректно
Заполняя форму, я принимаю условия передачи информации
LEadBRO Закажите анализ сайта

Как проверить сайт на фильтры поисковых систем
Как проверить сайт на фильтры поисковых систем
Статья о поисковых фильтрах и о том, как проверить сайт на попадание под санкции поисковых систем
Топ расширений браузера для быстрой работы над сайтом
Маркетинг
SEO
Продвижение
Топ расширений браузера для быстрой работы над сайтом
Список расширений, которые помогут оптимизировать и ускорить работу над сайтом маркетологу, Seo-специалисту, собственнику сайта
Список факторов ранжирования Google в 2024 году
SEO
Продвижение
Список факторов ранжирования Google в 2024 году
Статья о том, какие факторы влияют на ранжирование сайта в поисковой выдаче Google в 2024 году
Как продвигать сайт самому в 2024 году
Продвижение
Как продвигать сайт самому в 2024 году
Если у вас есть сайт, но посетители его не видят и вы ищите способ бесплатной раскрутки сайта своими силами, эта статья для вас. В ней мы расскажем о
Как определить текст, написанный нейросетью
SEO
Маркетинг
Как определить текст, написанный нейросетью
Мы протестовали наиболее популярные сервисы проверки текста на ИИ и делимся с вами своим опытом
Создание объявлений в Яндекс Директе
Маркетинг
Продвижение
Реклама
Создание объявлений в Яндекс Директе
Яндекс Директ – платформа размещения контекстной и медийной рекламы на страницах поисковой системы Яндекс и сайтах партнеров Рекламной сети
Как добавить организацию в Яндекс Бизнес
Маркетинг
Реклама
Продвижение
SEO
Как добавить организацию в Яндекс Бизнес
Яндекс.Справочник – интернет-каталог компаний и организаций, данные которого отображаются в поисковой выдаче Яндекса в локальном поиске
Всплывающие окна (Pop-Up) – руководство по эффективным объявлениям
Маркетинг
SEO
Реклама
Продвижение
Всплывающие окна (Pop-Up) – руководство по эффективным объявлениям
Всплывающее окно – это окно, которое автоматически появляется («всплывает») на веб-сайте во время его просмотра пользователем, часто само по себе.
Способы повышения E-A-T на сайте
SEO
Продвижение
Маркетинг
Способы повышения E-A-T на сайте
Аббревиатура E-A-T расшифровывается как «expertise, authoritativeness, trustworthiness»
Основные различия между сервисами продвижения Яндекса и GOOGLE
SEO
Основные различия между сервисами продвижения Яндекса и GOOGLE
Продвижение в поисковых системах Яндекс и GOOGLE хоть и имеет ряд схожих черт в используемых SEO-стратегиях, но есть и много отличий!
Инструкция по установке счетчика Яндекс Метрика
SEO
Маркетинг
Инструкция по установке счетчика Яндекс Метрика
Яндекс Метрика сегодня считается одним из самых популярных бесплатных сервисов, с помощью которого можно можно получить много аналитики по сайту
Фриланс и фрилансеры – разбираемся в понятиях
SEO
Реклама
Продвижение
Разработка
Маркетинг
Поддержка
Фриланс и фрилансеры – разбираемся в понятиях
Говоря простыми словами, фриланс – это удаленная работа. Такой вариант характеризуется отсутствием постоянного трудоустройства.....
Создаем сайт бесплатно с помощью конструктора. Топ 15 ресурсов
Разработка
Маркетинг
Создаем сайт бесплатно с помощью конструктора. Топ 15 ресурсов
Создать веб-сайт без участия профессионального программиста можно с помощью ресурса, называемого конструктор сайтов.
Каким должен быть продающий сайт?
Маркетинг
Разработка
Каким должен быть продающий сайт?
Однажды холодный лид зашел на сайт и превратился в постоянного лояльного клиента. И друзья его тоже потом стали клиентами, а затем и друзья друзей…
Фильтры и блокировки от поисковика. Что делать и как избежать?
SEO
Продвижение
Фильтры и блокировки от поисковика. Что делать и как избежать?
Разбираемся в причинах наложения фильтров и блокировках сайтов. Как этого избежать и что делать, если на ваш сайт наложен фильтр.
«Магические» формулы продающих текстов
Продвижение
«Магические» формулы продающих текстов
Формулы продающих текстов помогут как начинающим, так и опытным авторам писать действительно работающие материалы.
Как рекламироваться в соц сетях в новых реалиях ?
Продвижение
Как рекламироваться в соц сетях в новых реалиях ?
Таргетированная реклама – один из наиболее актуальных интернет-инструментов для продвижения бизнеса.
Как убедиться,  что ваш SEO-подрядчик делает всё правильно
SEO
Продвижение
Как убедиться, что ваш SEO-подрядчик делает всё правильно
Современный SEO-специалист владеет всеми профессиональными навыками и инструментами. Развитие технологий требует от него много навыков и компетенций.
Как продвигать товар на маркетплейсах?
Продвижение
Как продвигать товар на маркетплейсах?
Рынок маркетплейсов активно растёт. Для многих продвижение на маркетплейсах – точка роста для бизнеса и основной канал продаж.  Правильное продвижение
SEO-инструменты, актуальные в 2023 году
Продвижение
SEO
SEO-инструменты, актуальные в 2023 году
Ускорить продвижение сайта и повысить качество работы можно, применяя автоматизацию процессов при поисковом продвижении сайта.
О важных трендах веб-дизайна в 2023 году
Продвижение
Разработка
О важных трендах веб-дизайна в 2023 году
О важных трендах веб-дизайна в 2023 году, которые сделают ваш сайт современным и адаптивным.