基于WCAG 2.0的高校门户网站可访问性研究

刘 欢， 吴旻瑜， 陈建香， 刘 畅， 卢蓓蓉

（1.华东师范大学 信息化办公室，上海 200062；2.华东师范大学 教育学部，上海 200062）

0 研究背景

随着互联网的高速发展，校园门户网站的建设越来越受到高校的重视.一方面，门户网站作为高校对外宣传和自我展示的窗口，是新媒体时代高校发挥网络的传播力和影响力，塑造大学形象的重要渠道；另一方面，门户网站集成了大量信息资讯和业务功能，也是高校面向教师、学生等用户提供各种校园信息服务的重要平台.提升校园门户网站的质量，有助于高校同时提升对外宣传和对内服务水平，更好地推进教学和科研工作，并转化为学校的软实力.受此驱动，近年来高校中出现了网站改版的热潮，大批学校陆续启动了门户网站的升级改版工作，部分高校的新版门户网站已经使用了HTML5、响应式设计等新型技术［1］，国内高校门户网站的整体水平得到了显著提升.

在推动门户网站升级改版的同时，也需要密切关注衡量网站质量的各种指标，以使得网站不仅在外观视觉效果上有所优化，而且在站点内在质量方面也能够得到有效提升.其中，站点的可访问性就是一项重要的网站质量衡量指标.可访问性（Accessibility）是指网站的设计须确保所有用户均可相同地获取网站信息，并使用网站中的各种功能.也就是说，门户网站不仅要面向普通人群，还需要面向各种不同能力水平、具有各种缺陷的用户，这些用户可能包括盲人和低视患者、聋人和重听人、学习障碍、认知障碍、行动不便、言语残疾、光过敏患者和这些病症的复合患者等［2］.

网站的可访问性一直以来受到了社会的极大关注.英国政府于1995年颁布了反伤残歧视法案（DDA，Disability Discrimination Act），在法案中明确规定不得因伤残人士的残疾而使他们无法获得和使用包括信息服务在内的各种服务［3］；英国伤残权利委员会和英国标准学会继而于2006年提出了PAS 78网站可访问性标准，要求网站遵循DDA法案的规定，使网站对残疾人士可访问和可使用［4］；2006年，联合国颁布了《联合国伤残人士权利公约》（UN Convention on the Rights of Persons with Disabilities），鼓励包括互联网信息提供商在内的大众媒体向残疾人提供无障碍服务［5］.为使网站内容更容易访问，特别是更易为广大残疾人士所接受，国际互联网联盟（W3C）分别于1999年和2008年公布了 WCAG1.0和WCAG2.0两份Web内容无障碍指南，针对网站的可访问性提供了一系列标准和建议［6］.时至今日，世界上大多数为公众提供服务的政府、商业、教育等领域的重要网站都遵循了WCAG2.0标准.

目前，中国有超过8 500万残疾人口，其中包括视力残疾1 263万人，听力残疾2 054万人，肢体残疾2 472万人，多重残疾1 386万人［7］.教育部统计数据显示，目前特殊教育学校在校残疾学生为37.88万人，在300多所高校中都有在读的残疾学生［8］.高校门户网站要为这部分已有的或潜在的特殊用户提供各种信息资讯和业务服务，使其能够更方便地访问网站内容，顺利地使用各种服务，就必须尤其注重门户网站的可访问性，使门户网站尽可能符合WCAG2.0所公布的各项可访问性标准.

