什么是无障碍网页设计？规范和检测要点

1、无障碍网页设计是什么? (符合标准的标记语言)

无障碍网页设计目的主要是将网页内容调整为适合给视觉障碍人士阅读的网页，除了满足特殊的弱势族群于视觉、听觉障碍人士之外也改善了各大浏览器的显示正确性，并且大幅改善使用键盘操作阅读网页的能力，可让网页的操作更加的友善化(尤其对于视觉障碍者)。

无障碍网页设计规范办法是W3C协会之.WAI组织所订定无障碍网页内容标准相关规范，并且参照台湾无障碍网络空间的相关政策及目标，配合国内在身心障碍者保护等相关措施，由行政院研考会所订定的「无障碍网页开发规范」。其中包含.无障碍十四条规范以及.无障碍九十条的检测要点，这些要点并可归类为三加一个等级，显示网站无障碍空间的影响程度。鼓励政府机关及民间网站发展出障碍者可使用的网站。

2、转换无障碍网页的好处有哪些 (网页浏览无障碍)

- 运用国际规范将网页设计成为视障人士更容易取得的网页数据。
- 符合国际标准的网页设计，可以让更多网页浏览器可顺利阅读数据。
- 更有善化键盘使用操作，让使用者可以使用键盘替代鼠标点阅网页。
- 可符合国际的网页标准，提升网站的国际形象及内容的可及性。
- 对于搜寻引擎查寻结果会有更好的索引内容支持。
- 对于未来的网页技术发展有更好的兼容性。

无障碍十四条规范

规范一：对于听觉及视觉的内容要提供相等的替代文字内容
网页开发者在网页中遇到非文字的听觉或视觉内容时，如果能同时提供同等内容的替代文字，将可使听觉障碍或视觉障碍者能够无碍地浏览和获取这些信息内容。

视觉的内容包括图像、图表、动画等，而听觉的内容则包括音乐、语言和各种音讯。本规范所指的同等内容是指能描述视觉或听觉内容的一段文字叙述。譬如一个连接到下一页的向右箭头的图像，「下一页」是适当的替代性文字；譬如一个烟火的动画，「有烟火声效的烟火场景动画」，则是适当的替代视觉与听觉的内容。

这些替代文字在网页中所带给我们的方便性与好处是因为语音合成器与点字显示器等技术的成熟。网页信息可藉由这两项技术，让非文字内容得以让视觉障碍者用听的或触摸的方式了解其信息内容；对于一些有阅读困难的人（经常伴随着认知障碍、学习障碍、和耳聋）的人来说，要了解这些非文字的内容，可经由语音合成器来朗读替代文字，将有极重要的帮助；替代文字的显示不但可以符合听障者的需求，对于非身心障碍的一般网页浏览者也是有额外的帮助。 

规范二：不要单独靠色彩来提供特殊信息
对许多人而言，颜色本身有它的内涵，譬如我们习惯用红色来表示重要的信息，但是在非彩色屏幕环境下或对颜色辨识能力有障碍的人而言，原本颜色所传达的讯息可能会散失或受损，网页内容的传达将达不到可及性要求。譬如 当前景和背景 在色泽上太接近时，有的人可能无法分辨；譬如不同物品的叙述用不同颜色来代表时，有的色盲者可能也无法分辨。

规范三：适当地使用标记语言和样式窗体
在一般的网页标记语言中，标记有分作结构标记（ structural markup ）与呈现标记（ presentation markup ）两种，两者在内涵上意义完全不同，在呈现效果上也有不同。 例如表格卷标、窗体卷标、标题卷标、段落卷标等都是 结构标记；粗体字 标签 、斜体字 标签 、换行 卷标、保留文字编排卷标等都是呈现标记 。网页设计者使用标记语言时，须严格遵守此标记的原本设计的目的，以避免身心障碍者在浏览网页时所使用的特殊软件解读这些标记时产生误解。 例 如非表格信息使用 表格卷标 来产生呈现编排效果、如使用 标题卷标 来产生大字体的效果、如使用 保留文字编排卷标 来产生类似表格的编排呈现效果，都是一些常见的错误使用范例。 

