Наша миссия — сделать интерфейсы продуктов доступными для максимального количества людей. Поэтому нам важно, чтобы люди с ограниченными возможностями тоже могли пользоваться нашими сервисами. Это и есть доступность.
<aside> 💡 Почти в каждом разделе гайдлайна вы найдёте рекомендации по доступности.
</aside>
Базовые материалы визуального языка — цвета, их сочетания и типографические схемы — должны соответствовать гайдлайнам доступности WCAG и пройти исследование на восприятие в продукте.
Мы проверяем базовую распознаваемость элементов визуального языка, но это не значит, что дизайнер может не обращать на это внимания.
Легко понять структуру страницы и ясно, что на ней можно сделать
Текст легко и удобно читать
Можно различить элементы, их функции и состояния
Понятны метафоры, дополняющие смысл контента
Не затруднено взаимодействие с кликабельными областями
Понятен смысл текста
Пользователь должен считывать структуру, смысл страницы и основные действия, которые можно на ней можно совершить. Старайтесь делать дизайн таким, чтобы пользователь легко находил ключевую информацию.
Содержимое страницы должно вписываться в структуру заголовков. Также у пользователя должна быть и альтернативная навигация: карта сайта, оглавление, меню, поиск и т. п.
<aside> 💡 Обращайте внимание не только на дизайн страницы, но и на разметку для скринридеров.
</aside>
Порядок считывания скринридера должен совпадать с порядком подачи информации на странице.
Обратите внимание на стили: заголовки первого уровня на макете должны быть заголовками h1 в коде — так сохранится корректная структура считывания
Скринридер плохо работает с всплывающими объектами и модальными окнами
Assistive Technology
Работая с типографикой, отталкивайтесь не только от правил читабельности, но и характеристик конкретного шрифта.