Добавить на сайт озвученные скринридером примеры

[sukhoverkhova]

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

[Gaponchuk]

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

[pepelsbey]

@Gaponchuk можно выделить демки на отдельные страницы (а можно и тут же попробовать), открыть скринридер и записать, как он читает. На macOS есть QuickTime, на Windows 10 тоже какой-то встроенный рекордер.

[sukhoverkhova]

Скринридеры для винды, которыми я пользовалась, — JAWS 18, NVDA. Что-то почитать о них можно на официальных сайтах, какие-то новости на сайте Тифлокомп.

JAWS — платная программа, есть демо-доступ на 40 минут, который обновляется после перезагрузки компьютера. У меня сломались некоторые шрифты после установки JAWS, если что, не удивляйтесь :)

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

Для Мака есть встроенный VoiceOver, я пользовалась им меньше.

@Gaponchuk можно выделить демки на отдельные страницы (а можно и тут же попробовать), открыть скринридер и записать, как он читает.

Полученные записи можно добавить под примеры. Например, можно начать с JAWS или с VoiceOver.

[sergeicodes]

У меня сломались некоторые шрифты после установки JAWS, если что, не удивляйтесь :)

@asuhoverhova скорей всего что-то с русской версией, в английской ничего такого не видел.

Вот здесь можно посмотреть доступные голосовые пакеты для русского языка для NVDA:
https://github.com/nvaccess/nvda/wiki/ExtraVoices

Честно сказать все не очень - шумно, не понятно.

Есть еще https://vocalizer-nvda.com/ но там платно.

[sergeicodes]

Добавить озвучку кода скринридером «хорошего» и «плохого» примеров

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

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

А для тех, кто пока не очень со скрин ридером, можно сделать небольшую шпаргалку с основными командами или quick start guide по популярным скрин ридерам (думаю об этом #56, верно?)

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

@pepelsbey @Gaponchuk что думаете? 👆

можно выделить демки на отдельные страницы

Идея отличная, создал issue #59