规范四：阐明自然语言的使用
本条规范所指的自然语言是指中文、英文、日文或韩文等语言。网页设计者应该在文件里标示自然语言使用的变化，以方便语音合成器和点字输出机来处理，以自动地将其转换成新的语言，让不同语言的使用者能顺利读取这份文件。网页设计者也应该定义文件内容的主要自然语言；遇到缩写和简称，应提供进一步的说明，以免造成语音合成机或点字输出机的误判解读。而且这些自然语言的标记可以让搜寻引擎藉由这些标记来精确找出具有关键词的相关文件。对学习障碍、认知障碍、或听觉障碍者而言，自然语言标记也改进了网页的可读性。 

规范五：建立编排良好的表格
表格是网页信息的一种特殊数据架构，其包括的行、列、和数据格都有特别的信息涵义，因此浏览器在碰到网页的表格卷标时，都提供可以适当呈现表格的相关功能。但是许多人在网页开发时，表格呈现在各行和各列的整齐划一特性让许多人非常喜欢用来做网页信息的呈现排版功能。如此使用对于一般浏览器使用者而言，并不会造成任何问题，而且网页呈现也整齐美观。但是这种处理方式对于使用 屏幕阅读机或点字显示器等各种特殊输出装置的视障人士而言，非表格结构的信息以表格 卷标来处理时， 网页内容会被切割成顺序错乱且无法理解的信息。

因此 网页开发者应该避免使用表格卷标做单纯排版功能。在使用表格来呈现信息时，应该确实设计表格应有结构，表格的行和列以及表格本身应该利用适当卷标来标明行标题、列标题、以及表格标题。 

规范六：确保网页能在新科技下良好地呈现
因特网的技术日新月异，网页开发者往往在 设计网页时， 会使用 新科技来强化其网页运作功能，因而忽略掉使用旧浏览器来处理信息的人士可能发生的种种问题。因此 网页开发者应该要确认在较新的科技不支持或关掉的时候，网页仍然具有可及性，仍然可以让使用者处理网页内的信息。 

规范七：确保使用者能处理时间敏感内容的改变
在网页信息中所谓时间敏感内容是指网页显示的信息可能会以可移动、闪烁、或 滚动条等方式来 呈现或自动更新信息内容。因为 某些有 认知障碍、神经疾病人士在 阅读快速移动的文字或 闪烁的 图形会造成其注意力分散或者身体不适的现象；视觉障碍者所使用 的屏幕阅读机的功能可能 无法阅读 滚动条文字； 肢体障碍者可能因为只能做小区域的操作，而不能和移动中的信息内容做互动操作。为了顾及以上人士使用网页的需求，网页开发者应该小心使用这些 时间敏感内容的操作设计，要确定浏览器所提供的控制机制可让身心障碍人士处理这些信息，否则就应该考虑提供这些数据对象或网页的替代方案。 

规范八：确保嵌入式使用者接口具有直接可及性
网页在设计使用者接口的操作时，必须确认其是否遵循了可及性设计的原则，亦即使用者接口的功能和操作使用是否有考虑到网页使用者可能无法使用鼠标操作，因此网页的使用者接口的操作设计应该具有键盘可操作化、或者可自行发声等特性。

当一个网页内的嵌入式对象拥有它的自有的接口时，这接口 必须是具有可及性的设计。假如 嵌入对象的接口无法做到可及性设计，就必须提供一个可及性的替代解决方案。 

规范九：设计装置独立网页
装置独立网页 所代表的意思是指网页使用者可以使用他 们 偏爱的输入（或输出）装置 — 如鼠标、键盘、声音输入、头杖、或者其它输入 装置 ─ 来和其使用的浏览器互动 。 举例来说，如果一个网页内输入功能的控制只能以鼠标或其它的点选设备来启动，那么对那些无法使用一般浏览器而必须以声音输入、或者以键盘或其它非点选设备来使用网页的人而言，将会无法使用这个网页。

