如果HTML元素具有角色=“按钮”如果它也具有属性“名称” [英] If an HTML element has role="button" should it also have the attribute "name"
问题描述
如果HTML5 < div> 元素需要角色=按钮属性来确保成功结果在可访问性审计中（成功标准4.1.2 [Name，Role，Value] .. div充当UI中的按钮），那么它是否也需要一个有效的名称属性（通常对于 div 而言，这通常是无效的HTML5）。 如果答案是否定的，我可以添加其他可访问性友好属性来描述div按钮并符合条件吗？一个简单的标题属性或 aria-label ？
我认为最初的问题是因为对WCAG 4.1.2名称，角色，价值中的名称的含义有所混淆。
对于< div> ，name =属性确实无效。 name =用于命名对象，以便它可以在JavaScript中引用。它与可访问性无关。
4.1.2中的名称指的是屏幕阅读器和其他辅助技术将调用的对象。对于按钮，通常是按钮上显示的文本。对于输入字段，通常是字段的标签。如果您有< div> ，那么正如其他人指出的那样， aria-label name的对象。
当焦点转移到对象时，大多数屏幕阅读器将读取对象的名称/标签，角色（按钮，复选框，组合框，表格等），以及对象的值或状态（输入，组合框，复选框状态）。
这三条信息很快通过眼睛确定并且基本上为您提供了有关对象所需的全部信息。同样的信息应该出现在辅助技术上。
If a HTML5 <div> element requires a role="button" attribute to secure a success outcome in an accessibility audit (Success Criterion 4.1.2 [Name, Role, Value]..the div is acting as a button in a UI), does it then also require a valid name attribute (which would normally be invalid HTML5 for a div).
If the answer is no - what other accessibility friendly attribute can I add to describe the div button and meet the criteria? A simple title attribute or aria-label?
I think the original question came about because of some confusion on what "name" means in "WCAG 4.1.2 Name, Role, Value".
The name= attribute is indeed invalid on a <div>. The name= is used to name an object so that it can be referenced in javascript. It has nothing to do with accessibility.
The "name" in 4.1.2 is referring to what the object will be called by the screen reader and other assistive technology. For buttons, it's usually the text that's displayed on the button. For input fields, it's usually the label for the field. If you have a <div>, then as pointed out by others, the aria-label is how you would "name" the object.
When focus goes to the object, most screen readers will read the name/label of the object, the role (button, checkbox, combobox, table, etc), and the value or state of the object if appropriate (input, combobox, checkbox status).
Those three pieces of information are quickly ascertained by the eye and essentially give you all the information you need to know about an object. That same info should be surfaced to assistive technology.
这篇关于如果HTML元素具有角色=“按钮”如果它也具有属性“名称”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