基于WCAG的量化标准，一些学者已针对不同领域的门户网站开展了研究.在公共服务领域，Shi于2004年使用Bobby软件对324个中国的政府类门户网站的可访问性现状展开调查，发现没有一个政府网站能够通过所有WCAG1.0的A级检测，而这可能导致许多残疾人无法使用这些站点提供的公共服务功能［9］.Kuzma于2008年使用Truwex软件对130个英国下议院议员网站进行可用性检测，发现有23%的站点符合WCAG1.0标准，只有5%的站点通过WCAG2.0的A级检测，但没有一个网站能够通过WCAG2.0的AA级检测，其中绝大多数网站都存在非常相似的错误［10］.李广建等人于2011年使用AChecker对北京等6个城市的政府网站展开可访问性调查，发现所有政府网站的首页均没有通过WCAG2.0的A级检测，各城市网站的可访问性错误主要集中在某一种或两种类型上［11］.在教育领域，Klein等人使用Bobby软件对美国爱荷华州157所高中的网站进行了检测，仅有7.6%的网站通过了WCAG1.0的A级检测［12］.Bradbard等人调查了58所接受政府赠地而开办的美国高校，其中高达86%的高校制订了网站的可访问性政策［13］，然而Harper等人于2007年使用Bobby软件对12所美国高校门户网站的可访问性调查发现，仅有50%的网站通过了WCAG1.0的A级检测，通过AA和AAA级检测的网站仅为8%［14］.Zaphiris等人使用Bobby软件对2001年美国排名前55的高校网站进行可访问性检测，发现仅有30%的高校通过了WCAG1.0的A级检测［15］.Kane等人于2007年使用Bobby、Cynthia、FAE和WebInSight等4种软件对100个世界顶级高校的门户网站进行了可访问性检测，其中36%的高校通过了WCAG1.0的A级检测，仅有2%的高校通过了AA和AAA级检测［16］.袁红于2009年使用AIS软件对12所江苏省高校的可访问性研究发现，所有网站均未能通过WCAG1.0的A级检测，且该省大多数211高校与一般高校相比并未表现出网站可访问性方面的任何优势［17］.

对于国内高校门户网站的可访问性现状而言，目前只有一些零散的、区域性的研究，还鲜有更大范围、较大规模、且针对各种不同层次高校的调查研究.本研究随机抽取了60所国内高校门户网站展开可访问性调查，通过对比WCAG2.0的各项标准，试图通过数据分析研究以下问题：

（1）当前高校门户网站是否普遍注重了站点的可访问性？

（2）当前高校门户网站存在哪些可访问性问题？

（3）不同层次高校的门户网站的可访问性是否存在差异？

（4）高校应如何更好提升门户网站的可访问性？

1 研究方法

1.1 研究样本

为了探究当前中国高校门户网站可访问性的一般水平，同时对各种不同层次高校进行对比，本研究采用了教育部公布的2013年具有普通高等学历教育招生资格的高等学校名单［18］，其中包括了879所普通本科院校，1 266所普通高职（专科）院校和287所独立学院，为了区分不同办学水平的普通本科院校，本研究又将普通本科院校进一步划分为“985”工程院校、“211”工程院校、各省重点本科院校和各省普通本科院校等四种层次.随后，将学校列表随机化排序，从新的序列中依次按6种不同层次的高校进行抽取，每类高校选取列表中的前10所，将其门户网站作为研究样本，如表1所示.经该方式抽取的样本高校分布于东中西部不同省份，其门户网站的设计风格不一，一些网站刚刚经历改版，使用了较新的前端技术制作开发，而一些网站的现有版本则已运行了较长时间，仍然使用表格定位等传统技术模式.我们认为这些研究样本基本上能够代表目前中国高等院校门户网站的一般水平.

表1 研究样本的高校类型Tab.1 College types of research samples

1.2 衡量指标

本研究采用WCAG2.0标准来作为高校门户网站可访问性水平的衡量指标.WCAG 2.0提出了 Web无障碍访问的四个原则（Principles）：可感知性（Perceivable）、可操作性（Operable）、易理解性（Understandable）和健壮性（Robust）.每一个原则又细分为多个准则（Guidelines），总计为12项，如表2所示.

表2 WCAG 2.0指南准则Tab.2 Principles and guidelines of WCAG2.0

WCAG2.0的每一个准则又包含了多个可用于一致性测试的标准（Success Criteria，也译作成功标准），这些标准按照一致性从低到高共被划分为A、AA、AAA三个级别，如表3所示.在每一个标准中，还提供了足够达到标准的技巧和建议性技巧（Sufficient and Advisory Techniques）［2］.当前，在一些重要的政府、公益、商业网站中往往采用AA级标准，而高校门户网站可以适当降低该标准.在此，本研究采用了最基础的A级标准作为可访问性衡量指标.

表3 WCAG 2.0一致性测试的3个级别Tab.3 Levels of conformance of WCAG2.0

1.3 数据采集

常见的网站可访问性评测工具有Theoretical、Bobby、WAVE、Taw、WebXACT、AChecker等［19］.本研究采用了AChecker作为站点可访问性的评测工具.该工具提供了 WCAG1.0、WCAG2.0、BITV1.0、Section508、Stanca Act等不同标准的检测支持，用户能够通过输入网址、输入页面HTML代码以及上传HTML文件等3种形式来检测站点的可访问性［20］.检测的结果包括站点的总错误数、问题检查点及问题检查点对应的标准，并给出了自动的修正建议.本研究在AChecker工具中所选择的检测标准为WCAG2.0（Level A）.

