检查所有自定义控件是否都有适当的 role 以及提供其属性和状态的所有必需 ARIA 属性。例如，自定义复选框需要 role="checkbox" 和 aria-checked="true|false" 才能正确传达其状态。如需大致了解 ARIA 如何为自定义控件提供缺失的语义，请参阅 ARIA 简介。
如何手动测试
如需检查所有自定义交互控件是否都具有适当的 ARIA 角色，请使用 Chrome 开发者工具无障碍窗格或屏幕阅读器测试该页面。 JAWS 和 NVDA 是两种比较常用的 Windows 屏幕阅读器。VoiceOver 是 MacOS 中内置的屏幕阅读器。
使用 CSS，您可以为 <div> 和 <button> 元素设置样式，使它们传达相同的视觉效果，但是在使用屏幕阅读器时，这两种体验截然不同。<div> 只是一个通用的分组元素，因此屏幕阅读器只会读出 <div> 的文本内容。<button> 以“按钮”的形式读出，可以更明确地向用户表明这是他们能够与之互动的内容。另请参阅语义和屏幕阅读器。
修正方法
解决此问题的最简单且通常的最佳解决方案是完全避免使用自定义交互控件。
例如，将充当按钮的 <div> 替换为实际的 <button>。
如果您必须保留 <div>，请将 role="button" 和 aria-pressed="false" 添加到 <div>。
现在，屏幕阅读器会读出 <div> 的角色和互动状态。
重要意义
要想真正了解辅助技术用户对您内容的体验，唯一的方法就是使用屏幕阅读器自行检查相应内容。直接使用屏幕阅读器可让您清楚地了解内容的标签，以及辅助技术导航是否有任何障碍。如果您不熟悉辅助技术如何解读语义标记，请参阅语义简介来回顾相关知识。
另请参阅如何进行无障碍功能审核。