Интернет, доступный для незрячих людей

Содержание

Невидимый интернет

Интернет, доступный для незрячих людей

Представьте себе мир, в котором каждая вещь говорит с вами: «я — кнопка, я — баннер, я — ссылка, я — неведомая штуковина за номером 4747475jfjfjf». Таков интернет-опыт слабовидящего пользователя на большинстве веб-сайтов. Анна Ладошкина, эксперт Теплицы социальных технологий, объясняет, почему так происходит, и приводит примеры интернет-ресурсов, удобных для слабовидящих.

По статистике в России порядка 275 тыс. людей с ограниченными возможностями зрения (а реальные цифры, скорее всего, выше). На каждый конкретный сайт, возможно, приходится лишь мизерная доля этой аудитории – и у создателей ресурса возникает соблазн отмахнуться: не наша целевая группа. К чему это приводит? Давайте поговорим немного о реалиях доступной среды в сети.

Интернет под лупой, на слух и на ощупь

Слабовидящие люди интернетом не пользуются – есть такой миф. Поверить в него легко: большинство из нас абсолютно не представляют, как это — путешествовать по сети, будучи слабовидящим или тотально незрячим.

Как именно такие пользователи взаимодействуют с сайтами?

Основополагающий принцип доступности заключается в том, что слабовидящие люди пользуются не специально созданными для них ресурсами, а всеми – за счет применения дополнительных средств, «ассистивных технологий».

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

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

Самый простой способ получить представление о работе этих программ — это попробовать. Пользователи Windows могут установить бесплатный скринридер NVDA, а пользователи Mac OS — воспользоваться встроенной утилитой VoiceOver, для этого им достаточно нажать комбинацию клавиш Command-F5.

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

Пытка визуальным шумом

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

Сайты полны визуальным шумом, текстовой бессмыслицей, рекламным мусором. По данным AdBlock Plus, средний пользователь интернета видит до 500 случайных рекламных объявлений в сутки.

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

Для слабовидящих такие механизмы «уклонения» не доступны.

Работа ассистивных программ направлена на то, чтобы позволить человеку так или иначе «воспринять» КАЖДЫЙ элемент на странице.

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

Хорошо, если в этой строчке есть хоть капля смысла — а если это имя файла изображения «dmmddldl_5677_jggkgk.jpg», которому создатели ресурса не потрудились присвоить описательный текст?

Таким образом пользование веб-сайтами часто оборачивается пыткой для слабовидящего человека. Попробуйте запустить в скринридере главную страницу какого-нибудь сайта, и если через полминуты вы не ужаснетесь, поздравляю — у вас крепкие нервы!

Почему так происходит

Никто специально не пытается усложнить жизнь слабовидящим, равно как и всем прочим пользователям. Однако на практике сделать «просто и удобно» оказывается куда труднее (и как следствие — дороже), чем «как получилось».

«Так уж вышло» — это честный ответ многих создателей сайтов. Когда среди 150 миллионов дел встает вопрос о создании альтернативного текста для картинки, они с легкостью соглашаются с тем, что это не самый главный приоритет. А многие вообще не знают, что это за альтернативный текст такой. Равно как и о других приемах и правилах повышения доступности сайта.

Международный консорциум W3C разрабатывает и поддерживает спецификацию стандарта доступности веб-сайтов и приложений WCAG 2.

0, описывающую как основные принципы доступности, так и их применение в более конкретных случаях.

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

Без серьезной мотивации среднестатистический разработчик часто не может себе позволить уделять внимание вопросам доступности ресурса для слабовидящих. Звучит совершенно социально безответственно, но это так.

Исполнение стандарта даже на базовом уровне требует дисциплины и квалификации, дополнительного времени на тестирование и ограничений на определенные приемы. Все это в конечном счете увеличивает стоимость проекта. «Забыть и забить» выходит дешевле.

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

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

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

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

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

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

Секреты доступности в действии

Какие интернет-проекты уже внедрили приемы, упрощающие доступ слабовидящих к контенту? Примеры в Рунете есть.

Журнал «Лайфхакер» с «чистым» минималистичным дизайном хоть и не отвечает стандартам доступности на 100%, по отзывам слабовидящих, вполне удобен. Минимализм в оформлении и содержании обеспечивает легкость восприятия и возможность ориентироваться.

