Доступность глазами реальных людей с ограниченными возможностями

“Если вы инвалид, что для вас самое сложное в использовании интернета?” Ответы на этот твит Сафии Абдаллы на многое открыли нам глаза и показали, какой должна быть веб-доступность на самом деле.

Твит, с которого все началось

Любопытно узнать: Если вы инвалид, что для вас самое сложное в использовании интернета? Перепост, чтобы больше людей ответило, пожалуйста — спасибо!

В этой статье я собрал и сгруппировала основные темы, поднятые в обсуждении.

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

Нет субтитров

Отсутствие субтитров — самая популярная проблема, о которой сообщило большинство людей. Вот несколько твитов:

Я глухой, и могу сказать, что для меня главная проблема — это субтитры в видео

Видео/аудио без субтитров или скрипта.

Я слабослышащая, поэтому видео без субтитров — это моя большая боль. Твит или статья в стиле “Вы верите, что он это сказал?”, без пояснения.

А еще, моя сестра говорит, что ненавидит видео без субтитров. Она глухая.

Если в видео нет субтитров, оно становится совершенно недоступным для глухих и слабослышащих. Но из-за отсутствия субтитров страдают и другие пользователи. Например те, кто забыл наушники и смотрит видео в шумном месте. Или пользователи с аутизмом:

Мне также хочется добавить, что субтитры ОТЛИЧНАЯ штука не только для глухих и слабослышащих. Нужно больше видео с субтитрами! | Я аутист, и когда я перенапрягаюсь, мне сложно воспринимать информацию на слух. Особенно если говорящий находится за пределами экрана.

Многие люди надеются, что проблему решает функция автоматических субтитров. Но, увы — пока до этого далеко!

Не особо. Автоматические субтитры YouTube недостаточно точны.

К тому же, функция авто-субтитров, к сожалению, недоступна для большинства языков. Так что создание субтитров лежит на совести авторов ролика.

Движение, анимация и перегруженные страницы

Движение и анимация могут раздражать пользователей, но для людей с нарушением когнитивных функций это настоящая проблема:

Синдром дефицита внимания: если на странице есть “легкая” анимация, которая всегда шевелится, я не могу сосредоточиться. Главный виновник проблемы: градиент под заголовком на сайте blog.intercom.com

Если СДВГ считается, то скажу: очень сложно найти нужную информацию на перегруженной странице, а анимации отвлекают так, что ужас

То же самое. Я тоже аутист и меня бесят и даже пугают гламурные эффекты/анимации при наведении курсора. А также внезапное автовоспроизведение и т.п.

Сделайте своим пользователям одолжение: не отвлекайте их автоматическими видео, рекламой или каруселями.

Простыни текста

Было очень много комментариев о больших, неструктурированных текстах — особенно от людей с дислексией и нарушением когнитивных функций:

Дислексия особо не считается ограничением возможностей, но огромные простыни текста — большая боль для меня. А еще — бесконечные предложения и сложный язык.

Когда люди печатают большие блоки текста без интервалов.

Огромные параграфы. Страница в Википедии обычно состоит из кучи длинных параграфов с длинными предложениями. Пара секунд — и я теряю место, где читала.

СДВГ + большие, неразбитые блоки текста или небольшие анимации, которые не имеют отношения к основному контенту страницы

Большие параграфы, слишком много движущихся картинок, слишком много контента в форме видео (особенно, вспомогательные файлы), отсутствие субтитров, перегруженные страницы, где слишком много всего.

А решение простое. Просто разбивайте текста на параграфы и добавляйте подзаголовки. А еще используйте маркированные списки. Вуаля!

Мелкий шрифт

Удивительно, что в руководстве по обеспечению доступности веб-контента (WCAG) нет требования к минимальному размеру шрифта. Хотя это напрямую влияет на пользователей со слабым зрением.

Я почти слепой на левый глаз. Мелкий, узкий шрифт, недостаточно контрастный к фону.

Шрифты часто слишком мелкие, а если увеличить размер, сайт едет.

Мелкий шрифт и некоторые анимации

Проблемы с увеличением

Некоторые пользователи со слабым зрением отметили проблемы с лейаутом и навигацией при увеличении страницы или шрифта.

У моей дочери слабое зрение, и ей приходится использовать увеличение 300–500%. На таком уровне увеличения у многих сайтов проблемы с навигацией.

У меня неврологические проблемы со зрением из-за синдрома хронической усталости. Проблема — мелкие шрифты. Я всегда увеличиваю шрифт в браузере, но иногда из-за этого едет компоновка.

Тем, у кого проблемы со зрением, бывает сложно понять компоновку.

Низкий контраст цветов и текста

Один из основных компонентов доступности — это цветовой контраст. И все же у многих интерфейсов с ним до сих пор проблемы.

Недостаточно контрастный текст относительно фона. Яркие фотографии на фоне текста.

Текст как графический элемент — без альтернативного текста, без описания. Начиная от сайтов, заканчивая мемами.

