По порядку Middle Цвет, контраст, доступность обновлено
Порядок проверки доступности компонента
Вопрос
Расставьте шаги проверки доступности нового компонента «выпадающий список» в разумном порядке.
Попробуйте сами
Расставьте шаги по порядку стрелками.
- 1Пройти компонент только клавиатурой
- 2Проверить контраст текста, рамок и состояний в макете
- 3Пройти компонент со скринридером
- 4Задокументировать правила использования в дизайн-системе
- 5Определить роли и подписи для скринридера вместе с разработкой
- 6Описать поведение с клавиатуры и порядок фокуса
- 7Реализовать компонент в коде
Показать ответ и разбор
Коротко
Сначала то, что проверяется в макете, потом договорённости о поведении и семантике, затем проверки уже в коде клавиатурой и скринридером. Документация в дизайн-системе закрепляет решение для всех команд.
Правильный порядок
- 1Проверить контраст текста, рамок и состояний в макете
- 2Описать поведение с клавиатуры и порядок фокуса
- 3Определить роли и подписи для скринридера вместе с разработкой
- 4Реализовать компонент в коде
- 5Пройти компонент только клавиатурой
- 6Пройти компонент со скринридером
- 7Задокументировать правила использования в дизайн-системе
Разбор
Сначала то, что проверяется в макете, потом договорённости о поведении и семантике, затем проверки уже в коде клавиатурой и скринридером. Документация в дизайн-системе закрепляет решение для всех команд.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.