Техническое задание: Разработка многостраничного сайта на 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. Какой конструктор/подход планируете использовать для верстки, чтобы сайт был быстрым?