Адаптивная и кроссбраузерная вёрстка страницы с чистым, масштабируемым кодом.
Если сделаете качественно — дам ещё 5 страниц.
В отклике укажите, пожалуйста, ссылку на ваш гит или страницу с примерами вёрстки для оценки.
Макет в figma по ссылке:https://surli.cc/zxbcrf
Требования к структуре и семантике:
— Корректная вложенность заголовков: H1 → H2 → H3
— Семантическая HTML5-разметка: header, main, section, article, nav, footer
— Теги strong, em, blockquote для смысловых акцентов
— Подключён , адаптивные breakpoints
— Использование современных единиц: rem/em, clamp()
— Использовать CSS-переменные
— Структурированный CSS-код: БЭМ или аналогичная система именования
— Поддержка микроразметки (schema.org, JSON-LD): FAQ, Breadcrumbs, Service, Review и др.
Core Web Vitals и производительность:
— LCP < 2.5 сек, FID < 100 мс, CLS < 0.1
— Резервирование пространства под изображения, шрифты и iframes
— Lazy loading для изображений и iframe
— Минимизация внешних запросов: объединение CSS/JS, preload
— Исключить render-blocking CSS/JS: использовать media, defer, async
Требования и UX:
— Mobile-first подход
— Верстка по стандартам WCAG 2.1+
— Поддержка aria-атрибутов для кнопок, форм, модальных окон
— Все интерактивные элементы — доступны с клавиатур
— Размер интерактивных элементов не менее 48px
Обязательные технические элементы:
• lang в
• favicon, manifest, robots.txt, sitemap.xml
• Без инлайновых стилей в body
• Без использования document.write
• Использование rel="preload" и rel="dns-prefetch"
• Только