Техническое задание
Нужно сверстать landing page на основе предоставляемого дизайна.
Дизайн в psd скину отдельно:
ТЗ в видеоформате:
PSD готовый, сетка и все такое.
Тех условия для верстки
1. блочная верстка (html5 и CSS3 приветствуется). Сайт должен быть резиновым и адекватно открываться во всех масштабах!!!
2. соблюдение стандартов W3C
3. комментирование кода (обязательно)
4. Для скриптов использовать библиотеку JQuery и ее плагины
5. Использование CSS эффектов вместо картинок (там где это возможно)
6. Hover эффекты на CSS3 (transition delay: 0.3 0.5)
7. Вставить Метрику. Коды предоставим. (настроить цели для Метрики, привязанные к успешно выполненным заявкам. Цель должна засчитываться только после того как введен корректно телефон, заявка ушла и показалось окно успеха).
8. Вставить фавикон в виде первой буквы названия либо логотипа
Моменты, которые нужно учесть:
- Логотип наверху сделать кликабельный, перебрасывающий на главную страницу
- Название страницы, отображаемое во вкладке в браузере, скопировать из самого верхнего заголовка.
Заявки должны приходить со следующими пометками в теме письма:
- Меню: «Запрос на бесплатную консультацию из меню»
- Первый экран кнопка Оставить заявку: «Заявка с первого экрана»
- Товар из карточки товара: «Заказ на конкретный товар из карточки товара» (автоматом должно подставляться название конкретного товара)
- Кнопка Заказать под карточкой товара «Заявка с сайта под карточкой»
- Кнопка Заказать просчет стоимости: «Заказ просчета стоимости»
- Кнопка Заказать просчет стоимости через 2 часа: «Заказ быстрого просчета стоимости»
- Кнопка Получить консультацию перед футером: «Заказ на бесплатную консультацию на карте»
- Кнопка Заказать звонок в футере: «заказ звонка из футера».
Вставить в формы захвата проверку ввода. Имя не обязательно. Наличие телефона обязательно. При установке курсора в поле «телефон» должен появляться шаблон номера серым цветом в формате (+_ (___) ___-____). Выводить сообщение «Введите правильно свой телефон» если телефон не заполнен.
Окна Заказать звонок и Окно успеха закрываются крестиком либо кликом вне модального окна.
Вставить ссылку на разработчика внизу по центру: Разработано в «ВОСТРЕЦОВ & ДРУЖИНИН» (адрес для ссылки vdstudio.net) и логотип.
ВАЖНО: В вашем коде будут разбираться другие! Будьте Людьми!:)
Из скриптов нужно подключить:
-Модальное окно на заказ звонка
-Модальное окно успеха
-Модальное окно с описанием каждого товара
- Модальное окно на «Оставить заявку»
- Цели для Метрики, привязанные к успешно выполненным заявкам
-Динамическое плавающее меню
Все детали рассказал в ТЗ
Дедлайн: 3 дня с момента принятия заказа с правками
Очень сильно надеемся на долгосрочное сотрудничество с толковым верстальщиком!!! + для Вас это еще один симпатичный дизайн в Ваше портфолио.
Ссылка на макет в jpeg: