Question

有些ARIA教程网站使用非语义标记和一些javascript来演示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>

但是当我们已经有了语义和无javascript的方法时，使用那些role的重点是什么：

<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。

上使用role =“radiogroup”

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

咏叹调不是用于语义，而是用于可访问性。

是role =“radiogroup”和roll =“radio”真的有必要吗？

2 个答案: