合乎逻辑的 Tab 键顺序对于用户获得流畅的键盘体验非常重要。屏幕阅读器和其他辅助技术会按照 DOM 顺序浏览网页。 信息流应合理。
如何手动测试
如需检查应用的标签页顺序是否合理,请尝试按 Tab 键浏览页面。一般来说,焦点应遵循阅读顺序,即从上到下的顺序。对于大多数语言,朗读顺序是从左向右排列。在某些语言(例如阿拉伯语和希伯来语)中,阅读顺序为从右到左。
在评估标签页顺序时,请注意以下两个要点:
- DOM 中的元素是否按逻辑顺序排列?
- 屏幕外内容是否已在导航栏中正确隐藏?
注意导航中是否有任何跳跃现象。此外,请注意是否有任何跳出屏幕的情况,即按 Tab 键会将您带到不应显示的内容。
如需了解详情,请参阅键盘使用基础知识。
解决方法
如果焦点顺序有误,请重新排列 DOM 中的元素,以使 Tab 键顺序更自然。
避免使用 CSS 在视觉上重新调整元素的位置,因为辅助技术用户会体验到无意义的导航。请将元素移至 DOM 中的更前面的位置,而不是使用 CSS。
如果键盘控件仍可访问屏幕外内容,请考虑使用 tabindex="-1"
将其移除。
如需了解详情,请参阅使用 tabindex 控制焦点。