我们正在实施(即添加)对 Web 门户主导航菜单的 WAI-ARIA 支持。菜单是此处显示的菜单:
菜单是通过经典的<ul>
// DOM 树实现的<li>
,<a>
用 CSS 样式化,看起来像水平选项卡。
这种小部件的 WAI-ARIA 兼容实现是什么?
我已经阅读了 w3org 的最新 WAI-ARIA 规范的许多部分,以获得一般的理解、分类等。然后,我阅读了几个 UI 小部件实现的示例。我找不到任何专门针对此类 CSS 导航菜单的示例。我经常发现的最接近的小部件是 Menu、MenuBar 和 TabPanel。当然,我还查看了Free ARIA 社区组(最初发布此问题的地方)。
我会说这些小部件都不完全匹配(CSS)导航菜单。例如,TabPanel 可能控制页面中的某些内容(--> aria-controls),也可能是 MenuBar;但我完全不确定导航菜单是否控制页面中的内容(它控制要显示的下一页)。无需进一步说明,还有一些其他差异。参考文献在文章末尾。如果有人作为导航菜单的更好(或更合适)示例,我们将很高兴了解它们。
参考
- https://developer.mozilla.org/en-US/docs/Accessibility/ARIA/ARIA_Test_Cases#Menubar_and_Menu
- http://wiki.jqueryui.com/w/page/38666403/Menubar
- http://www.oaa-accessibility.org/examplep/menubar2/
- http://test.cita.illinois.edu/aria/menubar/
- http://dev.aol.com/dhtml_style_guide#menu
- http://whatsock.com/modules/aria_tabs_menu_modules/demo.htm
- http://www.w3.org/TR/wai-aria-practices/#menu
- http://www.w3.org/TR/wai-aria/roles
- http://www-03.ibm.com/able/resources/wai_aria_intro.html