网页开发者在 使用影像地图或当成连结使用的影像时，所使用的替代文字说明部份，可以让使用者在不必使用 鼠标等 点选设备就能与他们互动。此部份的说明也可参考规范 一。 

规范十：使用过渡的解决方案
本条规范所指的 「 过渡的 」是指网页语言内有新技术出现时，可能因为厂商发展的浏览器所实作的功能还不完备，无法充分提供可及性考虑时，网页开发者在使用此新技术时，应该额外设计和提供 可及性的解决方案，使运用辅助科技和较旧版的浏览器仍能正确的操作。 举例来说， 较旧版的浏览器不允许 使用者浏览至空的编辑对话框 ( empty edit boxes) 。 较老旧的屏幕阅读器在阅读连续的一串连结时，会将其视为只有一个连结。这些网页内功能强大的主动组件因而变成存取困难或根本无法存取。同样地，网页内的超级链接操作产生改变现有的窗口或突然出现新窗口的动作时，对于无法看到这些状况的使用者来说，也可能会是非常迷惑的。

这些 过渡的可及性的解决方案，并非是永久需要，可能在 厂商发展的新版浏览器所实作的功能完备时，即可提供新技术在订定发展之时所规划的可及性功能。因此一旦网页科技已经合并了预期的特性或能力，可能 这些 检测码在未来就不是必要的。 

规范十一：使用国际与国内官方订定的技术和规范
网页开发者在设计网页时，应该尽量使用广泛被采用的 国际与国内官方订定的技术和规范，避免使用单一厂商开发的特殊网页技术。因为许多国际订定的技术和规范会考虑技术的开放性和各系统的互通性，而且也往往有比较多的可及性考虑。例如 W3C协会订定的相关语言和技术在设计阶段即与相关企业一起考虑可及性的问题。若目前使用这些语言和技术仍无法提供足够的可及性功能，也比较能够提供替代的可及性方案。

目前网页技术还有许多非 W3C协会订定的格式（如：PDF、Shockwave等等）需要以外挂程序或其它的应用软件来观看。这些格式经常不能以标准的 浏览器以及其它现有的各种辅助科技来观看或浏览。避免使用非 W3C和非标准化特性的网页信息组件（包括专属组件和特殊属性）将使网页更能适应使用各种类型的软硬件和使用者。而且在碰到必须使用不可及的技术和替代方案时，也比较容易设计出符合可及性的替代网页。

网页开发者应该注意到，在做文件格式的转换时，例如，从 PDF、 PostScript 、 RTF等格式 转换成为 W3C的标记语言（譬如HTML、XML等）并不保证一定能做出一份可及的文件。因此，在转换手续之后必须验证每个网页的可及性和可用性。假如网页未能完全转换时，就应该要持续改进该网页以尽量接近它原本的表现方式，或者是另外提供一个HTML或普通文字版本的网页。
 

规范十二：提供内容导引信息
网页在处理内容导引信息之时，应提供上下文 (context)和定向(orientation)信息来帮助使用者了解复杂的网页架构或相关组件。把组件分组和提供有关组件之间的脉络关系对所有使用者都是有用的。网页开发者应该要注意到一个网站内网页各部分之间的复杂关系，对于有认知障碍的和有视觉障碍的人要做解读可能会相当困难的。因此应该要考虑他们的困难，提供详细的内容导引信息。

规范十三：提供清楚的浏览网站机制
一个网站具有清楚和一致的浏览机制对于认知障碍或视觉障碍者是非常重要的。这种规划考虑不仅可让身心障碍者获益，而且可让所有使用者在使用网站信息时不会迷失。因此网页开发者可以规划各种 引导 信息、浏览棒、网站地图等等，以提供清楚和一致的浏览机制 。如此可 增进使用者在网站上快速而精确地找到特定信息。 