本研究于2014年6月27日至6月28日期间完成了所有60所高校门户网站的可访问性评测.由于首页往往是整个门户网站中最具代表性的页面，因此本研究所评测的页面均为门户网站首页.

1.4 数据分析

本研究的数据分析工具为SPSS 20.0.

2 研究结果

2.1 高校门户网站可访问性概况

数据表明，在60个高校门户网站中，没有任何一个网站通过了所有的可访问性检查点检测，如表4所示.其中错误数最少的网站含有8处错误，平均每个网站的错误数为48.48，80%的网站错误数超过了20处.此外，平均每个网站违反了4.92项标准，涉及8.47个问题检查点.由该数据可以推断，当前高校门户网站的可访问性现状并不理想，绝大部分网站都缺乏对可访问性的关注，以致于在网站中普遍出现了较多的相应错误.

表4 高校门户网站可访问性概况（n＝60）Tab.4 Overview of accessibility in college portal websites（n＝60）

2.2 不同层次高校门户网站的可访问性差异

比较不同层次学校的门户网站错误数，其中“985”工程院校的错误数均值最小，为23.5，平均违反4.6项标准，涉及7.1个问题检查点，独立学院及民办本科院校和高职专科院校的错误数均值最大，分别为66.7和62.1，平均违反4.4和5.2项标准，涉及8.8和8.5个问题检查点，如表5所示.然而方差分析显示，不同层次学校的门户网站的可访问性错误数不存在显著差异（F（5，54）＝2.356，P＝0.052＞0.05），这表明不同层次的高校对于门户网站访问性的关注程度差异并不大.此外，不同层次学校的门户网站违反的标准数及问题检查点数也均不存在显著差异（F（5，54）＝0.633，P＝0.675＞0.05；F（5，54）＝0.573，P＝0.720＞0.05）.

2.3 高校门户网站的可访问性问题分析

WCAG2.0的A级检测共涉及了25项标准，而本研究的数据表明，60个高校门户网站共违反了其中的12项标准，占比为48%.错误数最多的标准为“为所有非文本内容提供替代文本”，为1 616项，占错误总数的55.55%，其次为“所有功能都能够通过键盘接口实现操作”，为761项，占错误总数的26.16%.站均超过一项错误数的标准还有“呈现的信息、结构和关系可被程序识别，或可用文本表达”、“确定网页的默认语言”、“在用户输入内容时给出标签或说明”和“每个链接的目的均可由其文本确定，或通过可编程的上下文与链接文本共同确定”等，其余标准的错误数均相对较少，如表6所示.

表5 不同高校门户网站可访问性错误数（n＝60）Tab.5 Errors of website accessibility in different levels of colleges（n＝60）

表6 高校门户网站的错误数分布（n＝60）Tab.6 Error distribution of website accessibility（n＝60）

比较不同层次高校门户网站在各项标准下的错误数分布，如表7所示.在站均超过一项错误数的标准中，3.1.1（SD＝1.521）和3.3.2（SD＝3.83）两项标准的分化最小，表示各层次高校门户网站均普遍忽视“确定网页的默认语言”和“在用户输入内容时给出标签或说明”.1.1.1（SD＝129.80）和2.1.1（SD＝66.04）两项标准的分化最大，其中在遵循“为所有非文本内容提供替代文本”这一标准方面，“985”工程院校及各省普通本科院校的错误数最少，独立学院及民办本科院校和高职专科院校的错误数最多；在遵循“所有功能都能够通过键盘接口实现操作”这一标准方面，“985”工程院校的错误数最少，各省普通本科院校的错误数最多.

表7 不同层次高校门户网站在各标准下的错误数分布Tab.7 Error distribution of website accessibility in different levels of colleges

进一步分析错误数对应的检查点，其分布如图1所示.在所有60个门户网站中，有57个网站未通过检查点1、检查点49，有55个网站未通过检查点48，分别占样本总数的95.0%、95.0%和91.7%，这意味着只有很少量的高校门户网站关注了这3个检查点对应的可访问性问题.其余出现问题频率较高的检查点为188、107、106、213、57、91，分别有70.0%、61.7%、51.7%、51.7%、48.3%和41.7%的站点未通过这些检查点.以上检查点的问题描述如表8所示.