На сайте МРООИ «Свет» можно обойти любую страницу с помощью клавиши Tab, перемещаясь от одной ссылки к другой. Это — и вообще возможность навигации с клавиатуры — важно для слабовидящих, подавляющее большинство которых мышью не пользуются.

Сайт фестиваля «Душевный Bazar» при увеличении масштаба страницы адаптируется к новым пропорциям, превращаясь в гигантскую «мобильную версию» и сохраняя при этом все навигационные и содержательные компоненты. Элементы не перемешиваются и не наезжают друг на друга. Поведение сайта при масштабировании — важный фактор удобства для слабовидящих пользователей.

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

Win-win эффект

Слабовидящие люди — пользователи интернета, это факт. Интернет для них — такой же источник информации, общения и социальной жизни, как и для всех остальных.

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

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

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

Всегда нужно

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

Добавлять текстовое описание ко всем визуальным элементам на странице (изображения, видео, аудио, файлы для скачивания).

Создавать осмысленные тексты для ссылок — «нажми сюда» должно наконец-то умереть.

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

Источник: https://www.ASI.org.ru/article/2015/03/13/nevidimyj-internet/

Незрячий программист — о разработке «на слух» и доступности интернета

Интернет, доступный для незрячих людей

Дмитрий Попов — незрячий веб-разработчик, пользуется программами экранного доступа. Эксперт по доступности сайтов, аналитик доступности многочисленных проектов, в том числе таких крупных, как сайт «УкрЗалiзниця». Веб-технологии изучил самостоятельно. Преподавал математику в Славянской школе-интернате для слепых и слабовидящих детей. С 2013 года живет в Киеве.

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

Дмитрий выступил с докладом «Как незрячие люди видят ваш сайт» на конференции WSD в Киеве

— Дима, как вы заинтересовались ИТ и программированием?

Я по образованию учитель математики и информатики, еще в университете изучил основы HTML, JavaScript.

Меня это заинтересовало, и я еще тогда начал пытаться делать свои сайты, сначала как лабораторные для вуза, потом уже как свои проекты. В то время как раз были популярны бесплатные хостинги narod.ru.

Со временем понял, что одного HTML мало, начал осваивать PHP. Просто открывал какие-то скрипты, читал код, разбирался.

— Расскажите, как незрячие люди работают с компьютером?

Незрячие пользуются компьютером с помощью специальных программ — скринридеров. Скринридер зачитывает активный текст, то есть тот, который сейчас под курсором. Озвучивание идет сверху вниз, то есть программа просто по порядку считывает HTML разметку.

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

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

— А как, например, происходит отладка, поиск какого-то бага?

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

Все незрячие люди привыкают к озвучке на больших скоростях. Я использую режим, в котором зачитывается 400 слов в минуту — это максимальная скорость из мне известных.

— Для вас программирование — это работа или хобби?

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

Активно занимаюсь волонтерскими проектами, связанными с доступностью сайтов для незрячих. Один из них — #Детектор_Web_доступності, проект организации «Вір в Україну».

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

В числе тех, кто уже подкорректировал свои сайты, — Минагрополитики и Правительственный портал.

— А можно подробнее о доступности? С какими проблемами сталкиваются незрячие при посещении сайтов? Как их исправить?

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

Проблемы возникают, когда, например, разработчики вместо кнопки делают элемент и через JavaScript навешивают на него какое-то действие.

Для скринридера это не кнопка, не ссылка, а просто текст, нейтральный элемент, и он не может на нем сфокусироваться.

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

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

Еще один момент — сложные меню, которые раскрываются при наведении мыши. Но, согласно требований доступности WCAG, все функции сайта должны быть доступны при помощи клавиатуры.

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

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

Я стараюсь поднимать тему доступности. Пишу в техподдержку сайтов, предлагаю решения. Иногда получаю обратную связь, иногда нет.

Frontend-лаборатория «Blind Accessibility» — обсуждали проблемы, с которыми сталкиваются незрячие при посещении сайтов. Дмитрий — справа

— Каких изменений уже удалось добиться?

Один из позитивных примеров, когда получилось — сайт zakaz.ua, сервис доставки продуктов из супермаркетов. Раньше там при заказе доставки надо было выбрать на карте свой район, и это можно было сделать только мышкой.

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

А в новой версии сайта планируют и вовсе отказаться от карты — район будет определяться сам при вводе улицы.

