HTML5和多个ARIA角色

Question

当我需要在页面区域中选择多个适合的ARIA角色时，最佳实践是什么？

我有一个类似于Facebook上微型新闻订阅的侧边栏。由于样式原因，它被双重包装：

<aside class="ticker">
  <div class="ticks">
    <!-- <article> elements here -->  
  </div>
</aside>

我觉得.ticker的正确角色是“补充的”，因为它位于一个更大的新闻源旁边，但同时我认为它也是一个“日志”，因为故事会来去。因为我有两个元素可用，所以给每个元素不同的角色是可以接受的，即使其中一个是另一个的唯一子元素。

- Elise

Answer 1

角色“complementary”是一个标志性的角色，这意味着辅助技术用户可以使用键盘在页面上导航到不同的标志性位置。因此，它有效地促进了浏览。Paciello Group Blog清楚地解释了ARIA标志性位置。

相比之下，角色“log”是一个小部件角色，根据WAI-ARIA规范的规定，这意味着辅助技术应该从浏览模式切换到应用程序模式，并将键盘事件传递给Web应用程序。

因此，这些角色具有不同的功能；“补充”有助于查找股票代码，“日志”有助于与之交互。两者都应增强页面的可访问性，因此应同时使用。

因此，您选择的角色是正确的，并且像您所做的嵌套是最佳解决方案。

为了使股票代码通报更新，需要其他ARIA属性和状态。Gez Lemon提供了一个关于与实时区域相关的这些属性的良好入门。

- vcurd