图1 高校门户网站未通过的检查点分布图（n＝60）Fig.1 Failed checkpoints distribution of website accessibility（n＝60）

表8 错误数较多检查点的问题描述Tab.8 Description of main checkpoint errors

将错误数和问题检查点数据进行归类排序，可得到当前高校门户网站中存在的最重要的四类可访问性问题，依次为：①图片未添加描述文字；②未正确定义文档语言；③表单项label标签缺失；④键盘控制缺失.

不同层次高校门户网站未通过以上四个主要检查点的数量分布如表9所示.数据表明，不管是国内顶尖的“985”、“211”工程院校，还是大众认为办学水平不如前者的独立学院、高职专科院校，在这四类可访问性问题上表现均不佳.因此，抛去学校层次方面的差异，这四类问题值得当前所有国内高校投以关注.

3 结 论

3.1 高校门户网站的可访问性现状

数据表明，所有参与评测的网站都或多或少地存在着可访问性问题，没有一个网站通过了所有的WCAG2.0的A级评测.其中，平均每个网站违反了4.92项标准，涉及8.47个问题检查点，并含有48.48处错误.虽然“985”工程院校门户网站的可访问性错误数少于其余高等院校，独立学院及民办本科院校和高职专科院校的可访问性错误数多于其余高等院校，然而各种不同层次高校门户网站的可访问性错误数、违反标准数及问题检查点数均不存在显著差异，在主要的检查点检测方面“985”、“211”工程院校的门户网站并未显露任何优势.由数据可以推断，当前高校门户网站的整体可访问性现状并不理想，各种层次的高校都并没有对门户网站可访问性投入足够的关注.

在60个门户网站中，绝大部分门户网站都未能通过“＜img＞元素缺少alt属性”、“文档含有不合法的语言代码”和“未定义文档语言”等可访问性检查点.81.71%的可访问性错误都集中于“为所有非文本内容提供替代文本”和“所有功能都能够通过键盘接口实现操作”两项标准，错误点的集中度较高.最突出的四类可访问性问题依次为“图片未添加描述文字”、“未正确定义文档语言”、“表单项label标签缺失”和“键盘控制缺失”.

表9 不同层次高校门户网站未通过的主要检查点数量Tab.9 Number of failed checkpoints of website accessibility in different levels of colleges

3.2 高校门户网站的可访问性问题分析

（1）为图片添加描述文字

在研究样本中，绝大部分高校门户网站都忽略了为图片添加描述文字，即在＜img＞元素中添加alt属性.alt属性能够包含对图片的简短描述，有助于使无法准确看到该图片的用户使用该信息.这些文字描述可以很方便地由屏幕阅读器朗读出来，也可以被放大或缩小，还可以方便地改变其对比度，或者进行其他的变形操作.例如，可使用＜img alt＝“登录”＞来为处理登录功能的按钮图片添加描述.当图片无法正常加载时，文字描述也仍然可以被显示，以告知浏览者图片的内容.

（2）定义文档语言

90%以上的研究样本都存在“文档含有不合法的语言代码”和“未定义文档语言”两类错误.要解决这一问题，只需要为HTML文件正确添加lang属性即可.lang属性需要符合ISO－639－1制订的语言代码规范，它能够使Web浏览器获知该页面的内容是用哪种语言写的，并有助于使一些包含不同语言的语音Web应用程序正确发音.比如，要标注某一段落的文字为法文，则可使用类似＜p lang＝“fr”＞的属性代码.此外，对于XHTML页面而言，除了添加lang属性外，还需要正确添加xmllang属性.

（3）在表单中运用label标签

要提高网页中表单的可访问性，就必须注重label标签的使用.label标签能够为表单中的各种元素提供标注.用户使用鼠标点击label标签中的文本时，能够触发该标签对应的控件，使浏览器的焦点转移到该控件上.当有视觉障碍的浏览者使用屏幕阅读器访问表单时，能够收听到label标签中的提示内容，这样就能极大方便他们的使用.我们可以使用含有for属性并在该属性中指定对应表单项id的＜label＞标签来实现显式的label标注.此外，除使用label元素外，也可以通过使用ARIA的aria－labelledby属性，将表单字段和文本标记进行关联.

（4）添加键盘控制

确保网站可访问性的一大原则是使得所有的功能都能够通过键盘来操作.而事实上，我们往往习惯于通过鼠标来使用网页中的各种功能，忽视了使用键盘的用户的感受.对于弱视用户来说，使用键盘和访问键（accesskey）的快捷方式来定位Web站点会更加容易.除了添加accesskey属性外，还可以通过设置tabindex来使用户能够更加便利地通过键盘使用网页中的各种功能.