Сейчас общаюсь с ПриватБанком — у них в приложении Приват24 для айфонов недоступна услуга заказа билетов для незрячих.

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

— Слышала, что вы также принимали участие в доработке сайта «УкрЗалізниці». Что там надо было улучшить?

История с UZ.gov.ua длится уже более 3 лет. Все началось с того, что юрист Андрей Стегницкий выиграл суд против УЗ, и суд обязал сделать сайт доступным для незрячих, в частности виджет покупки билетов.

Однако за 3 года так ничего сделано и не было, и только этим летом организация незрячих ГУД снова подняла этот вопрос. Меня пригласили в качестве эксперта в команду, и буквально за 3 дня исправили все проблемы.

Мы внесли правки в сервис покупки билетов. Изначально в форме выбора места свободные места от занятых отличались только цветом, и с помощью скринридера было невозможно определить их статус. Мы просто добавили элемент aria-label с указанием, свободно данное место или занято. Этот атрибут никак не отображается визуально, но доступен для скринридера.

Несколько строк, которые сделали UZ.gov.ua доступным (из презентации Дмитрия для WSD)

Правда, остались сложности с онлайн-оплатой, но она проходит на странице стороннего сервиса Plategka.com. Там невозможно ввести CCV/CCV2 — на виртуальной клавиатуре у кнопок нет подписей. Мы общаемся с администрацией сервиса, но пока, к сожалению, безуспешно.

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

— А как вы можете оценить большинство сайтов, насколько они доступны? Есть ли разница между украинскими и зарубежными?

За рубежом дела намного лучше. Как раз в рамках «Детектора Web доступності» я недавно проверял государственные сайты Германии, Франции, США — у них минималистично, грамотно написанные странички, очень продуманные в плане логики меню. А у нас перегружены слайдерами, новостями в виде бегущей строки.

Если сравнивать временные изменения, то ситуация сейчас лучше, чем 10 лет назад — тогда в моде был flash, всякие сайдеры, крутилки, карусели. Сейчас в тренде минимализм, и благодаря этому дела с доступностью обстоят гораздо лучше.

— Какие инструменты вы используете для анализа доступности?

Я тестирую непосредственно скринридером. Но работа с этим ПО достаточно специфична, и на его освоение может понадобиться какое-то время.

Для поверхностной проверки можно использовать:
— Markup Validation Service — проверка сайта на общую валидность HTML;
— AChecker — валидатор на основе анализа HTML-кода. Не учитывает JavaScript, ошибки выводятся в текстовом виде, не очень удобны для анализа.

Выдаёт список потенциальных проблем, большая часть из которых не соответствуют действительности, однако список может использоваться в качестве дополнительного чек-листа;
— Wave web accessibility и расширение для Chrome WAVE Evaluation Tool — находят большое количество ошибок, предоставляют подсказки по исправлению и ссылку на стандарт, предоставляют информацию в удобном виде, подсвечивают синтаксис и aria-атрибуты;
— Tota11y — встраиваемый на страницу с помощью букмарклета визуализатор и валидатор доступности. Поддерживает измерение контрастности. В отличие от Wave Evaluation Tool, не показывает все ошибки сразу и определяет не так много ошибок;
— AInspector Sidebar for Firefox — в отличие от предыдущих валидаторов, позволяет находить ошибки в логике применения aria-атрибутов. Кроме списка ошибок выдает также список проверок, которые рекомендуется сделать вручную.

Но лучшая проверка — живой тест. Можно, например, скачать NVDA (свободно распространяемый скринридер), включить режим «Просмотрщик речи» и зайти на сайт. Или обратиться за помощью к незрячему.

— Расскажите о UAradio — как пришла идея запустить свой радио-сервис?

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

Кроме меня, в проекте задействована музыкальный редактор Юлия. Она занимается формированием плей-листа.

— Какие у вас дальнейшие планы? Какие активности планируете?

Есть идея развивать «Детектор Web доступності», собрать команду и создать полноценный информационный сервис — чтобы разработчик, узнав, что его сайт недоступен, мог обратиться к нам, получить информацию, заказать тестирование, получить рекомендации. Это все без оплаты со стороны разработчика — проект волонтерский.

— Что можете посоветовать незрячим начинающим программистам?

