На Хабре с периодичностью раз в неделю выходят статьи про технологические аспекты доступности

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

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

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

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

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

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

Разница между устной и письменной речью

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

Возьмём слово «сквозняк» и переведем его автоматическим переводчиком на английский язык. Скорее всего, оно будет переведено как «draft». Переведем его снова на русский. Скорее всего, при обратном переводе оно превратится в «черновик». Аналогично этой истории при трансформации устной речи в письменную с последующим считыванием с помощью скрин-ридера может получиться похожий неприятный результат:

  • «Два миллиона шесть» → «2000006» → «два ноль ноль ноль ноль ноль шесть».

Но если записать число как «2.000.006», то результат будет верным:

  • «Два миллиона шесть» → «2.000.006» → «два миллиона шесть».

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

Те примеры, которые будут приведены ниже, сделаны с помощью голоса «Microsoft Irina» для русского языка в операционной системе Windows 10. Это самая популярная операционная система в мире.

Пример работы Screen Reader

Для лучшего понимания того, что написанное вами звучит не так, как вы думаете, посмотрите этот ролик. В нем голос Microsoft Irina озвучивает распространённые формы записи даты, времени, числа, адреса, денежных сумм, сокращений.

О доступности

Если говорить о доступности в нашем контексте, то у нее можно выделить 2 стороны:

  1. Инструментальная: существуют программы и устройства, помогающие обходить ограничения.

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

Без социальной составляющей инструментальная не работает. Не самый очевидным примером социальной доступности является флаг -h у Unix-команд ls и df, который выводит числа в удобном для человека виде.  Просто хорошо продуманная реализация доступности незаметна и делает использование удобнее всем.

Основные ошибки и рекомендации при оформлении контента с учётом удобства пользования скрин-ридером

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

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

У пользователей скрин-ридеров часто возникают следующие нарекания к тексту: «из того, что прозвучало, непонятно, что же написано в оригинале». Инструментальные средства доступности не могут самостоятельно справиться со сложностями вариантов написания. В дело должна вступить социальная составляющая.

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

Числа

Правильный формат

М означает миллионы, Т - тысячи, Е - единицы, Д - Дробную часть.

  • МММ.ТТТ.ЕЕЕ,ДД, например 123.456.789,01 (миллионы отделены от тысяч и единиц точкой, дробная часть отделена запятой)

  • +МММ.ТТТ.ЕЕЕ,ДД (без пробела между плюсом и числом)

  • -МММ.ТТТ.ЕЕЕ,ДД (без пробела между минусом и числом)

Пример:

123.456.789,01

Неправильный формат

  • МММТТТЕЕЕ.ДД

  • - МММТТТЕЕЕ

  • + МММТТТЕЕЕ

Вносящие путаницу варианты записи

  • Если между минусом и числом поставить пробел, то такая запись будет читаться как «дефис число».

  • Если части числа разделены пробелом, то при записи «12 380 664» вместо одного восьмизначного числа пользователь услышит три отдельных числа: 12, 380 и 664.

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

Время

Правильный формат

  • ЧЧ:ММ (11:55)

  • ЧЧ:MM:CC (11:55:44)

  • «открыты с 10 до 19».

Время, записанное в таком формате, будет читаться правильно как

  • ЧЧ часов ММ минут

или

  • ЧЧ часов, ММ минут, СС секунд

Неправильные форматы

  • «12-05» будет читаться как «двенадцать ноль пять», без часов и минут,

  • «12ч 05м» будет читаться как «двенадцать че ноль пять эм»,

  • «открыты 10 – 19» будет читаться как «открыты десять дефис девятнадцать».

Дата

Правильный формат

  • дд.мм.гггг

  • дд/мм/гггг

Обязательно используйте 4 цифры для года, это устраняет неоднозначности.

Неправильный формат

  • дд/мм/гг

  • дд.мм.гг

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

Сокращения (масса, длина, объём)

Правильная запись

Число пробел единица СИ

  • 100 км

  • 100 ккал

  • 100 м

  • 100 кг

  • 100 Па

  • 10 г

  • 10 Н

  • 100 мл

  • 100 л

Неправильная запись

  • Числоединица (без пробела)

  • Число__единица (2 пробела)

Такие записи читаются как число и буквы.

Если правильная запись через один пробел «100 ккал» звучит как «сто килокаллорий», то «100ккал» и «100__ккал» (2 пробела) звучат как «стоккал».

Адрес

Правильная запись

  • 3я ул. Строителей д. 25