Определенно, недостаточно контрастные цвета.

Очень важно, чтобы веб-дизайнеры и арт-директора понимали, как создавать и тестировать доступные цветовые схемы. Смотрите наш список из семи отличных, бесплатных инструментов цветового контраста.

Яркие цветовые схемы

Большой проблемой для пользователей со слабым зрением могут быть яркие цветовые схемы. Почему-то эта тема редко поднимается при обсуждении доступности. Любопытно, что столько людей написали об этом в комментариях, и какие интересные методы они используют, чтобы решить проблему:

Проблемы со зрением: Когда целый день смотрю на белый экран (особенно если на нем текст), потом болит голова и устают глаза. | это очень просто, но очень благодарна всем приложениям, где есть “ночной режим”. Так глаза устают меньше

Страдаю частыми тяжелыми мигренями. Столько сайтов со светлыми цветовыми схемами! Я не могу пользоваться ими даже в солнечных очках, даже с пониженной яркостью монитора

Мне приходится читать статьи с Kindle Oasis, чтобы читать без подсветки. А еще я обнаружил, что функция “режим чтения” работает нестабильно.

Сайты, которые всецело полагаются на цвет

Это тоже один из основных компонентов доступности, который многие упускают.

Дальтоник. Текст на фоне обычно вижу, но переключатели с цветовым кодированием, тепловые карты — с этим бывают проблемы.

Это ведь очень просто проверить — просто посмотрите на свой сайт в черно-белом режиме. Вот пример, насколько сложно понять статус переключателя, когда не видишь цветов. Какой из них включен, а какой выключен?

Не только дальтоники нуждаются в дополнительных, нецветовых сигналах:

Нарушение сна: После 5 вечера я читаю со включенным приложением f.lux. И почему некоторые сайты думают, что достаточно сделать гиперссылки синими и подчеркивание не нужно?

Сайты, управляемые мышью

Даже в наше время сенсорных экранов, многие сайты поддерживают только управление мышью. Особенно для навигации по большому экрану. Это нужно изменить.

У меня нет проблем, но у моей мамы болезнь Паркинсона и ей очень сложно пользоваться мышью.

На некоторых сайтах меню можно открыть только при помощи мыши.

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

Не видно, что объект в наведенном состоянии. Особенно это касается ссылок (дизайнерам не нравится, как это выглядит — так что они просто убирают эту функцию) и пользовательских компонентов (например, выпадающих меню).

Слишком маленькие тач-зоны

Проблема, аналогичная предыдущей. Многие люди отмечают, что тач-зоны слишком маленькие.

У моего шурина церебральный паралич, и он не может пользоваться кнопками и ссылками, если они слишком мелкие. Он может взаимодействовать только с сенсорными экранами, потому что не может держать мышь.

У меня тремор и проблемы со зрительно-пространственной ориентацией, поэтому мне очень сложно пользоваться твиттером на мобильном. Я часто по ошибке нажимаю не туда.

Я по-новому взглянул на эту проблему, когда Дейв Росс рассказал, что тач-зоны также могут быть слишком большими.

Тач/клик-зоны слишком маленькие (и в них невозможно попасть), либо слишком большие (например, кликабельный не только заголовок, но и текст под ним) | (иногда у меня бывает тик и тогда я не могу точно прицелиться мышью, или случайно задеваю экран)

Мультитач-жесты тоже представляют проблемы для некоторых пользователей:

Тремор рук. Иногда я по ошибке нажимаю, куда не нужно (особенно эти кнопки “купить в один клик”. Иногда, наоборот не могу попасть и нажать, куда нужно. | Да! У приложении Kindle есть жест “нажать дважды и держать”, чтобы перейти в настройки дисплея. Это супер сложно (у меня деформация руки)

Капчи

И наконец, у нас тут классическое нарушение доступности: жуткая КАПЧА. Она раздражает всех, кто с ней сталкивался, но многим пользователям со слабым зрением или пониженной обучаемостью капча полностью блокирует доступ к функциям сайта.

У моем мамы проблемы со зрением и недавно она прислала мне ссылку на этот классный ресурс: https://accessibility.blog.gov.uk/2016/09/02/dos-and-donts-on-designing-for-accessibility/ | Если говорить о том, что ее раздражает, так это капчи без озвучки. Они серьезно ограничивают ей доступ в ряд сервисов.

В заключение

Подводя итоги этого обсуждения, хочу озвучить несколько выводов:

Веб-доступность — это гораздо больше, чем забота о слепых с устройствами чтения экрана.
Почти все, что называют люди с ограниченными возможностями, бесит и здоровых людей — так что от решения этих проблем выиграют все!
Многое из того, что назвали люди, не входит в руководство по обеспечению доступности контента (WCAG). Так что нужно, чтобы в тестировании участвовали люди с ограниченными возможностями!
Так что благодарю Сафию Абдаллу за ее вопрос в Твиттере. И спасибо всем, кто ответил и открыл для меня (@hampelusken) столько нового.