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