小型企业网站无障碍（WCAG）：这到底是什么，您真的需要吗

马来西亚的企业主越来越常在网页设计提案、招标文件，或是关于包容性设计的 LinkedIn 帖子中，遇到"网站无障碍"或"WCAG"这样的说法，却始终没能得到一个真正说清楚两件事的答案：这到底涉及什么内容，一个普通的小型企业网站真的需要为此操心吗？诚实的答案介于两种常见极端说法之间。无障碍并不是只适用于政府门户网站的一个含糊的合规选项，但它也并非每个小型企业都必须一丝不苟地按照某项技术标准去追求的东西。本文将说明 WCAG 到底是什么、哪些人能从中受益、如何检查自己的网站，以及不论法律是否要求，都值得去做的一份实用清单。

"网站无障碍"和 WCAG 到底是什么意思

"网站无障碍"简单来说，就是把网站做成让存在视觉、行动、听力或认知差异的人也能真正使用——不是另外做一个特殊版本，而是让同一个网站能服务更多人。WCAG 全称 Web Content Accessibility Guidelines（网页内容无障碍指南），由万维网联盟（W3C）发布，这也是制定 HTML 和 CSS 标准的同一机构。几乎所有的无障碍法规、审核工具，以及"如何让我的网站变得无障碍"之类的文章，最终都会回到这份指南。

WCAG 分为三个合规等级——A、AA 和 AAA——一级比一级严格。A 级是最低要求；AA 级是大多数法律、采购规定和行业指南在实践中用来判断"无障碍"的标准；AAA 级是最严格的层级，即便是法律上必须合规的网站，也很少被要求完全达到这一级。这些等级之下，还有四项指导原则，常被记为 POUR：内容应当是可感知（Perceivable）、可操作（Operable）、可理解（Understandable）和健壮（Robust）的，无论访客用什么设备或方式访问。

WCAG 合规等级一览

究竟哪些人会遇到这些障碍

人们很容易把"无障碍"想象成只服务于一小群、离自己很远的用户。但实际上，它涵盖的情况比想象中更广泛、也更贴近日常生活。屏幕阅读器会为失明或视力低下的人朗读页面内容，但前提是图片有真正的替代文字、按钮有真正的标签。行动不便或手部颤抖的人，可能完全依靠键盘导航，从一个链接跳到下一个链接，全程都不使用鼠标。色盲访客无法仅凭颜色区分错误提示和确认信息，或是区分链接和普通文字。有认知差异的人，则受益于版面可预测、标题真正说明后续内容的页面。

这些情况都不罕见，也不是极端个案。世界卫生组织估计，全球大约每 6 人中就有 1 人——约占全球人口的 16%——存在显著的残障，而这个数字还没算上每个人迟早都会遇到的情境性限制：阳光下手机屏幕反光看不清、手臂骨折让人几周内无法用鼠标，或是在嘈杂的咖啡店里不得不把声音关掉。对一家小型企业来说，这不是一个抽象的合规统计数字，而是原本就在网上寻找这家企业的客户中，实实在在的一部分。

即使没有法律要求，为什么仍然值得去做

在许多市场，政府和公共部门网站被法律要求符合 WCAG 标准，一些司法辖区也在逐步把类似规定扩展到某些受监管的私营企业。目前马来西亚绝大多数普通小型企业网站并不在这类强制要求之内——所以真正值得去做的理由，并不是"法律这么规定"。有三个理由无论如何都站得住脚。

• 覆盖面。任何受众群体中，都有相当一部分人存在某种访问需求，无论是永久性还是暂时性的。一个难以阅读、难以用键盘操作，或屏幕阅读器根本无法使用的网站，会在悄无声息中赶走那些本来已经准备好购买或咨询的客户。
• 更干净的 HTML，更好的可抓取性。无障碍所要求的那些做法——描述性替代文字、每个段落有一个合乎逻辑的标题、正确加标签的表单字段、能说明去向的链接文字——恰好也是搜索引擎和 AI 驱动的问答引擎用来理解页面内容的同一批信号。无障碍的标记语言，和结构清晰、对 SEO 友好的标记语言，实际上在很大程度上是同一回事。
• 这本来就是良好的实践。下面这份入门清单里的每一项，做起来都不算特殊，也不算昂贵。它和一个加载迅速的页面、一个能正常提交的联系表单属于同一类基础工作——不起眼、相对于收益而言成本很低，也正是这类细节，区分了一个专业建成的网站和一个随便拼凑的网站。

