html - role="radiogroup" 和 role="radio" 真的有必要吗？

Question

有一些 ARIA 教程网站使用非语义标记和一些 javascript 来演示 and 的使用，role="radiogroup"例如role="radio"以下示例：

<ul role="radiogroup">  
    <li tabindex="-1" role="radio" aria-checked="false">  
        <img role="presentation" src="radio-unchecked.gif">
        Option1
    </li>  
    <li tabindex="0"  role="radio" aria-checked="true">  
        <img role="presentation" src="radio-checked.gif">
        Option2
    </li>  
</ul>

role但是，当我们已经有了语义和无 javascript 的方法时 ，使用这些 s 有什么意义，例如：

<ul>  
    <li>  
        <input  id="opt1" type="radio" name="opt" value="1">
        <label for="opt1">Option1</label>
    </li>  
    <li>  
        <input  id="opt2" type="radio" name="opt" value="2">
        <label for="opt2">Option2</label>
    </li>  
</ul>

Answer 1

因为有些人真的，真的想要为他们的表单控件定制设计，不管有没有语义上合适的元素，他们都会用图像和一堆 JavaScript 代替它们。

这些角色只是允许在这样做时减轻损害。

Answer 2

在第二个版本中：你需要在 ul 上设置一个角色="radiogroup"。

或者更好的可访问性：使用字段集。

aria 不是为了语义，而是为了可访问性。