34

在 ARIA 演示网站上,role="contentinfo"通常添加在footer元素上。

然而,现代网页设计中的页脚可以是创造性的,因此它们还可以包含补充导航链接、社交网站链接,甚至是新闻通讯表单。

以下面的页脚代码为例。应该role="contentinfo"加在footerorp元素上?

<footer>
    <nav>
        <ul>
            ........
            ........
            ........
            ........
            ........
        </ul>
    </nav>
    <form>
        ........
        ........
        ........
    </form>
    <p>© 2012 Website.com. All rights reserved.</p>
</footer>


编辑:我利用 W3C ARIA 邮件列表提出了这个问题,W3C HTML 工作组的成员 Steve Faulkner 回答了这个问题。以下是他的建议:

我还会考虑浏览器如何将页脚元素映射到可访问性 API。
在 Firefox 中,页脚映射到 ARIA role=contentinfo
在 Webkit/safari/chrome 中,如果页脚包含在部分或文章元素中,页脚将映射到 ARIA role=group,否则映射到 role=contentinfo
在 IE 中它不映射

这样做:
<div role="contentinfo">
    一些内容
    <footer>一些内容</footer>
</div>

将导致在已经将页脚映射到 contentinfo 的浏览器中宣布嵌套的 contentinfo 地标。

因此,我建议将 role=contentinfo 添加到主页脚,不要太担心您认为可能不适合在页脚中的内容。


所以建议的方法是添加role="contentinfo"到 main footer.

4

4 回答 4

10

我认为它应该在你的情况下的页脚标签上。

它旨在提供有关父文档的信息,因此如果您的页脚元素提供了父文档的良好上下文,我会使用它。

https://www.w3.org/TR/wai-aria/#contentinfo

于 2012-06-26T01:33:53.447 回答
7

到目前为止,还没有确定的正确答案。

如果您按照规范:http://www.w3.org/TR/wai-aria/roles#contentinfocontentinfo描述为:

“包含有关父文档的信息的大型可感知区域。该页面区域中包含的信息示例包括版权和指向隐私声明的链接。”

因此,在这种情况下,它应该放在您的<p>标签上。

但是,假设您是使用这些地标的用户。如果每个人都将role="contentinfo"放在 上footer,那么这就是用户所期望的。用户并不关心“规范”说什么,他们只想要在从一个网站浏览到另一个网站时获得一致的体验。他们可能希望页脚链接等出现在该contentinfo部分中,因为这就是它在许多网站上的实现方式,并且正如您所提到的,这是许多可访问性专家推荐的方式。

我更喜欢迎合用户,因此我将它应用到footer元素上,但是我一直认为这违反了规范(或者至少是我对它的解释),并且它的实现可能会随着浏览器而改变和其他无障碍技术开始以更一致的方式实现无障碍。

于 2014-01-24T17:17:51.210 回答
3

我会选择<p>元素。我的意思是,HTML 的重点是为您的文本提供上下文。因此,通过适当的标记给出适当的上下文。

将角色赋予最合适的元素,它不是页脚元素的受限属性。

于 2012-06-25T15:06:31.407 回答
1

这是多余的信息,因为语义已经通过 HTML5 规范https://dequeuniversity.com/assets/html/jquery-summit/html5/slides/landmarks.html#the_difference_between_html5_and_aria

通常,如果 ARIA 角色与 HTML5 元素的语义理解重叠,则可以跳过它们。

我认为这是正确的,但需要屏幕阅读器进行测试以确定这是准确的。

于 2016-02-26T18:38:50.830 回答