Ближайшая конференция — HolyJS 2025 Spring, 7—8 апреля, Москва + online. Подробности и билеты:
— — Скачать презентацию с сайта HolyJS —
Спикер думал, что его команда сделала Яндекс Маркет доступным для незрячих: наставили заголовков, подписали кнопки и накрутили семантику. А потом пришел незрячий тестировщик и указал на ошибки, на которые никогда бы не обратили внимание: — заголовки мешали на смартфоне; — тег button делал кнопку недоступной; — доступный блок прятал самое важное; — текст не читался полностью; — семантичные теги em и b не влияли на интонацию скринридера. Илья разобрал эти и другие особенности в UX и поделился решением на базе библиотеки React. Доклад будет интересен мидлам и сеньорам, которые разрабатывают интерфейс и знают основы доступности. Таймкоды 00:00 Смол-толк 02:46 Вступление 06:41 Ошибка 1. Перебор с заголовками 11:44 Ошибка 2. Лишние роли 14:17 Ошибка 3. Неправильный порядок озвучивания 17:15 Ошибка 4. Разбитый на части элемент 19:02 Ошибка 5. Разбитый на части текст 21:04 Ошибка 6. Нескрытие лишних внутренностей 22:29 Ошибка 7. Скрытие интерактивных внутренностей 23:48 Ошибка 8. Потеря контекста в подписи 24:58 Ошибка 9. Слишком логичный список 26:32 Ошибка 10. Непродуманная навигация 29:04 Заключение 30:28 Вопрос 1 (от эксперта). Что заставляет так глубоко погружаться в a11y? 33:24 Вопрос 2. Почему не просто aria-label? 38:02 Вопрос 3. Про сколько ошибок не рассказали? 38:29 Вопрос 4. Нейронки улучшили ли чтение контента для незрячих? 42:19 Уходим на дискуссию
