Общие требования:
Необходимо сверстать адаптивный лендинг с quiz-опросом.
Имеются отрисованные макеты для десктопа и мобильных.
На промежуточных размерах (от мобильного до десктопного, для планшетов) верстка должна аккуратно тянуться.
Ссылка на макеты:
drive.google.com/drive/fo... В папке по ссылке макеты для popup.
-------
Quiz-опрос:
Это 7-й блок на сайте "ответьте на 5 вопросов..."
Представляет из себя опросник из 5 вопросов.
Каждый вопрос дает на выбор 5-6 вариантов ответа (сами вопросы напишу тому, кого выберу в проекте)
-------
Интерактивные элементы и анимация:
На розовые кнопки надо сделать эффект блеска, как на сайте respect-doors.ru
У каждой кнопки необходимо сделать свою форму. Точнее формы одинаковые, но меняется заголовок в форме и текст на кнопке.
При получении заявки должно быть понятно, из какой формы отправлена заявка
3-й блок "Ознакомьтесь с проектами" можно переключаться между проектами, а также у каждого проекта можно листать фотографии
4-й блок "И еще более 100" вкладки меняют содержимое экрана (разные фото). Сами фото увеличиваются при клике с помощью плагина fancybox
5-й блок "Стоимость наших услуг" переключение вкладок меняет содержимое с текстом и картинками
Предпоследний блок "ответы на частые вопросы" выпадающие ответы на вопросы
Если клиент не оставил заявку и решил уйти, показывать ему всплывающее окно с формой (макет в папке на drive.google)
-------
Технические требования:
Адаптивная валидная верстка многостраничного сайта, Кодировка UTF-8, DOCTYPE HTML5.
Кроссбраузерность: Firefox (последний), Chrome (последний), Safari macOS (последний), Safari для iPhone, Opera (последняя), IE (последней версии), Opera Mini
Валидность. Не должно быть JS-ошибок.
Вёрстка должна тянуться, не разваливаться и не терять дизайнерский вид при изменении контента на странице. Его может быть больше или меньше чем на макете.
Сайт должен нормально смотреться во всех стандартных разрешениях от 1024 и выше, не иметь горизонтального скролла и вписываться в экран мобильных устройств.
Доступность при выключенных (загружающихся) картинках, при выключенном JavaScript
Полное соответствие дизайн-макету. Расположение блоков должно быть 1:1 по сравнению с макетом. Допускается расхождение до 5px для текста, где это зависит от работы браузера.
Должны быть подключены правильные шрифты, а их размеры и толщина должны соответствовать размерам в макетах.
Правильная структура заголовков (H1,H2, и т.д. и TITLE)
Использование иконок в формате SVG
Все js скрипты, css должны быть вынесены в отдельные файлы и папки
Отсутствие багов при увеличенном шрифте
Единообразное написание и форматирование кода в HTML, CSS и JavaScript.
При большем размере экрана макет должен оставаться по центру и не иметь горизонтального скролла.
Правильное использование тегов html, <a> для ссылок, <p> для текста. Абзацы должны быть абзацами, а не
Не рекомендуется использовать транслит в названиях классов, атрибутах и так далее
(.login-button лучше, чем .knopka-vhoda)
В вёрстке не должны оставаться закомментированные на всякий случай куски кода, лишние неиспользуемые файлы, старые версии файлов и т.п.
Skype-плагин не должен ломать вёрстку
Ресайз textarea не должен ломать вёрстку
Изображения должны масштабироваться в зависимости от размера окна (max-width:100%; height:auto;)
-------
Проект на реализацию отдам исполнителю, который прочитает все ТЗ. Для подтверждения того, что вы прочитали ТЗ, напишите фразу "ТЗ изучено полностью".
И прошу отвечать в таком формате (именно в таком):
1) ТЗ изучено полностью
2) Стоимость
3) Сроки
4) Ваши вопросы и уточнения
5) Примеры работ
Спам удаляю и отправляю жалобу