Сейчас есть огромное количество возможностей для развития — множество онлайн-учебников, открытые онлайн-курсы. Учиться стало намного проще, чем 10-15 лет назад, когда я сам был студентом.

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

Темы: доступность, разработка

Источник: https://dou.ua/lenta/interviews/blind-programmer/

Как сделать сайт доступным для незрячих и слабовидящих?

Интернет, доступный для незрячих людей

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

Теперь же возник новый тренд — “доступность”. Ведь сейчас сайты просматривают не только с больших мониторов в спокойной обстановке, но и со смартфонов в трясущихся автобусах и ноутбуков в шумных кафе, а среди пользователей появляется все больше пенсионеров и даже людей с ограниченными возможностями.

Когда задумались о доступности?

В 1996 году был создан Консорциум Всемирной Паутины (World Wide Web Consortium, W3C), и на одной из встреч был предложен черновик гайдлайнов для улучшения доступности веба.

Инициатива получила поддержку таких крупных спонсоров, как Microsoft, IBM, Adobe, и сейчас все популярные браузеры имеют настройки доступности и поддержку разметки WAI-ARIA для предоставления возможности полноценного использования Интернета людям с физическими ограничениями (нарушения работы органов зрения и опорно-двигательного аппарата).

Сейчас существуют руководства для веба с целью повышения доступности контента: международный стандарт WCAG2.0 для пользователей с различными ограничениями здоровья (зрение, слух, моторика и т.д.) и российский национальный стандарт доступности веб-ресурсов для инвалидов по зрению ГОСТ Р 52872-2012.

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

Экология доступности

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

1. Масштабируемая верстка

(5.1.7.7 ГОСТ Р 52872-2012: размер шрифта текста может быть изменен в пределах 200 процентов без применения вспомогательных технологий таким образом, что пользователю не нужно прибегать к горизонтальной прокрутке для прочтения строки при режиме отображения страницы во весь экран).

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

В качестве удачного примера использования масштабируемой верстки можно привести сайт Центрального Банка РФ.

Масштаб сайта можно увеличить в браузере не только до 200%, но и до 500% без появления горизонтальной прокрутки.

На скриншоте: увеличение масштаба до 200%. Полосы прокрутки нет

2. Достаточная контрастность текста и фона

(5.1.7.3 ГОСТ Р 52872-2012: Визуальное отображение текста и изображения текста имеет коэффициент контрастности не менее 4,5:1). Важно, чтобы основной текст на сайте можно было легко прочитать с экранов разной яркости и качества.

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

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

Контрастность текстов можно проверить с помощью чекеров контрастности, например Colour Contrast Analyser, или расширений для браузера, например “Contrast Ratio Checker” для Chrome. Существуют даже онлайн-чекеры контрастности, не требующие установки на компьютер.

На сайте Пенсионного Фонда РФ основной текст имеет достаточную контрастность, 14:1. Для дополнительного текста (подсказок, рекламных материалов) требования к контрастности чуть менее строгие.

3. Возможность работать с сервисом с помощью клавиатуры

(5.2.1.1 ГОСТ Р 52872-2012: Всей функциональностью контента можно управлять через интерфейс клавиатуры без каких-либо ограничений по времени нажатия на клавишу, за исключением случаев, когда вызываемая функция требует ввода с помощью других устройств, зависящего от направления движения пользователя, а не только от конечной точки.

Это не запрещает и не должно препятствовать предоставлению возможностей ввода с помощью мыши и других способов в дополнение к клавиатуре). Переключение между клавиатурой и мышкой — временны́е затраты, которые можно минимизировать, если корректно работает TAB и ENTER. Многие из нас пользуются клавиатурой для навигации, даже не задумываясь над этим.

Люди с нарушениями здоровья могут не пользоваться мышкой из-за проблем с мелкой моторикой. А незрячие люди могут пользоваться экранными дикторами — программами для озвучивания текста на экране.

В таких случаях важно, чтобы на сайте корректно работал фокус (при нажатии на кнопку TAB выделялась следующая ссылка/кнопка, а также в строке состояния браузера отображалась ссылка, куда будет совершен переход).

Работа с клавиатурой на сайте хорошо реализована на сайте Госуслуг.

