Как стать автором
Обновить

Плагин для Bootstrap 3, повышающий accessibility интерфейсов

Время на прочтение 2 мин
Количество просмотров 17K
Набор инструментов Bootstrap пользуется достаточно большой популярностью среди разработчиков. Тем не менее, интерфейсы, получающиеся с его помощью, зачастую имеют проблемы с accessibility, то есть с доступностью для пользователей с ограниченными возможностями. В результате, получившийся интерфейс может не соответствовать предъявляемым к нему требованиям, так как часто accessibility является одним из пунктов технического задания, да и в принципе не очень доступный интерфейс — это уже плохо.

Команда разработчиков PayPal некоторое время работала над решением ряда проблем доступности в Bootstrap 3, итогом чего стало появление accessibility плагина, который недавно был выложен в открытый доступ. Фактически он позволяет реализовать доступность интерфейса на базовом уровне без каких-либо особых знаний в этой области.

Bootstrap Accessibility Plugin представляет собой дополнительный модуль на JavaScript, подключающийся без модификации основного кода Bootstrap. Основные улучшения доступности, которые обеспечивает данный плагин, заключаются в реализации навигации с клавиатуры и поддержке основных программ экранного доступа. Кроме того, есть некоторые незначительные улучшения контрастности alert-сообщений.

Для некоторых виджетов, таких как вкладки, карусели, раскрывающиеся меню и др., событие onKeyDown используется для обеспечения возможности управления с компьютерной клавиатуры. В результате, пользователи, испытывающие проблемы при работе с мышью, имеют возможность работать при помощи табуляции и курсорных клавиш.

Сразу после загрузки, плагин начинает искать на странице любые компоненты Bootstrap, а найдя, добавляет к ним необходимые роли и состояния ARIA. Это обеспечивает дополнительную семантическую информацию для управляющих элементов, которая повышает доступность интерфейса для программ экранного доступа.

Соотношение цветов фона и данных на переднем плане в alert-сообщениях Bootstrap может оказаться недостаточным для людей, имеющих ослабленное зрение, поэтому плагин также корректирует эти параметры, делая общий вид более контрастным.

Получить подробную информацию по списку модифицируемых компонентов интерфейса и их изменениям можно в ReadMe.

Bootstrap Accessibility Plugin распространяется на условиях лицензии BSD, а его исходный код доступен на GitHub.
Теги:
Хабы:
+28
Комментарии 1
Комментарии Комментарии 1

Публикации

Истории

Работа

Веб дизайнер
36 вакансий

Ближайшие события

Московский туристический хакатон
Дата 23 марта – 7 апреля
Место
Москва Онлайн
Геймтон «DatsEdenSpace» от DatsTeam
Дата 5 – 6 апреля
Время 17:00 – 20:00
Место
Онлайн