Задача: Верстка двух страниц сайта

Общее описание

Требуется разработать две страницы сайта по предоставленному макету в Figma. Верстка должна быть выполнена на высоком профессиональном уровне, с точным попаданием в пиксели (Pixel Perfect) и полной адаптацией для мобильных устройств, планшетов и десктопов.

Основные требования

  • Технологии: Использовать чистый HTML/CSS без фреймворков сборщикам. Допустим JavaScript для минимально необходимой функциональности (меню-бургер, маски для полей, слайдеры).
  • Pixel Perfect: Все отступы, размеры шрифтов, цвета и позиционирование элементов должны точно соответствовать макету Figma. Допустимое отклонение - не более 1-2 пикселей.
  • Адаптивность (Responsive): Макет должен корректно отображаться на всех устройствах: десктоп (1920px), планшет (768px), мобильные телефоны (320-480px). Все критичные сценарии использования должны быть проработаны. Адаптация должна проводиться через медиа-запросы.
  • Кроссбраузерность: Макет должен одинаково работать в последних версиях браузеров: Chrome, Firefox, Safari, Edge.
  • Семантика и валидность: Код должен быть написан качественно: семантическая верстка (article, section, header, footer) и пройдена валидация W3C без критических ошибок.
  • Оптимизация: Использовать современные форматы изображений (WebP, AVIF с fallback). Favicon - обязателен. Скорость загрузки должна быть свыше 90 баллов по Lighthouse десктоп и мобила.

Процесс работы

  • Ссылка на макет Figma будет передана исполнителю дополнительно (из-за ограничения системы публикации ссылок).
  • Первый этап: оценка макета и обсуждение технических деталей.
  • Финальный результат: архив с html-файлами, папкой css, папкой img с оптимизированными изображениями и отдельный файл с готовой версткой на GitHub pages или другом облачном хостинге для демо-просмотра.

Дополнительно

Исполнитель должен работать с Git, отслеживанием изменений. Каждый пиксель, отступ и поведение на mobile должны быть детально выверены до полного соответствия дизайну.