Госуслуги: при нажатии кнопки TAB фокус переключается последовательно на каждую кнопку/ссылку. Если посмотреть на сайты иностранных коллег, например на сайте банка Barclays реализована возможность пропустить повторяющиеся элементы (верхнее меню) при управлении с клавиатуры. Она включается только по клавише TAB.
На скриншоте видно, что пропускается все сквозное верхнее меню и идет переход сразу к первой кнопке на странице. Это ускоряет доступ к нужному контенту при управлении с клавиатуры при просмотре сайта.

Как можно заметить, большая часть требований — технические, относящиеся к верстке сайта.

Но об “экологии верстки” стали задумываться только недавно. Хотя о доступности веб-контента для лиц с ограничениями здоровья говорили еще в 1994 году, бурное развитие веба привело к тому, что сейчас хорошо сверстанные сайты с учетом рекомендаций для комфортного чтения — скорее исключения или “правила хорошего тона” серьезных веб-студий.

Что делать, если с версткой сайта все плохо? Панель комфортного чтения!

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

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

В 2018 году такая панель появилась и на сайте ВТБ.

Панель комфортного чтения на обновленном сайте ВТБ.

На сайте Пенсионного Фонда РФ есть несколько иные варианты настройки контрастности, а также встроен свой собственный “экранный диктор”, благодаря чему не требуется запуск дополнительных программ.

Панель комфортного чтения на сайте ПФРФ (с примененной настройкой контрастности)

Для установки подобной панели не обязательно иметь доступ к исходному коду сайта.

Существуют подобные плагины и для популярных CMS, которые может установить практически каждый без особенных затрат, поскольку установка плагина осуществляется либо автоматически, либо требует не слишком трудоемких манипуляций пользователя с готовым скриптом. Например, можно использовать плагин Comfortable Reading (для WordPress и Joomla).

Пример настройки сайта с помощью плагина Comfortable Reading

Есть панель — нет проблем? Все не так просто!

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

1. Ограниченный функционал

Используются только настройки размера шрифта и цвета.

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

Таким людям помогли бы, к примеру, увеличение расстояние между буквами и шрифт с засечками.
Пример: сайт Генпрокуратуры РФ. Имеются настройки размера шрифта и три варианта цветовой схемы.

2. Отдельная версия сайта для слабовидящих

Версия для слабовидящих находится на отдельном URL. Также на ней может отсутствовать часть контента по сравнению с обычной версией. Это не самое удачное решение, поскольку нужно поддерживать две отдельных версии сайта, что ведет к дополнительным затратам. Такой вариант используется, например, на http://kremlin.ru/.

3. Проблемы работы с экранным диктором

На некоторых сайтах хорошо реализована панель для настроек (ПФРФ) или адаптивная версия (Госуслуги), но есть проблемы взаимодействия с программами экранных дикторов.

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

О проблемах работы интернет-банков и мобильных приложений с экранным диктором компания USABILTIYALB подробно рассказывала на банковском завтраке в сентябре 2017 года.

4. Версию для слабовидящих сложно найти даже зрячему человеку

Например, используются очень бледные, незаметные иконки, как на сайте Счетной палаты РФ:
Смогли бы вы сразу заметить иконку, если бы она не была выделена на скриншоте?

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

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

Заключение

Мы видим, что развитие юзабилити и доступности на данный момент идет не столько со стороны бизнеса, сколько со стороны государства. Проблемы доступности активно обсуждаются и решаются в банковской сфере, при поддержке ЦБРФ.

1 января 2016 года вступил в силу Федеральный закон № 419-ФЗ «О внесении изменений в отдельные законодательные акты Российской Федерации по вопросам социальной защиты инвалидов в связи с ратификацией конвенции о правах инвалидов», и большинство государственных сайтов добавили версию для слабовидящих.

Однако на некоторых из них такая версия отсутствует. Это, например:

Совет Безопасности РФ http://www.scrf.gov.ru/

Верховный Суд РФ http://www.supcourt.ru/
Совет Федерации http://www.council.gov.ru/
Росстандарт http://www.gost.ru/ Доступность сайтов важна не только для государственных сайтов, но и для бизнеса. Следование рекомендациям по повышению уровня доступности уже поможет расширить аудиторию не только за счет лиц с инвалидностью, но и за счет улучшения пользовательских качеств сайта для широкой аудитории и нас с вами. Конечно, для принятия максимально эффективных мер необходимо провести аудит текущей версии сайта, составить ТЗ на верстку, соответствующую рекомендациям, или как минимум внедрить панель комфортного чтения.

