[ ] Все блоки и элементы из макета сверстаны. Размеры и расположение не отличаются от макета на более, чем на 30px на десктопной версии и на 10px на остальных размерах экрана, для которых подготовлен макет. Отличия в размерах не должны визуально противоречить макету и выбиваться из заложенной в макет сетки, в этом случае требуется более строгое соответствие размерам макета.
Контент в карточке прилипает к нижнему краю
Форма поиска фильмо сильно уменьшается и деформируется
[x] Проект адаптирован под различные разрешения экрана. Горизонтальный скролл не возникает на разрешениях от 320 пикселей и больше. Нельзя скрывать полосу прокрутки свойством overflow: hidden.
[x] Корректно работает навигация между страницами и ссылки на внешние ресурсы: ни одна ссылка не ведёт в пустоту или на якорь, внешние ссылки открываются в новой вкладке. На все страницы проекта можно попасть, а скрытые блоки можно отобразить.
[x] Именование классов сделаны по БЭМ.
[x] Отзывчивая вёрстка, которая корректно тянется на всех промежуточных разрешениях.
[ ] В коде используется семантическая разметка: применяются семантические теги, выбор элементов при вёрстке корректен (параграф должен быть параграфом, список — списком); структура DOM-дерева состоит не только из контейнеров div.
Неправильно задан langВесь контент между header и footer нужно заключить в тег main, как в тег для уникального контента страницы.
[x] Для позиционирования элементов выбран верный подход, описанный корректным синтаксисом.
[x] Каркас макета реализован на Flex layout или Grid layout;x
[x] Инфраструктурные файлы проекта созданы через CRA.
[x] Работа модальных окон настроена.
[x] Разметка портирована в JSX:ф
[x] разметка заключена в ( ), лишние пустые
для этого не используются;
[x] разметка вынесена в соответствующие ей компоненты.
[x] В проекте есть:
[x] директория images/ с картинками,
[x] директория components/ с JS и CSS-файлами компонентов,
[x] директория fonts/ со шрифтами.
Хорошие практики
[x] Кнопки, инпуты и ссылки реализованы во всех состояниях, указанных в макете.
[x] В макете есть одинаковые элементы. Для их оформления должен быть переиспользован один компонент.
[x] Шрифты подключены через @font-face.
[x] Иконки экспортированы в формате SVG.
[ ] Элементы формы должны выделяться, когда на них установлен фокус. Состояние фокуса, а также outline стилизованы в соответствии с макетом или на своё усмотрение.
Элементы форм не выделяются, когда на них установлен ФОКУС. Форма поиска фильмов
[x] У формы должны быть заданы плейсхолдеры, валидированы обязательные поля.
[x] reset.css запрещен.
Рекомендации
[x] Для каждого шрифта указаны альтернативные варианты из системных шрифтов.
[x] Для изображений задан атрибут alt с подходящий значением.
[x] Растровые и векторные изображения оптимизированы;
Резюме по работе:
Верстка и JSX
Критерии, влияющие на работоспособность
Контент в карточке прилипает к нижнему краюФорма поиска фильмо сильно уменьшается и деформируется[x] Проект адаптирован под различные разрешения экрана. Горизонтальный скролл не возникает на разрешениях от 320 пикселей и больше. Нельзя скрывать полосу прокрутки свойством overflow: hidden.
[x] Корректно работает навигация между страницами и ссылки на внешние ресурсы: ни одна ссылка не ведёт в пустоту или на якорь, внешние ссылки открываются в новой вкладке. На все страницы проекта можно попасть, а скрытые блоки можно отобразить.
[x] Именование классов сделаны по БЭМ.
[x] Отзывчивая вёрстка, которая корректно тянется на всех промежуточных разрешениях.
[ ] В коде используется семантическая разметка: применяются семантические теги, выбор элементов при вёрстке корректен (параграф должен быть параграфом, список — списком); структура DOM-дерева состоит не только из контейнеров div.
Неправильно задан langВесь контент между header и footer нужно заключить в тег main, как в тег для уникального контента страницы.[x] Для позиционирования элементов выбран верный подход, описанный корректным синтаксисом.
[x] Каркас макета реализован на Flex layout или Grid layout;x
[x] Инфраструктурные файлы проекта созданы через CRA.
[x] Работа модальных окон настроена.
[x] Разметка портирована в JSX:ф
[x] В проекте есть:
Хорошие практики
[x] Кнопки, инпуты и ссылки реализованы во всех состояниях, указанных в макете.
[x] В макете есть одинаковые элементы. Для их оформления должен быть переиспользован один компонент.
[x] Шрифты подключены через @font-face.
[x] Иконки экспортированы в формате SVG.
[ ] Элементы формы должны выделяться, когда на них установлен фокус. Состояние фокуса, а также outline стилизованы в соответствии с макетом или на своё усмотрение.
Элементы форм не выделяются, когда на них установлен ФОКУС. Форма поиска фильмов[x] У формы должны быть заданы плейсхолдеры, валидированы обязательные поля.
[x] reset.css запрещен.
Рекомендации
Количество баллов: 82
Доп. Комментарии: