Доступность HTML5/ARIA: Какую роль я должен использовать в статье для перевода?

Я хотел бы улучшить доступность в блоге, над которым я работаю. Блог двуязычный и по умолчанию отображается на венгерском языке. Щелчок по флагу вызывает смену языка (JavaScript удаляет класс nodisplay из блоков div с class=js-en и добавляет его в div с class=js-hu).

Я хотел бы разделить две части каждой статьи. Я рассматривал возможность использования <aside>, но это было бы неточно (при просмотре на английском языке это также основной контент блога).

Что вы предлагаете для улучшения доступности с помощью действительных тегов и ролей ARIA?

Сообщения выглядят примерно так:
[Изменить: изменено <div class="js-en nodisplay"> на <div class="js-en" hidden>]

<article>
  
  <div class="js-hu"> <!-- blog post in Hungarian -->
    <p>
      magyar szöveg, nem értenéd
    </p>
  </div>

  <div class="js-en" hidden> <!-- blog post in English -->
    <p>
      same text in English
    </p>
  </div>
  
 </article>


html accessibility translation wai-aria
person c0derabbit    schedule 18.05.2016    source источник

Ответы (2)


arrow_upward
4
arrow_downward

Разве это не больше роль атрибута lang?

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

person Knu    schedule 18.05.2016
comment
Хм, я не думал об этом. Это может быть как раз то, что я ищу. :lang тоже будет полезно. Спасибо за это! - person c0derabbit; 18.05.2016

arrow_upward
1
arrow_downward

Хотя атрибут lang является важной частью общения, он не представляет собой ответ на ваш вопрос.

Для сообщения об изменении доступности вы должны использовать состояние WAI-ARIA, а не роль. В этом случае состояние, которое нужно изменить для каждого элемента, — это aria-hidden атрибут.

Но использование атрибута html hidden сделает это за вас. Согласно проекту спецификации W3C ARIA в HTML, aria-hidden состояние автоматически отражает атрибут hidden. Так как вы уже используете скрытый атрибут, никаких дальнейших изменений не требуется.

person Alohci    schedule 18.05.2016
comment
Атрибут lang — идеальный ответ на вопрос Что вы предлагаете для улучшения доступности?. Бесспорно. Вы не будете сообщать об изменении языка, полагаясь исключительно на атрибут hidden. - person Adam; 18.05.2016
comment
@Adam Адам - ​​правда, поэтому я сказал, что атрибут lang важен. Но установка скрытого атрибута сообщает об изменении, которое направляет AT, чтобы сообщить пользователю новый видимый текст. - person Alohci; 18.05.2016