(«ул.» и «д.» с точками, и через пробел звучат как «улица» и «дом»).

Неправильная запись

  • 3я ул. Строителей д.25

Д.25 без пробела звучит как «Дэдвадцать пять»

Надежная запись

  • «Третья улица Строителей, дом 25, квартира 12, третий этаж»

Лучше пишите части адреса, такие как «дом», «корпус», «квартира», «улица», «город» полностью.

Деньги

Правильная запись

  • Число руб (1 пробел)

При этом число копеек произноситься не будет.

Для фунта, доллара и евро запись вида

  • £число

  • €число

Будет озвучена с пенсами или центами.

Неправильная запись

  • ₽1

  • 1₽

Символ ‘₽’ не озвучивается, и поэтому не должен использоваться для цен.

Для того чтобы символ ₽ читался, можно воспользоваться NVDA, где присутствует такая опция, которая заменяет его до подачи на синтезатор

В Narrator такого хака нет.

Математические символы 

Правильно:

  • ÷ для деления

  • × для умножения

  • ≠ для неравенства

  • ± для плюс-минус

  • ≥ для больше или равно

  • ≤ для меньше или равно

Неправильно

  • / для деления (слэш)

  • * для умножения (звездочка)

  • != для неравенства (равно)

  • +- для плюс-минус

  • >= для больше или равно (больше равно)

  • <= для меньше или равно (меньше равно)

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

Особенности восприятия информации

Аббревиатуры и сокращения

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

  1. Длинный термин (далее СОКРАЩЕНИЕ)

  2. СОКРАЩЕНИЕ (оригинальный длинный термин)

  3. СОКРАЩЕНИЕ

Пример: «Станок с ЧУ» будет читаться как «Станок с че-у», поэтому параграф про такой станок должен содержать текст:

… Числовое управление (далее ЧУ) станка. …. ЧУ (числовое управление) этого станка…. Программирование ЧУ осуществляется в …..

Структура текста в письмах и постах

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

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

  • стрелку вверх

  • стрелку вниз

Оформляя списки буллитами, а не перечислениями через запятую, вы делаете текст более доступным.

Ссылки

Ссылки должны быть максимально конкретными, например, указывайте ссылки на видео ролик в Ютубе с привязкой ко времени. Для этого нажмите правой кнопкой мыши в окне воспроизведения и выберите опцию «Сopy video at current time».

Знаки препинания

Пунктуация влияет на скорость озвучки. В обычных предложениях точка и запятая влияют на продолжительность пауз между словами и предложениями. Так, пауза между словами в предложении равна 10-20 миллисекунд. Запятая же в предложении приостановит скрин-ридер сразу на треть секунды.

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

  • Такой.

  • Текст.

  • Будет.

  • Гораздо.

  • Дольше.

  • Проходить.

  • Через.

  • Скрин-ридер.

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

Таблицы

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

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

Пример:

Адресат

Квартира

Был на собрании?

За замену лифта

Иванов

1

Не был

н/д

Петров

2

Был

Против

Сидоров

3

Не был

н/д

Третья строка будет озвучена как:

Адресат <пауза> Сидоров <пауза> Квартира <пауза> три <пауза> Был на собрании?<пауза> Не был <пауза>За замену лифта <пауза>эн слэш дэ.

Предположим, что в таблице 20 срок. Уже к 10-ой повторение заголовка <Был на собрании?> утомит слушателя. Повторяющиеся фрагменты в тексте «захламляют» аудиоверсию, поэтому делайте заголовки короче.

До появления таблицы расскажите, о чем она. Это позволит сделать заголовки столбцов короче.

Для обозначения пустой клетки в таблице не используйте ‘н/д’, озвучиваем как «эн слэш дэ», а используйте символ ‘-‘ (минус). Отсутствие информации будет явно донесено до зрячих, а для незрячих скрин-ридер просто не будет озвучивать клетку.

Пример.

В следующей таблице приведены итоги поквартирного голосования о замене лифта: 

Фамилия

Квартира

Участвовал

Голос

Иванов

1

Нет

-

Петров

2

Да

Против

Сидоров

3

Нет

-

Таблица с такими заголовками и ячейками намного лучше воспринимается на слух.

Советы по оформлению таблиц

  • Обязательно выделяйте заголовок таблицы.

  • Давайте описание таблицы до её появления в тексте.

  • Давайте краткие заголовки столбцам, лучше в одно слово.

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

  • Минимизируйте число знаков при записи чисел, например, «3,9 миллиона» лучше, чем «3.901.121».

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

