5WAI-ARIA技术: WAI-ARIA(Web Accessibility Initiative-Accessible Rich Internet Applications)指无障碍网页应用技术,又称可访问性,它的主要目的是让各种不同能力水平、具有各种缺陷的用户都能够无障碍地访问网页上的动态内容,相同地获取网站信息,并使用网站中的各种功能。网站的可访问性一直以来受到了社会的极大关注。2006年,联合国颁布了《联合国伤残人士权利公约》,鼓励包括互联网信息提供商在内的大众媒体向残疾人提供无障碍服务。作为网站设计人员,要为这部分特殊用户提供各种信息资讯和业务服务,就必须注重页面的可访问性。首先要申明的一点是aria并非是一种元素,而是HTML中的一系列属性,它的作用是对页面标签内容及其行为的解释。如图所示通过代码我们能够知道ul和li是一个页面的菜单及菜单项,同时能够通过设置样式来使得它看上去像一个菜单,但是特殊人群可能并不能做到这一点。
6要确保页面的可访问性,我们可以给每一个节点加上相应的role属性,其中,menubar表示菜单栏,menuitem表示菜单项。这样,特殊人群在使用辅助设备时(如屏幕阅读器),就能够辨别出这些节点对应的功能。1、不同的菜单有着不同的处理方法,有的菜单在单击或者鼠标滑过时可能出现浮动元素,这样的情况我们也需要在页面中用 aria-haspopup属性加以注明,当没有浮动元素时为false,反之为true。2、此外,之前的表单也可以通过添加aria属性来增强可访问性。例如,给姓名输入框添加aria-label属性,使得残障用户tab切换到这一输入框时,读屏软件能读出相应的文本。3、当说明文本已经在其他元素中存在时,可以通过设置 aria-labelledby属性为该元素的id值,使得焦点跳转到该区域时也能读出相应的内容。