3.3 展望

近年来，高校门户网站的建设水平普遍有了较大提升，然而在确保用户的人性化使用方面还有所欠缺，站点的可访问性现状普遍并不理想.要改变高校门户网站的可访问性现状，一方面需要高校管理部门关注特殊人群的网站使用感受，更加重视门户网站的可访问性设计，另一方面则需要前端设计者充分了解可访问性的各种原则，尤其是了解WCAG2.0的各种可访问性指标，在设计中加以严格遵守.事实上，只要各个高校纠正了门户网站中最主要的两类可访问性问题，就能够避免80%以上的相关错误.在此我们呼吁高校强烈关注门户网站的可访问性问题，积极制订措施以提升网站的可访问性水平.

［1］ 刘欢，卢蓓蓉.使用响应式设计构建高校新型门户网站［J］.中国教育信息化：高职教育，2013（5）：71－74.

［2］ WORLD WIDE WEB CONSORTIUM.Web content accessibility guidelines（WCAG）2.0［EB／OL］.（2008－12－11）［2015－04－17］.http：／／travesia.mcu.es／portalnb／jspui／bitstream／10421／2546／1／WCAG＿2.pdf.

［3］ SLOAN M.Web accessibility and the DDA［J］.The journal of information，law and technology（JILT），2001（2）：1－2.

［4］ KELLY B，SLOAN D，BROWN S，et al.Accessibility 2.0：People，policies and processes［C］／／Proceedings of the 2007international cross－disciplinary conference on Web accessibility（W4A）ACM，2007：138－147.

［5］ HENDRICKS A.UN Convention on the rights of persons with disabilities［J］.Eur J Health L，2007，14：273.

［6］ ANDI SNOW－WEAVER.WCAG2.0版与1.0版的比较［J］.互联网天地，2006（S1）：20.

［7］ 赵燕潮.中国残联发布我国最新残疾人口数据［J］.残疾人研究，2012（1）：11.

［8］ 赵婀娜.我国七成残疾少儿“有学上”［N］.人民日报.2013－07－14（004）.

［9］ SHI Y.The accessibility of Chinese local government web sites：An exploratory study［J］.Government Information Quarterly，2007，24（2）：377－403.

［10］ KUZMA，JOANNE M.Accessibility design issues with UK e－government sites［J］.Government Information Quarterly，2010，27（2）：141－146.

［11］ 李广建，王巍巍，杨林，等.基于 WCAG2.0政府网站可访问性评价研究［J］.中国图书馆学报，2011，37（6）：27－36.

［12］ KLEIN D，MYHILL W，HANSEN L，et al.Electronic doors to education：Study of high school website accessibility in Iowa［J］.Behavioral sciences ＆the law，2003，21（1）：27－49.

［13］ BRADBARD D A，PETERS C，CANEVA Y.Web accessibility policies at land－grant universities［J］.The Internet and Higher Education，2010，13（4）：258－266.

［14］ HARPER K A，DEWATERS J.A quest for website accessibility in higher education institutions［J］.The Internet and Higher Education，2008，11（3）：160－164.

［15］ ZAPHIRIS P，ELLIS R D.Website usability and content accessibility of the top USA universities［C］／／Proceedings WebNet，2001：1380－1385.

［16］ KANE S K，SHULMAN J A，SHOCKLEY T J，et al.A web accessibility report card for top international university web sites［C］／／Proceedings of the 2007 international cross－disciplinary conference on Web accessibility（W4A）ACM，2007：148－156.

［17］ 袁红.基于信息构建的高校门户网站外部用户可用性测评——以江苏省高校为例［J］.图书情报工作，2009，（23）：77－80.

［18］ 中华人民共和国教育部.2013年具有普通高等学历教育招生资格的高等学校名单［EB／OL］.［2014－09－01］.http：／／www.moe.gov.cn／publicfiles／business／htmlfiles／moe／moe＿634／201305／151636.html.

［19］ CENTENO V L，KLOOS C D，FISTEUS J A，et al.Web accessibility evaluation tools：A survey and some improvements［J］.Electronic Notes in Theoretical Computer Science，2006，157（2）：87－100.

［20］ ACHECKER.Web accessibility checker［EB／OL］.［2014－09－01］.http：／／achecker.ca／checker／index.php.