Как сделать мой индикатор прогресса доступным для людей, использующих программы чтения с экрана? - PullRequest
2 голосов
/ 23 ноября 2011

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

Над индикатором выполнения есть заголовок, который говорит Введите данные (Шаг 1 из 3) или Подтвердите данные (Шаг 2 из 3) или Обновление завершено (Шаг 3 из 3)

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

Введите данные (шаг 1 из 3) Введите данные Подтвердите данные Обновление завершено Введите ваши данные Все поля, отмеченные (*), обязательны для заполнения

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

Enter details <span class="hidden">Active</span> Confirm details<span class="hidden">Incomplete</span> Renewal complete<span class="hidden">Incomplete</span>

А затем добавив в CSS

.hidden { text-indent:-3000px; 
or
  font-size:0px; }

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

Заранее спасибо за любую помощь

1 Ответ

1 голос
/ 23 ноября 2011

Использовать WAI-ARIA атрибуты. Роль Progressbar , кажется, именно то, что вам нужно.Программы чтения с экрана могут затем использовать эти атрибуты для точного представления ваших намерений.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...