Html 是否应该始终在页脚元素上添加 role="contentinfo"?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11191746/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 01:15:40  来源:igfitidea点击:

Should role="contentinfo" be always added on footer element?

htmlfooterwai-aria

提问by Ian Y.

On ARIA demonstration websites, role="contentinfo"is usually added on footerelement.

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

However, footers in modern web designcan be creative so that they can also contain things like supplementary navigation links, social website links, or even a newsletter form.

但是,现代网页设计中的页脚可以具有创造性,因此它们还可以包含补充导航链接、社交网站链接甚至时事通讯表格等内容。

Taking the following codes of footer for example. Should role="contentinfo"be added on the footeror the pelement?

以下面的footer代码为例。应该role="contentinfo"加在footer还是p元素上?

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



EDIT: I had asked this question by utilizing the W3C ARIA mailing list, and Steve Faulkner, a member of W3C HTML Working Group has replied. The following is his suggestion:

编辑:我曾通过 W3C ARIA 邮件列表询问过这个问题,W3C HTML 工作组的成员 Steve Faulkner 已经回答了。以下是他的建议:

I would also take into account how browsers map the footer element to accessibility APIs.
In Firefox the footer is mapped to ARIA role=contentinfo
In Webkit/safari/chrome the footer is mapped to ARIA role=group if it is contained within a section or article element otherwise it is mapped to role=contentinfo
In IE it is not mapped

So doing this:
<div role="contentinfo">
    some content
    <footer>some content</footer>
</div>

will lead to nested contentinfo landmarks being announced in browsers that already map footer to contentinfo.

I would suggest therefore that adding role=contentinfo to the main footer, not worrying too much about content that you think may not be appropriate being in the footer.

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

所以这样做:
<div role="contentinfo">
    some content
    <footer>some content</footer>
</div>

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

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


So the suggested approach is adding role="contentinfo"to the main footer.


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

采纳答案by bcm

I think it should be on the footer tag in your case.

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

It is meant to give information about the parent document, so I would use it if your footer elements give a good context of the parent.

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

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

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

回答by Mike McLin

As of now there is no definitive right answer.

目前还没有明确的正确答案。

If you go by the spec: http://www.w3.org/TR/wai-aria/roles#contentinfo, contentinfois described as:

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

"A large perceivable region that contains information about the parent document. Examples of information included in this region of the page are copyrights and links to privacy statements."

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

So, in this case it should be placed on your <p>tag.

所以,在这种情况下,它应该放在你的<p>标签上。

However, pretend you are the user that is utilizing these landmarks. If everyone places the role="contentinfo"on the footer, then that is what the user expects. The user doesn't care what a "spec" says, they just want a consistent experience as they browse from website to website. They are probably expecting footer links and such to be in the contentinfosection, because that's how it is implemented on many sites, and as you mentioned it is the recommended way per many accessibility experts.

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

I prefer to cater to the user, and therefore I apply it on the footerelement, however I keep in the back of my mind that this goes against the spec (or at least my interpretation of it)and that implementation of this might change as browsers and other accessible technologies begin implementing accessibility in a more consistent manner.

我更喜欢迎合用户,因此我将它应用在footer元素上,但是我始终牢记这与规范(或至少我对它的解释)背道而驰,并且它的实现可能会随着浏览器的变化而改变和其他无障碍技术开始以更一致的方式实现无障碍。

回答by Madara's Ghost

I would go with the <p>element. I mean, the point of HTML is to give context to your text. So give appropriate context by doing appropriate markup.

我会和<p>元素一起去。我的意思是,HTML 的重点是为您的文本提供上下文。因此,通过进行适当的标记来提供适当的上下文。

Give the role to the most appropriate element, it is not a limited attribute to footer elements.

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

回答by Mike Gifford

It is redundant information as the semantics are already conveyed through the HTML5 specs https://dequeuniversity.com/assets/html/jquery-summit/html5/slides/landmarks.html#the_difference_between_html5_and_aria

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

Generally you can skip the ARIA roles if they overlap with the semantic understanding of the HTML5 element.

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

I think this is right, but needs testing from screen readers to determine that this is accurate.

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