По нашему мнению, в ближайшем будущем появятся и стандарты для панели для слабовидящих, и правила “хорошего тона” верстки будет соблюдаться все чаще и чаще!

  • юзабилити
  • веб-дизайн
  • разработка сайтов

Источник: https://habr.com/post/347478/

Увидеть интернет Как далеко продвинулись технологии, которые позволяют слепым выходить в Сеть — Meduza

Интернет, доступный для незрячих людей

BSIP SA / Alamy / Vida Press

В мире, по данным ООН, живет больше 285 миллионов людей с проблемами зрения, из них около 40 миллионов — полностью слепые.

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

Журналист Олег Егоров по просьбе «Медузы» выяснил, как на жизнь слепых и слабовидящих влияют высокие технологии — и как крупные западные компании работают с этими людьми.

Мэтту Кингу — пятьдесят, и жизнь его кажется воплощением «американской мечты». Окончив частный университет Нотр-Дам в штате Индиана, он устроился программистом в IBM, где проработал почти 20 лет.

Параллельно Кинг профессионально занимался велоспортом — в 1996 году он установил мировой рекорд в гонке преследования на 4000 метров. В 2015 году Кинг ушел из IBM в , где сейчас разрабатывает программное обеспечение.

У Кинга двое детей, он сам спроектировал свой дом и в свободное время играет на органе. А еще давно — более 25 лет назад — он полностью ослеп.

Интернет для слепых

На 1990-е годы, когда Кинг потерял зрение из-за пигментного ретинита (прогрессирующего дегенеративного заболевания глаз), пришлось время массового распространения компьютеров.

 Те, у кого не было доступа к компьютеру, лишались многих возможностей. «[Если вы слепой] вы не могли написать e-mail. Не могли пойти на работу.

Не могли пойти в школу», — вспоминает программист IBM Рич Швердтфегер.

Глазное дно пациента с пигментным ретинитом в средней стадии

Christian Hamel / Wikimedia Commons (CC BY 2.0)

Разработчики довольно быстро приступили к решению этой задачи: еще до прихода Кинга в IBM компания выпустила первый экранный ридер, зачитывающий текст, появляющийся на экране.

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

Другой способ — специальный тактильный дисплей, который преобразует текст с монитора в шрифт Брайля.

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

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

Такое происходит, если программист не прописал в коде сайта дополнительную текстовую информацию о картинке, которую ридер может считать.

Есть и другие недостатки: ридер не может считывать движущийся текст, отображать видео, графики, таблицы и капчи, которые сайты используют для проверки «человек/робот». По информации USA Today, даже в 2016 году слепые не могут просмотреть около половины сайтов.

Лаборатория эмпатии

Проблемой доступности интернета занимаются инженеры по всему миру, в том числе Мэтт Кинг и его коллеги в  Accessibility. Для Кинга работа в  стала личным вызовом: в 2009 году ему пришлось потратить несколько часов на то, чтобы завести аккаунт в фейсбуке.

Еще больше разочаровали Кинга «стены» друзей: по большей части там постили фотографии — для незрячего программиста это были просто «изображения». «Отлично, — подумал Кинг, — вот, видимо, еще одно бесполезное место».

Через несколько лет его пригласили работать в , и он согласился.

Мэтт Кинг (слева), глава команды Accessibility Джефф Виланд и специалист по данным Шаомей Ву

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

Introducing Automatic Alt Text

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

Распознать пиццу

В апреле 2016 года Мэтт Кинг провел презентацию разработанного его командой «автоматического альтернативного текста».

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

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

Технологии, позволяющие слепым «видеть», появляются не только в соцсетях. В конце марта Microsoft рассказала о своем приложении Seeing AI, работающем по схожему с  принципу.

В видео, опубликованном Microsoft, Сакиб Шейх, незрячий разработчик компании, ходит по Лондону и нажимает кнопку на смарт-очках или в телефоне. Эти устройства делают фотографию и, используя технологию распознания объектов, рассказывают Сакибу, что и кого он «видит».

На протяжении всего ролика с лица Сакиба, потерявшего зрение в 7 лет, не сходит улыбка.

У Microsoft получилось сделать Seeing AI благодаря технологии нейронных сетей для «самообучения» компьютеров. То есть машины, анализируя и распознавая огромные объемы фотографий, учатся лучше различать объекты и давать более точную информацию.

