IE JAWS screenreader пропускает <h1> контент - PullRequest
Новая
       35

IE JAWS screenreader пропускает <h1> контент

0 голосов
/ 24 августа 2018

Я сейчас работаю над доступностью. Форма, над которой я работаю, разбита на шаги. Каждый шаг находится в шаблоне. Когда я перехожу с шага 6 на шаг 7, JAWS не читает элемент <h1>.

Из приведенного выше изображения JAWS переходит с шага 6 на «Включая вас, сколько людей в вашем доме», что является тегом <label>. Я думал о добавлении атрибута aria. Каков наилучший подход, чтобы программа чтения с экрана не начинала показ этой страницы с 

<label class="c-question__label" for="household-members">{{ __('Including you, how many people are in your household?', 'accessnyc-screener') }}</label>

Вот код: 

<fieldset class="{{ styles.fieldset }}" id="step-7" data-track-key="Screener Step: 7"
  data-track-data='[{"WT.si_n": "ScreeningHH"},{"WT.si_p": "7-NumOfHHMembers"}]'>
  <div class="{{ styles.padding }}">
    <div data-js="step-title" class="{{ styles.number }}">{{ __('Step 7 of 10', 'accessnyc-screener') }}</div>

    <h1 class="{{ styles.heading }}">{{ __('Tell us about your household.', 'accessnyc-screener') }}</h1>

    <div class="c-question">
      <label class="c-question__label" for="household-members">{{ __('Including you, how many people are in your household?', 'accessnyc-screener') }}</label>

      <p>{{ __('This is usually family members who you both live with and share important resources like food and bills. Only count your roommates if you often buy and prepare food together.', 'accessnyc-screener') }}</p>

      <label class="c-question__label" for="household-members">{{ __('Number of People (max. 8)', 'accessnyc-screener') }}</label>
      <div class="c-question__container" data-js="question">
        <input id="household-members" type="number" name="Household.members" data-type="integer" min="1" max="8" required value="1">
      </div>
    </div>

    <div class="pt-2">
      <a class="btn btn-primary btn-next btn-small js-screener-validate-step" href="#step-8" role="button">{{ __('Continue', 'accessnyc-screener') }}</a>
    </div>
  </div>
</fieldset>{# /#step-7 #}

Как лучше всего это исправить?

1 Ответ

0 голосов
/ 22 октября 2018

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

...