Использование атрибутов WAI-ARIA и семантических тегов HTML5 в одном документе
Я разрабатываю веб-сайт для нашей маленькой компании и хотел бы использовать оба семантических тега (<article>, <section>и т. д.) и фрагменты структурированных данных JSON-LD.
В дополнение к семантическим тегам и JSON-LD, мы хотим сделать веб-сайт более доступным для людей с ограниченными возможностями, и я изучал атрибуты WAI-ARIA.
Могут ли атрибуты WAI-ARIA использоваться одновременно с семантическими тегами и структурированными данными? Или есть риск конфликта, который повлияет на их функциональность?
1 ответ
Поддержка WAI-ARIA противоречива как для браузеров, так и для технологий чтения с экрана.
Я бы рекомендовал использовать атрибуты ARIA только в тех случаях, когда вы не можете достичь того же результата в нативном HTML, так как HTML5 значительно улучшил семантику. Добавление атрибутов ARIA без необходимости не поможет улучшить доступность вашего веб-сайта, и для вас это просто дополнительная работа. Используйте только по мере необходимости.
Первое правило ARIA гласит:
Если вы можете использовать собственный элемент HTML [HTML51] или атрибут с семантикой и поведением, которые вам уже требуются, вместо повторного выбора элемента и добавления роли, состояния или свойства ARIA, чтобы сделать его доступным, то сделайте это.
Например, вы не хотите добавлять aria-label к изображению, когда вы можете просто использовать alt, Также нет необходимости явно назначать роли aria-role когда многие уже подразумеваются через их эквивалентные элементы HTML (например: кнопка, навигация, статья). Также предпочтительно использовать HTML-состояния, такие как required а также disabled а не эквиваленты ARIA: aria-disabled а также aria-required,
Ресурсы WAI-ARIA
Совместимость с программами чтения с экрана WAI-ARIA PowerMapper - это действительно хорошее отображение, какие атрибуты ARIA совместимы с какими программами чтения с экрана и браузерами.
Что такое WAI-ARIA, что он делает для меня, а что нет? - Ключевые разделы, которые я бы порекомендовал прочитать: "Когда я не должен его использовать? и "Когда я должен использовать это?".