Drag&Drop-компоненты для слепых пользователей. Вы шутите?

Доклад Сергея Кригера о доступности в самых неожиданных местах.

Смотреть: https://www.youtube.com/watch?v=U1UjLN4I9fA

#video #accessibility #interface

Правильный ответ: 3

1: Для тега aside по умолчанию используется role=complementary, не имеет смысла дублировать
2: Не следует радикально изменять нативную семантику тегов
4: У обычного текстового поля нет состояния aria-checked
5: Для скрытого input нет доступных ARIA-ролей
6: Для обозначения недоступности кнопок следует использовать нативный атрибут disabled

Что такое ARIA?
Узнать: https://prglb.ru/ds7n

#accessibility #aria

​Инклюзивные компоненты: слайдер

Слайдеры похожи на мужчин. Буквально не все они плохие. Кто-то из них даже отзывчивый и тактичный.

Все, что вы должны знать о слайдерах в переводе Татьяны Фокиной: https://prglb.ru/4ra49

#accessibility #interface

🎨 Визуализация данных и цветовая доступность

Как спроектировать удобный для людей с особенностями зрения дизайн? Разработчики Kiddom Academy рассказывают о собственном способе решения проблемы цветовой доступности за 6 шагов.

https://prglb.ru/4v5a

#accessibility

:focus-visible уже доступно!!

Доступность без нарушений дизайна: https://prglb.ru/4kln3

#css #accessibility

HTML и CSS ошибки, которые я встречаю как человек без ограничений по здоровью

Сейчас много шума по поводу доступности интерфейсов. Здорово, что появляются интерфейсы, которыми могут пользоваться люди с какими-то ограничениями.

Но мы забываем про людей, у которых нет ограничений по здоровью. У них также есть право пользоваться интерфейсами так, как им удобно.

https://proglib.io/w/cf4fa2ac

#accessibility

Доступные иконочные ссылки

Иконки - важная часть современного веб-дизайна. Они экономят место и позволяют одним значком объяснить что-то пользователям, говорящим на разных языках. Однако при использовании иконок вместо текста нельзя забывать о доступности - ведь скринридеры не умеют распознавать картинки.

Статья рассказывает, о чем нужно позаботиться, создавая иконочные ссылки без текста: https://proglib.io/w/b5a6b556

#accessibility

Лучшие практики для создания каруселей

Оптимизируем компонент слайд-шоу для лучшей производительности и доступности: https://proglib.io/w/d5ba96b1

#interface #accessibility #performance

Версия для слабовидящих? А можно не надо?

Почему версия для слабовидящих не нужна вашему сайту: https://proglib.io/w/746c610f

#accessibility