Скорость Screen Reader

Текст известной скороговорки:

Тридцать три корабля лавировали лавировали да не вылавировали.

Корабли лавировали лавировали да не вылавировали, ведь не веровали в вероятность вылавировать, а веровали бы — вылавировали бы.

Microsoft Irina Russian (Desktop) озвучивает на максимальной скорости за 6 секунд.

Вероятнее всего, вы произнесете этот текст вслух значительно медленнее, чем скрин-ридер на максимальной скорости, но прочитаете намного быстрее. Всего за 2 – 3 секунды. При правильном оформлении текста, скрин-ридер прочитает текст в 2 – 3 раза медленнее, чем человек, читающий «про себя».

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

Слова «волк» и «де-ло-про-из-во-ди-тель-ни-ца» для правильного сравнения надо разбить на слоги. 

Эминем в песне «Majesty» 2018 года поддерживал скорость чтения 10.3 слога в секунду  на протяжении более 10 секунд. В нашей скороговорке более 74 слогов.  Microsoft Irina читает их со скоростью 12.2 слога в секунду, что намного быстрее рекорда Эминема. 

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

Способы проверить то, как же звучит написанное

Для Windows можно попробовать следующие 3 варианта:

  • Команда в shell

PowerShell -Command "Add-Type –AssemblyName System.Speech; (New-Object System.Speech.Synthesis.SpeechSynthesizer).Speak(

'123456789; 123,456,789; 32°C; 32C ');"
  • Простой скрипт на python

# pip install pypiwin32

import win32com.client

speaker = win32com.client.Dispatch("SAPI.SpVoice")

text='≠,≥,≤,±,×; 32°C; 32C; 1234567; 1,234,567; tehn; then ????'

speaker.Speak(text)
  • Самый простой способ, через Read Aloud в Microsoft Edge

Создать файл 1.htm следующего содержания:

<pre>

Скопировать текст сюда

</pre>

После чего открыть его в Edge, запустить из меню режим Read Aloud:

Отличия Windows Narrator от Apple VoiceOver

Русский голос для операционных систем Apple называется Milena. Irina и Milena разные. Microsoft Irina знает физику лучше, чем Apple Milena. Поэтому только Irina озвучивает Ньютоны, Паскали, следит за килокалориями. Так как Milena не дружит с физикой «100 Па» будет озвучено как «сто па», а не «сто паcкалей».

Зато Irina обязательно требует пробела между числом и обозначением единицы измерения. Apple Milena же менее требовательна к качеству исходного текста, более лояльно относится к отсутствию пробела перед граммами, километрами. И пытается озвучить число, даже если нет разделителя тысяч. Но такая универсальность иногда играет против неё.

Следующий текст (2 разных строки):

100₽

500 руб

Apple Milena озвучит как «сто тысяч пятьсот рублей», что совсем неправильно, в то время как Microsoft Irina кажет «сто <пауза> пятьсот рублей».

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

Примеры озвучки на Windows

Таблица с информацией о том, как же звучат различные варианты записи текста:

Сокращение

Озвучка

и т.д.

и так далее

и т.п.

и тэ пэ

пн. – пят.

пээн точка пят

3я ул. Первостроителей

третья улица Первостроителей

3я ул. Первостроителей д. 2

третья улица Первостроителей ддва

1,20₽

один запятая два ноль

$1.20

одна целая две десятых доллара

1,20 руб

одна целая две десятых рубля

2л воды

два эл воды

2 л воды

два литра воды

1кг сахара

один кэгэ сахара

100ккал

Стоккал

100  ккал (2 пробела)

Стоккал

100 ккал (1 пробел)

сто килокалорий

1 кг сахара

один килограмм сахара

3 км

три километра

100м

сто эм

100 м

сто метров

30 кв. м

тридцать квэм

30 м^2

тридцать эм циркумфлекс два

≠, ≥, ≤, ±, ×

не равно, больше чем или равно, меньше чем или равно, плюс-минус, умножение

!=, >=, +-,*

равно, больше чем равно, плюс-минус, звёздочка

01.02.2005

первое февраля две тысячи пятого года

01.02.99

первое февраля девяносто девятого года

01.02.05

ноль один точка ноль два точка ноль пять

01/02/2005

первое февраля две тысячи пятого года

01/02/99

первое февраля девяносто девятого года

01/02/05