Это важно: когда технология только появилась, приложения (их тогда использовали и Flickr) часто допускали ошибки, порой очень обидные. Например, фотографии темнокожих людей нередко тегировались «ape» («обезьяна»).

Чтобы избежать этого, современные приложения выдают незрячим информацию об объекте, только если уверены в том, что перед ними именно пицца (а, например, не фотография Марса), на 70 или более процентов.

Крупнейшие американские компании придумывают, как сделать свои сайты и сервисы доступными для всех пользователей не только из соображений гуманности. Уже сейчас в США обсуждают, следует ли трактовать отсутствие необходимых условий для инвалидов в Сети как нарушение Акта об американцах с ограниченными возможностями 1990 года, предполагающего административную ответственность за дискриминацию.

В 1990 году, когда принимался акт, интернет не был настолько распространен.

Пока министерство юстиции США отложило рассмотрение вопроса о законодательном регулировании доступности интернета до 2018 года, но выразило озабоченность тем, что граждане с особыми потребностями ущемляются в правах.

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

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

Слепое пятно

Вадим Лукьянчук живет в Рузе (Московская область), он программист и музыкант. Несмотря на то что Вадим полностью лишен зрения, мы переписываемся с ним во «ВКонтакте» — сообщения он надиктовывает через смартфон.

Лукьянчук работает в проектной команде NativeKeys, которая позволяет слабовидящим музыкантам писать музыку с помощью компьютера.

Разработчики NativeKeys адаптируют существующие звукозаписывающие программы так, чтобы незрячим было удобно ими пользоваться.

По словам Лукьянчука, ориентироваться в рунете продвинутому незрячему пользователю не так уж сложно. «В целом проблем нет, как с новостными сайтами, так и с любыми другими, — рассказывает Вадим.

— В плане капчи, к примеру, для нас есть альтернатива, многие сайты, в том числе русскоязычные, начали наряду с графической капчей делать и звуковую».

Программист с одобрением отзывается и о западных соцсетях: «Те же и  хорошо доступны».

Вадим Лукьянчук

Фото из личного архива

Он рассказывает, что российские социальные сети гораздо хуже приспособлены в этом смысле: «Mail.ru, „“ нельзя назвать полностью доступными для незрячих — приходится использовать мобильную версию сайта».

Отдельные претензии Лукьянчук высказывает и к той соцсети, в которой мы общаемся. «Разработчики „ВК“ делают вид, что нас не существует, именно доступности [для слабовидящих] внимание никто не уделяет», — говорит Вадим.

По его словам, незрячие неоднократно обращались в службу поддержки, но это не привело к каким-либо изменениям.

На просьбу «Медузы» уточнить, что именно его не устраивает в работе «ВК», Лукьянчук отвечает: «В целом неудобно работать. После того как включили музыку, зачастую курсор убегает — и бывает проблематично его остановить, то же самое с видео. Неудобно работать с фотографиями и документами, иногда бывает сложно выйти из группы или отписаться от страницы».

«Медуза» обратилась в службу поддержки «ВКонтакте» с просьбой прокомментировать слова Вадима. Там согласились с претензиями, отметив, что ситуация изменится к лучшему после редизайна сайта .com: «Увы, на данный момент сайт плохо адаптирован к людям с ограниченными возможностями.

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

В нем мы стараемся учитывать все замечания пользователей».

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

Мне, например, удобнее читать тот же „ВК“, используя стороннее приложение для Android». Несмотря на все трудности, незрячие активно осваивают интернет, рассказывает программист: «Даже те, кто постарше и уже на пенсии, стараются изучать компьютер.

Хотя бы для того, чтобы почитать книги, поговорить по скайпу с друзьями и близкими».

P. S. От редакции: Как и у многих других сайтов, у «Медузы» есть сложности с доступностью сайта и приложений для незрячих. Наше приложение под Android поддерживает встроенные в телефон технологии чтения с экрана, а приложения для айфонов и айпадов при одном из последних обновлений эту функцию потеряли. Мы починим iOS-приложения в течение ближайшего месяца и сообщим об этом.

Источник: https://meduza.io/feature/2016/05/30/uvidet-internet

Поделиться:
Нет комментариев

    Добавить комментарий

    Ваш e-mail не будет опубликован. Все поля обязательны для заполнения.