无障碍与 SEO 的重叠，比大多数老板想象的要多

上面第二点值得多说一句，因为它会改变无障碍工作该如何列入预算。搜索引擎看不见照片——它读的是替代文字。它无法单凭字号大小猜出页面内容——它读的是标题结构。它也无法推断表单字段想要什么——它读的是标签。这些每一项同时也是无障碍方面的改进。实际上，一家为基础页面 SEO 付费的企业，往往已经在为相当一部分无障碍工作付费了，不管有没有人这么称呼它。把两者当作报价单上分开的两个项目，常常意味着为重叠的工作多付了一次钱。

大多数小型企业网站都应具备的实用入门清单

完整的 WCAG 合规是一个相当深入的技术课题。但对一个普通企业网站来说，其中大部分实际效益，来自任何网站负责人或开发者都能在没有专门审核的情况下落实的五个习惯：

• 描述性的图片替代文字。每张有实际意义的图片，都需要一段能清楚说明它展示了什么或起什么作用的替代文字——而不是像"img_4021.jpg"这样的文件名，也不是堆砌关键词的字符串。纯粹装饰性的图片应当被标记，让屏幕阅读器直接跳过，而不是读出一堆没有意义的噪音。
• 足够的色彩对比度。正文文字需要与背景有足够的对比度才能看清楚——深灰色或黑色文字配浅色背景，比浅灰色文字配白色背景更可靠。颜色不应成为传达重要信息的唯一方式，例如仅用红色标记必填字段而没有任何其他提示。
• 带正确标签的表单。每个输入框都需要一个真正、可见的 <label> 与之关联——而不是仅靠一开始打字就消失的占位文字。错误提示应当清楚说明哪里出了问题、该如何修正，而不是仅仅把字段变成红色。
• 完整的键盘导航。按 Tab 键应当能按合理顺序，依次移动到链接、按钮和表单字段，每一步都有清晰可见的焦点框，并且网站上不应有任何功能只能用鼠标操作——仅靠悬停触发的菜单和仅靠拖拽完成的交互，都会让只用键盘的用户卡住。
• 清晰的标题结构。一个 H1 说明这个页面是什么，其后的 H2、H3 按顺序嵌套，而不是跳级使用，也不是单纯因为字号大小而选定层级。清晰的标题大纲，能让屏幕阅读器用户直接跳到需要的部分——对随手浏览页面的普通访客同样有帮助，包括首页本身，而首页恰恰是最值得优先做对的地方。

关于如何从一开始就把首页的结构和信息说清楚，可以参考我们的指南《如何写出能转化的首页，而不只是好看》——清晰的标题和合乎逻辑的版面，无论是否涉及无障碍，都能帮助到每一位访客。

如何在一个下午内测试自己的网站

• 拔掉鼠标。尝试只用 Tab 键和 Enter 键，到达每一个链接、按钮和表单字段。任何卡住的地方，都是键盘导航的缺口。
• 打开一个免费的屏幕阅读器。Windows 的 Narrator、macOS 的 VoiceOver，或是免费的浏览器扩展，会完全按照盲人访客听到的方式朗读页面——缺失的替代文字和没有标签的按钮会立刻暴露出来。
• 用免费的对比度检查工具跑一遍页面。把文字和背景颜色粘贴进任意一个在线 WCAG 对比度检查工具，几秒钟内就能标出不合格的组合。
• 眯眼看首页，或者切换成灰度模式。如果有任何重要信息只靠颜色来传达——比如没有文字标注的红色星号，或者除颜色外没有其他区别的绿色与灰色按钮——它就会消失不见。
• 单独读一遍标题大纲。按顺序列出页面上从 H1 到 H4 的所有标题；如果它作为一份独立的页面大纲都讲不通，对屏幕阅读器用户来说同样讲不通。

