原生<input type=checkbox>是否需加aria-checked？能否被屏幕阅读器原生识别？

好问题！这其实是不少刚接触无障碍开发的开发者容易混淆的点，我来给你理清楚：

• 完全不需要给原生<input type="checkbox">添加aria-checked属性
  原生复选框是浏览器内置的无障碍友好控件，浏览器会自动把它的选中状态（checked/unchecked，甚至半选的indeterminate状态）传递给屏幕阅读器等辅助技术，根本不需要你手动用ARIA属性重复声明。

• aria-checked的真正适用场景
  这个属性是专门为自定义复选框设计的——比如你用<div>、<span>这类本身没有复选框语义的元素模拟复选框时，这些元素默认不会被辅助技术识别为复选框，也没法传递选中状态，这时候才需要用role="checkbox"配合aria-checked来补全语义，告诉屏幕阅读器“这是一个复选框，当前状态是选中/未选中”。

• 画蛇添足的风险
  要是硬给原生checkbox加上aria-checked，反而可能出问题：如果原生的checked属性值和aria-checked的取值不一致，屏幕阅读器可能会读取错误的状态，反而破坏了原本完美的无障碍体验。

举个最基础的无障碍原生复选框写法，这样就足够了：

<input type="checkbox" id="terms" name="terms">
<label for="terms">我同意服务条款</label>

屏幕阅读器会自动识别这是一个复选框，并准确播报它的选中状态，完全不需要额外的ARIA属性。

内容的提问来源于stack exchange，提问作者ivysaurus