我有一个拥有主/详细设计的网站。主视图是一个柱形图，其中单击其中一列（每列代表一个月）会更改详细视图（这是一个列出该时间段的一些详细信息的嵌套表）。我已经开始进行无障碍审核，正如您可能想象的那样，它无法访问。我通过添加aria-hidden="true"并添加一个不可见的表来解决图表，该表具有与月份行中的按钮相同的内容。现在激活按钮将与单击图表列完全相同 - 更改详细视图。
当点击主视图中的表格中的按钮时，我的屏幕阅读器（在这种情况下为VoiceOver Safari）读取＆＃34;按钮单击＆＃34;，然后使用光标键继续读取表格。我假设一个用户，一旦他们决定点击哪个按钮想要阅读细节视图，所以我想将它们移动到那里。
我将按钮更改为<a href="#detail-view" ng-click="loadDetail">，并为详细视图容器div id="detail-view"。这似乎没有做任何事情。
答案 0 :(得分：0)
简单回答：不要。将焦点转移到一个没视力的用户实际上是一种可访问性违规。参见WCAG标准3.2.2。
简而言之，在按下按钮或其他控制交互后，您不应自动启动上下文更改。您应该做的是通过公告或通过提供控件本身的辅助功能文本更改的描述来通知用户新内容。提供此上下文的一个示例是将主单元格声明为＆＃34; tabs＆＃34;。只是按钮的简单关联表现为标签提供了大量信息！
为了使您的应用程序更易于访问，您应该通过提供适当的角色信息来确保用户知道他们处于主 - 详细控制类型中（我发现＆＃34; tab＆＃34;最有可能在这里，但其他角色可能适用）。此外，在主视图顶部提供标题和详细视图，以便他们可以轻松地在两者之间导航。只要他们知道他们在哪里，并且可以轻松导航到页面的重要区域，他们就可以了。自动转移焦点实际上是一种可访问性违规，应该避免。