规范十四：确保简单清楚的网页内容
网页开发者应确认文件的内容和用词是清楚和简易的，让使用者可以更容易地理解网页内容。使用清楚和简易的语言可促进有效的沟通。对认知或学习障碍的人而言读取或理解正式或官方用词的文字书面信息，可能是困难的。使用清楚和简易的语言也可使那些母语与你不同的人受益，这包括那些主要以手语沟通的人。 因此网页开发者应该采用一致性的网页版面、可明了辨识的图表、和容易了解的语言和用词，这将让所有的使用者受益，特别是对认知障碍和阅读困难的人有帮助。然而，仍然应该要确认网页内的各个图像应拥有替代文字说明以提供给全盲、弱视或任何无法观看图片的人来使用。相关说明可 参考规范一。

无障碍九十条的检测要点

规范一：对于听觉及视觉的内容要提供相等的替代文字内容
1.1：图片需要加上替代文字说明
1.2：对于applet提供替代文字说明
1.3：对于object提供替代文字说明
1.4：对于窗体中的图形按键提供替代文字说明
1.5：影像地图区域需要加上替代文字说明
1.6：当影像地图使用为上传按钮时，每一作用区域必须分别使用不同的按钮
1.7：当alt属性的文字陈述大于150个英文字符时，考虑另外提供文字叙述
1.8：提供longdesc以外的描述性超级链接(如D超级链接)，来描述longdesc的内容
1.9：图形替代文字陈述不够清晰时，提供文字描述(如使用longdesc属性)
1.10：所有语音档案必须有文字旁白
1.11：以可及性的影像来替代ASCII文字艺术
1.12：视讯中的声音必须提供同步文字型态的旁白
1.13：服务器端影像地图中的超级链接必须在网页中有额外对应的文字超级链接
1.14：多媒体视觉影像呈现时，必须提供听觉说明
1.15：多媒体呈现时，必须同步产生相对应替代的语音或文字说明
1.16：客户端影像地图中的超级链接必须在网页中有额外对应的可及性超级链接

规范二：不要单独靠色彩来提供特殊信息
2.1：确保所有藉由颜色所传达出来的讯息，在没有颜色后仍然能够传达出来
2.2：确保前景颜色与背景颜色彼此呈现明显的对比

规范三：适当地使用标记语言和样式窗体
3.1：以实际存在的标记语言(如MathML)呈现网页内容(如数学方程式)，避免使用图形
3.2：确定网页设计文件，有效使用正规的HTML语法
3.3：在doctype标签中，使用标准规范的叙述以识别HTML版本类型
3.4：尽可能使用样式窗体控制网页排版与内容的呈现
3.5：要使用相对尺寸(如%)而非绝对尺寸(如像素)
3.6：适当使用巢状标题呈现文件结构
3.7：避免使用header标签来产生粗体字效果
3.8：项目符号及编号之卷标(如li、ul)仅可使用于实际网页内容的项目条列，不可用
3.9：确保q和blockquote标签只是用来当引用语而不是用来缩排
3.10：以q及blockquote卷标来标记引用语

规范四：阐明自然语言的使用
4.1：明确地指出网页内容中语言的转换
4.2：用abbr及acronym卷标表示网页中呈现的文字缩写与简称
4.3：明确指出网页文字所使用的自然语言

规范五：建立编排良好的表格
5.1：对于每一个存放数据的表格（不是用来排版），标示出行和列的标题
5.2：表格中超过二行/列以上的标题，须以结构化确认彼此间的结构与关系
5.3：在网页内容呈现设计时，避免以表格做多栏文字的设计
5.4：若表格只做为版面配置时，勿使用表格之结构标记(如th卷标)作为网页格式视觉效果
5.5：表格须提供表格摘要说明(如summary属性)
5.6：数据表格须提供标题说明
5.7：表格行列过长的标题，须提供缩写或简称