ноль один слэш ноль два слэш ноль пять

НДФЛ

эндээфэль

12-05

двенадцать ноль пять

12:05

двенадцать часов пять минут

12ч 05м

двенадцать че пять эм

12:05:30

двенадцать часов пять минут и тридцать секунд

????,⛔, ????, ????, ????

лицам до 18 лет вход запрещен, въезд запрещен, буквы сос в квадрате, курение запрещено, значок запрета велосипедов.

????????????????♿????????????

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

Youtube

ютюб (не ютуб!)

Vk, fb

викей, эфбы

123456

сто двадцать три тысячи четыреста пятьдесят шесть

123.456

сто двадцать три тысячи четыреста пятьдесят шесть

1234567

один два три четыре пять шесть семь

1.234.567

один миллион двести тридцать четыре тысячи пятьсот шестьдесят семь

Проверка читаемости ваших документов

Вы можете проверить доступность своих документов для незрячих пользователей в различных приложениях MS Office с помощью функции «Inspect Document» в меню «File».

Проверка подскажет, что нужны действия с вашей стороны если

  • рисункам надо дать альтернативное текстовое описание,

  • у таблицы нет заголовка,

  • ссылка слишком длинная для озвучки.

Заключение

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

Комментарии (7)


  1. PereslavlFoto
    20.12.2023 13:43

    Если между минусом и числом поставить пробел, то такая запись будет читаться как «дефис число».

    Для чего же вы пишете знак дефиса там, где следует написать знак минуса?

    Если части числа разделены пробелом, то при записи «12 380 664» вместо одного восьмизначного числа пользователь услышит три отдельных числа: 12, 380 и 664.

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

    Вот так и получается, что ничем разделить нельзя.

    «12ч 05м» будет читаться как «двенадцать че ноль пять эм»,

    Судя по записи в кавычках, к этому и стремился автор записи в кавычках.

    «открыты 10 – 19» будет читаться как «открыты десять дефис девятнадцать».

    А что если писать не через знак дефиса, а через знак тире? «Открыты 10—19», как и требуют правила пунктуации. Что будет в этом случае?

    дд.мм.гггг

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


    1. adrozhzhov Автор
      20.12.2023 13:43

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

      Но для скрипта на питоне пришлось добавлять специальный обработчик вывода целых чисел в pandas.

      # --- format trick to use thousands separators
      
      
      class _IntArrayFormatter(pd.io.formats.format.GenericArrayFormatter):
      
          def _format_strings(self):
              formatter = self.formatter or (lambda x: ' {:,}'.format(x))
              fmt_values = [formatter(x) for x in self.values]
              return fmt_values
      
      
      pd.io.formats.format.IntArrayFormatter = _IntArrayFormatter
      # ---- end o format trick
      

      Примеры, которые приводятся в статье на русском, проверялись с руcской локалью на Windows (и MacOS).

      Про различные локали:

      Ирина Десктоп (русский голос по умолчанию), входящая в Windows умеет читать английский текст, но делает это сильно медленне Зиры и тем более Давида (английских голосов).

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

      Так что если будет Ирина Десктоп, то озвучиваются тексты на русском языке и формат даты будет российский дд.мм.гггг

      Если хочется попробовать звучание какого-то кусочка, то пример как это сделать с помощью PowerShell приведён.

      Попробуете!


  1. ifap
    20.12.2023 13:43

    Правильная запись

    3я ул. Строителей д. 25
    

    Эээ... правильная вообще-то:

    3-я

    Символ ‘₽’ не озвучивается, и поэтому не должен использоваться для цен.

    Может не стоит использовать программу, которая не озвучивает ISO-символ валюты?


    1. adrozhzhov Автор
      20.12.2023 13:43

      Стандартные средства встроенные в различные операционки не умеют озвучивать "₽"

      Как настроить произношение в NVDA показано на единственном скриншоте из этой программы.


  1. Mingun
    20.12.2023 13:43

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

    • разметка в большинстве случаев вставлялась автоматически;

    • инструмент подсказывал, где проблемы, еще при написании.

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


    1. aelaa
      20.12.2023 13:43

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


    1. adrozhzhov Автор
      20.12.2023 13:43

      Проверка доступности текста или документа есть в MS Word.

      Но мало кто её пользуется.

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

      Напимер, в excel есть кнопка форматирования чисел.

      Её можно вынести на панель быстрого доступа и в один клик сделать хорошо читаемыми.

      Это не сложно.

      Как набрать -h в unix командах.