入门清单与完整 WCAG 合规对比

完整的 WCAG AA/AAA 合规到底涉及什么——谁才真正需要它

从入门清单迈向经过审核的完整 WCAG AA 或 AAA 合规，是一项实实在在更深入的工作，绝非周末就能搞定的小修小补。它通常需要用 ARIA 属性，为下拉菜单、标签页、滑块、弹窗等每一个自定义交互元素做程序化标注，让辅助技术能理解它们的作用；为视频添加字幕和音频描述；在多种屏幕阅读器和输入设备上分别测试，而不只是测一种；发布一份正式的无障碍声明；并且每当网站有实质性改动，就要重新进行审核。

这种严谨程度，在特定情境下确实必要：政府或公共部门网站、所处行业或市场存在具有法律约束力的无障碍要求的企业，或是受众本身就以残障群体为主的机构。对于绝大多数没有这些特定驱动因素的小型企业网站来说，一丝不苟地追求完整的 AA 或 AAA 合规，相对于上面那份清单之外能带来的边际收益而言，是不成比例的投入——而那份清单本身，已经涵盖了大部分实际的改善效果。

常见错误

• 替代文字留空，或堆满关键词。两种做法对屏幕阅读器用户来说都不合格——一种什么也没给，另一种读出一堆没意义的噪音。
• 用占位文字代替真正的表单标签。一旦开始打字它就会消失，不会留下任何关于这个字段用途的提示。
• 只用颜色标记必填字段或错误提示。色盲访客看不出来，屏幕阅读器也读不出来。
• 做成仅靠悬停触发的菜单，或仅靠拖拽完成的交互。两者都会让只用键盘的访客完全卡住。
• 按字号大小选择标题层级，而不是按实际层级。这会破坏屏幕阅读器用来浏览页面所依赖的大纲结构。
• 把完整的 WCAG AA/AAA 合规当成非此即彼的事。大多数网站光靠五项入门清单，就已经获得了大部分实际效益。

Gotka Technologies 在其中扮演的角色

无障碍的基础工作，不需要另外单独添加。图片替代文字——上面五项入门清单中的一项——已经是 Gotka 每个网站设计套餐（Starter 起价 RM5,300，Business 起价 RM9,800，Growth 起价 RM14,300）标配、不额外收费的一部分，与基础 SEO（元标题和描述、XML 网站地图）、移动端响应式设计、网页速度优化、带防垃圾信息保护的联系表单、WhatsApp 一键聊天按钮以及 SSL 一起提供。这些都不会被单独列为"无障碍附加项"收费——它们本来就是从一开始把网站做规范的一部分。Gotka 目前并不单独提供完整的 WCAG AA 或 AAA 合规审核服务。

正在规划新网站或网站改版、并想知道无障碍基础工作在整体预算中处于什么位置的企业主，可以参考我们的指南《马来西亚建一个网站要多少钱？》，了解通常涉及哪些内容。

本指南中用到的关键术语

• WCAG：Web Content Accessibility Guidelines，W3C 制定的网站无障碍国际标准。
• 替代文字：对图片内容的简短文字说明，由屏幕阅读器在图片位置朗读出来。
• 屏幕阅读器：把页面内容朗读出来，或转换成盲文，供失明或视力低下用户使用的软件。
• 色彩对比度：文字与背景之间的亮度差异，以比值衡量可读性。
• ARIA 属性：添加到自定义交互元素上的额外标注，让辅助技术能理解它们的作用。
• 合规等级：WCAG 用来评估网站符合指南程度的 A、AA 或 AAA 分级。
• 无障碍声明：公开发布的文档，说明网站的无障碍合规情况及已知的不足之处。