Заголовок таблицы в электронном сообщении, анонсируемом дважды (только первый столбец, анонсирующий два раза) в голосовой связи (ADA) в iOS - PullRequest
Новая
       5

Заголовок таблицы в электронном сообщении, анонсируемом дважды (только первый столбец, анонсирующий два раза) в голосовой связи (ADA) в iOS

0 голосов
/ 30 мая 2019

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

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

Например, если Item является первым столбцом, голос за кадром объявляется как «Item, Item». Эта проблема возникает только на устройствах iOS. Для других устройств это работает как положено. 

<table class="setDisplayWidthInner" border="0" cellpadding="0" cellspacing="0" align="center">
    <caption style="text-align:left; padding-top: 20px;">
        <span style="height: 26px;  font-family: Arial;  font-size: 24px;  line-height: 1.08; text-align: left;  color: #000000;">
                        <h2 style="font-size:24px;margin: 0px;font-weight: normal;">
                                    Canceled service appointment
                        </h2>
                    </span>
    </caption>
    <thead>
        <tr style="height: 22px;  font-family: Arial;  font-size: 20px;  line-height: 1.22;  text-align: left;  color: #000000;">
            <th scope="col" style="padding-top: 24px; width:30%; font-weight: normal" align="left">Auto service</th>
            <th scope="col" style="padding-top: 24px; width:40%; font-weight: normal" align="left">Service location</th>
            <th scope="col" style="padding-top: 24px; font-weight: normal" align="left">Customer</th>
        </tr>
        <tr>
            <td aria-hidden="true">
                <hr aria-hidden="true">
            </td>
            <td aria-hidden="true">
                <hr aria-hidden="true">
            </td>
            <td aria-hidden="true">
                <hr aria-hidden="true">
            </td>
        </tr>
    </thead>
    <tbody>
        <!-- body goes here -->
    </tbody>

Ожидаемый результат в iOS (устройства iPhone) с включенной передачей голоса:

Элемент должен быть объявлен как «Элемент» только один раз.

Фактический результат в iOS (устройства iPhone) с включенным голосом:

Предмет объявляется как «Предмет» (дважды).

1 Ответ

0 голосов
/ 31 мая 2019

Чтение этого - https://a11y -101.com / development / tables ... Я вижу, что вы используете теги заголовка таблицы (<‌th‌>) для достижения семантической структуры таблицы, но я думаю, что вы на самом деле вводите в заблуждение программное обеспечение для чтения с экрана.Я думаю, что вы должны использовать заголовки таблиц для связи содержимого с заголовком, но в вашем случае вы фактически не предоставляете никакого содержимого в ячейках таблицы.Поэтому VoiceOver запутывается и просто повторяет заголовок таблицы, потому что не может найти связанный контент.

В этом случае вам повезло, что только VoiceOver обнаруживает его, но я бы предложил изменить эти теги для <‌td‌> s и повторное тестирование ...?

...