Техническое задание: Разработка многостраничного сайта на WordPress (2 локации)
## 1. Общие положения и цель проекта
**Цель проекта:** Разработка быстрого, адаптивного (mobile-first) сайта-визитки с мультилокацией для компании, предоставляющей услуги по монтажу и ремонту. Основная задача — прием лидов через форму обратной связи с **автоматической привязкой к конкретной локации и услуге** (без выбора со стороны клиента), а также оптимизация под локальный поиск (SEO).
**Важно:** В будущем заказчик должен иметь возможность **самостоятельно добавлять новые услуги** через стандартные страницы WordPress, без необходимости редактировать код или меню.
**Движок (CMS):** WordPress (последняя стабильная версия).
**Бюджет:** [По договоренности].
**Сроки:** [Указать количество дней/недель].
---
## 2. Структура сайта (Карта страниц)
Необходимо реализовать следующую иерархию страниц:
1. **Главная страница (/)**
* Выполняет роль разводящей. Основная задача — побудить пользователя выбрать его город.
2. **Страницы локаций (родительские разделы):**
* `/calgary/` (Калгари)
* `/oshawa/` (Ошава)
3. **Страницы услуг (дочерние по отношению к локациям):**
* `/calgary/tv-mounting/` (Установка ТВ)
* `/calgary/furniture-assembly/` (Сборка мебели)
* `/calgary/house-painting/` (Покраска домов)
* *(Аналогичная структура для `/oshawa/`)*
* **Важно:** В будущем заказчик сможет создавать новые дочерние страницы услуг (например, `/calgary/new-service/`) стандартными средствами WordPress.
4. **Блог:**
* `/blog/` (Общий раздел)
* Возможность публикации статей как в общий блог, так и привязка советов к конкретным услугам.
---
## 3. Требования к дизайну и верстке (Адаптивность)
1. **Тип верстки:** Mobile-first. Сайт должен безупречно отображаться на всех типах устройств: смартфоны (320px+), планшеты (768px+), десктопы (1920px+).
2. **Визуальное оформление:**
* Чистый, современный минимализм, вдохновленный предоставленными скриншотами.
* Основной акцент — на удобство чтения и понятные кнопки призыва к действию (CTA).
---
## 4. Описание страниц и функциональных блоков
### 4.1. Главная страница (Разводящая)
* **Хедер:** Логотип, минимальное меню (Главная, Блог, Контакты).
* **Основной экран (Hero):** Заголовок (H1): "Профессиональные услуги по дому". Подзаголовок: "Выберите ваш город для продолжения".
* **Блок выбора локации:**
* Две крупные кнопки: "Калгари" и "Ошава" (как на втором скриншоте).
* **Футер:** Краткая контактная информация, копирайт.
### 4.2. Страница локации (родительская), например /calgary/
* **URL:** `/calgary/` (ЧПУ).
* **Хедер:** Логотип, **автоматическое меню** (должно само подтягивать все дочерние страницы-услуги), кнопка "Get Quote".
* **Контент:**
* H1: "Услуги в Калгари".
* Блок "О нас / Описание": Уникальный текст для города.
* **Блок сервисов (услуги):** Автоматический вывод всех дочерних страниц (услуг) в виде карточек. Каждая карточка содержит: название услуги, краткое описание (из страницы), кнопка "Подробнее".
* **Блог (виджет):** Вывод 2-3 последних статей, относящихся к данной локации.
* **Карта:** Интерактивная карта Google Maps с меткой города.
* **Форма "Get Quote":** Поля: Имя, Телефон, Email. **Никакого выпадающего списка услуг!**
* **Футер:** Контакты (телефон, email), часы работы.
### 4.3. Страница услуги (дочерняя), например /calgary/tv-mounting/
* **URL:** `/calgary/tv-mounting/` (ЧПУ).
* **Шапка и футер:** Наследуются от родительской страницы локации (меню с услугами автоматическое).
* **Контент:**
* H1: "Установка телевизора в Калгари" (формируется автоматически из названия страницы и родительской локации).
* **Блок описания:** Подробное описание услуги.
* **Галерея:** Слайдер или сетка изображений (3-5 фото) примеров работ.
* **Блог (советы по теме):** Вывод 1-2 статей из соответствующей рубрики.
* **Кнопка "Get Quote"** (ведет к форме).
* **Форма связи:** Аналогичная форме на родительской странице (Имя, Телефон, Email).
### 4.4. Блог
* Общий архив записей `/blog/`.
* Архивы по категориям (например, `/blog/tv-tips/`, `/blog/furniture-tips/`).
* Отдельная запись блога: стандартный вид (заголовок H1, дата, текст, картинки).
---
## 5. Технические требования (Спецификация)
### 5.1. Ключевое требование: Простота добавления новых услуг
* Все страницы услуг создаются как **обычные дочерние страницы** соответствующих локаций (Калгари/Ошава).
* **Меню в шапке должно быть динамическим:** Оно должно автоматически отображать ссылки на ВСЕ дочерние страницы текущей локации. Заказчику не нужно редактировать меню вручную при добавлении новой услуги.
* **Блок услуг** на странице локации также должен автоматически выводить все дочерние страницы (услуги).
### 5.2. Интеграция с Telegram (автоматическое определение)
1. **Задача:** Все данные из форм должны отправляться в Telegram-чат.
2. **Формат сообщения (критически важно):**
* Сообщение должно **автоматически определять**:
* **Название услуги** — берется из заголовка текущей страницы (если это страница услуги) или передается как "Общая заявка с страницы локации", если форма заполнена на родительской странице.
* **Локацию** — берется из названия родительской страницы (Calgary / Oshawa).
* Клиент **не выбирает** услугу из списка — система сама понимает, откуда пришла заявка.
3. *Пример уведомления:*
> 🔥 **Новая заявка!**
> **Услуга:** Установка ТВ
> **Локация:** Калгари
> **Имя:** Иван
> **Тел:**
> **Email:**
### 5.3. SEO-настройка
1. **Заголовки:** Строгая иерархия. Один H1 на странице.
2. **Плагин SEO:** Установка и настройка Rank Math или Yoast SEO (Title, Description, ЧПУ, sitemap).
3. **Микроразметка LocalBusiness:** На всех страницах локаций. Содержит название компании, адрес (для Калгари и Ошавы отдельно), телефон, часы работы.
### 5.4. Движок и скорость
* Запрет на тяжелые конструкторы страниц (тяжелый Elementor Pro). Допустим Gutenberg или легкие конструкторы (Kadence Blocks и т.п.) с контролем чистоты кода.
* Оптимизация скорости: сжатие изображений, минимизация скриптов, кеширование.
### 5.5. Блог
* Создать рубрики, соответствующие услугам: "Установка ТВ", "Сборка мебели", "Покраска домов".
* Статьи должны выводиться на соответствующих страницах услуг (как "советы по теме").
---
## 6. Результат работы (Что сдаем?)
1. Полностью готовый сайт на WordPress.
2. Исходные файлы темы.
3. Дамп базы данных (SQL).
4. **Инструкция по администрированию (обязательно):**
* Как создать новую услугу (пошагово, со скриншотами).
* Как изменить телефон/контакты для локации.
* Как проверить работу Telegram-бота.
5. Видеопрезентация работы форм и ключевых функций.
---
## 7. Критерии приемки
1. Сайт корректно отображается на всех устройствах (мобильные, планшеты, десктоп).
2. При создании новой дочерней страницы (услуги) для Калгари или Ошавы:
* Она автоматически появляется в меню на соответствующей странице локации.
* Она автоматически появляется в блоке услуг на странице локации.
3. Формы отправляют данные в Telegram. В сообщении **автоматически** указаны правильная услуга и локация (без выбора со стороны клиента).
4. Проверена иерархия заголовков (нет ошибок).
5. В коде страниц локаций присутствует микроразметка LocalBusiness.
6. Скорость по Google PageSpeed Insights: не ниже 85+ (мобильные) и 90+ (десктоп).
---
## 8. Вопросы к исполнителю (для фриланс-биржи)
При отклике прошу ответить на вопросы:
1. Каким образом вы реализуете **автоматическое меню**, чтобы при создании новой страницы-услуги она сразу появлялась в шапке без моего участия?
2. Как будет технически реализована отправка в Telegram с **автоматическим определением названия услуги и локации** (без поля выбора в форме)?
3. Какой конструктор/подход планируете использовать для верстки, чтобы сайт был быстрым?