规范六：确保网页能在新科技下良好地呈现
6.1：使用 CSS 样式表编排的文件需确保在除去样式表后仍然能够阅读
6.2：页框连结必须是HTML档案
6.3：使用Script语言需指定不支持Script时的办法
6.4：若网页内的程序对象没有作用时，确保网页内容仍然可以传达
6.5：若网页对象使用事件驱动时，确定勿仅使用鼠标操作
6.6：使用页框时要指定不支持页框时的办法

规范七：确保使用者能处理时间敏感内容的改变
7.1：确保网页设计不会致使屏幕快速闪烁
7.2：避免使用blink卷标闪烁屏幕
7.3：避免使用marquee卷标移动文字
7.4：避免使用动态gif图片
7.5：不要让网页每隔一段时间自动更新
7.6：不要自动转移网页的网址

规范八：确保嵌入式使用者接口具有直接可及性
8.1：对由Scripts、Applets及Objects所产生之信息，提供可及性替代方式

规范九：设计装置独立网页
9.1：尽量使用客户端影像地图替代服务器端影像地图连结
9.2：对所有网页内容元素，确保有鼠标以外的操作接口
9.3：确保事件的启发不要求一定得使用鼠标
9.4：具体指出按下Tab键在窗体控件，超级链接及对象间移动的顺序
9.5：对经常使用的超级链接，增加快速键的操作
9.6：对于窗体组件考虑提供键盘快速键的操作

规范十：使用过渡的解决方案
10.1：除非使用者知道将会开启一个新窗口，不要随便开启一个新窗口
10.2：如果使用Script语言开启新窗口或改变目前窗口的网址，要让使用者能事先知道
10.3：确保窗体的控件与控件说明之间的配合很适当
10.4：若有以表格直栏格式呈现的网页文字内容时，提供线性文字替代
10.5：在网页文字输入区中须有默认值
10.6：勿单以空白间隔分开相连之超级链接

规范十一：使用国际与国内官方订定的技术和规范
11.1：如果你不能使这个网页无障碍化，提供另一个相等的无障碍网页
11.2：尽量使用开放性的最新国际标准规范
11.3：避免使用过时的HTML语法
11.4：允许使用者依照个人喜好设定网页呈现方式与内容

规范十二：提供内容导引信息
12.1：需要定义每个页框的名称
12.2：如果页框名称无法描述页框中的内容的话，应加上额外叙述
12.3：把太长的选单项目群组起来
12.4：在窗体控件中，使用fieldset及legend标签作群组间的区隔
12.5：尽可能将网页内容有相关之元素聚集在一起
12.6：在窗体控件上，以label卷标提示信息

规范十三：提供清楚的浏览网站机制
13.1：设计并确保有意义的超级链接说明，便于网页内容的阅读
13.2：如果需要的话，为每个超级链接加上内容描述
13.3：指向不同网址的超级链接，不可使用相同的超级链接说明
13.4：使用metadata卷标来记载计算机可以了解运用的网页信息
13.5：为你的网页加上标题
13.6：为你的网站提供网站地图或整体性的简介
13.7：网页设计使用清楚且一致的导览机制
13.8：提供网页导览连结工具列，以利存取网站导览结构
13.9：能辨别出意义上有群组相关的超级链接
13.10：若有群组超级链接，在群组之前增设一项绕过此区域的超级链接
13.11：若网站具有搜寻功能，可以设计不同的网页内容搜寻方式，以提供不同技能与喜好者搜寻选用
13.12：在网页标题、段落、及列表之前，提供辨别讯息以利识别
13.13：以metadata标签来识别网页文件包含于整体文件内的所在位置
13.14：避免在网页上使用ACSII文字艺术

规范十四：确保简单清楚的网页内容
14.1：网页内容要使用简单易懂的文字
14.2：使用可及性的图形促进网页内容的理解
14.3：网页彼此间设计呈现的风格要一致