企业官网无障碍改造怎么做？从法规要求到 58 项指标的完整落地清单

先看两个具体场景。一位 60 多岁的客户想在你的官网上查一台设备的参数，他把浏览器缩放调到 200%，结果导航栏挤成一团、按钮跑到了屏幕外；另一位用户视力有障碍，他用手机自带的读屏软件访问，一路顺畅，却在”提交询价”那一步卡住了——因为验证码是一张图片，读屏软件念不出来。

这两个人，原本都是你的潜在客户。

关于这件事的规模，有两组公开数据值得记住：我国约有 8500 万残疾人；截至 2025 年底，全国 60 岁及以上老年人口达 3.2 亿，占总人口的 23%。把这两组数字放在一起看，”无障碍”就不是一个小众议题了——它关系到四分之一以上的中国人在网上能不能顺利办事。

对企业更有现实意义的是：这件事已经从”公益加分项”变成了有明确法律和国家标准依据的交付要求。这篇文章把法规原文、标准指标和可以直接执行的改造清单放在一起，方便你对照自家官网逐条检查。

一、法规与标准：企业官网的无障碍，已有明确依据

1. 法律层面：《中华人民共和国无障碍环境建设法》

2023 年 6 月 28 日，十四届全国人大常委会第三次会议表决通过《中华人民共和国无障碍环境建设法》，由国家主席令第六号发布，自 2023 年 9 月 1 日起施行。这是我国首次就无障碍环境建设制定的专门性法律，全文共 8 章 72 条。

它的章节结构是：总则、无障碍设施建设、无障碍信息交流、无障碍社会服务、保障措施、监督管理、法律责任、附则。请留意第三章——”无障碍信息交流”是独立成章的。网站、小程序、移动应用都属于信息交流的载体，正落在这一章覆盖的范围里。

法律同时把保障重点明确为残疾人、老年人，并特别强调”无障碍环境建设应当与适老化改造相结合”。”适老化”这三个字对企业官网意味着什么，后文会展开讲。

2. 标准层面：GB/T 37668-2019，互联网信息无障碍领域的第一个国标

法律给的是原则，具体做到什么程度算合格，要看国家标准。

GB/T 37668-2019《信息技术 互联网内容无障碍可访问性技术要求与测试方法》，2019 年 8 月 30 日发布、2020 年 3 月 1 日起实施，是我国互联网信息无障碍领域的第一个国家标准，适用于互联网网页（含移动端网页）和移动应用产品的开发与测试。

这个标准的搭建方式很实用，记住四个词就够了——可感知性、可理解性、可操作性、兼容性。围绕这四大目标，标准提出了 3 个等级、共 58 项具体技术指标，而且每一项指标都配有相应的测试方法。这意味着它不是一句”要方便特殊人群使用”的原则性口号，而是一份可以逐条打勾的检查表。

该标准由全国信息技术标准化技术委员会（SAC/TC 28）归口，浙江大学、中国电子技术标准化研究院、中国残疾人联合会信息中心等 14 家单位共同编制，前后历时 3 年。另外值得注意：标准在 2025 年 7 月的复审结论是”修订”，修订计划已进入批准流程——说明这套要求还在持续演进，早做改造不容易过时。

3. 哪些网站已经在被检查

你可能会想：”这是对政府和公共机构的要求，跟我一个企业官网有什么关系？”

现实是，评估已经在发生。据公开信息，中国电子技术标准化研究院已建立标准符合性测试能力并取得 CNAS 资质认可，对金融服务网站、残联网站、图书馆网站、政府网站等公共服务类网站开展信息无障碍能力等级预测试评估，并提出改进建议。

规律很清楚：公共服务属性越强、面向人群越广的网站，越早被纳入。企业官网虽然不在第一批名单里，但有两个趋势需要提前考虑：一是官网本身就是面向公众的服务入口，性质上属于”信息交流”；二是如果企业有招投标、政府采购或涉外业务，无障碍已经出现在部分采购方的评估项里。

换句话说，现在做这件事成本最低；等被要求了再改造一个老站，代价会高得多。

二、四个维度自查：你的官网卡在哪一步

下面的检查项按国标的四大目标组织。你可以边读边打开自家官网，逐条对照——每一项都很容易验证，不需要专业工具就能发现大部分问题。

可感知性：信息要”能被感知到”

核心要求是：内容不能只依赖某一种感官获取，视力或听力受限的用户要能通过替代方式得到同样的信息。

• 图片要有替代文本（alt）。产品图写”CX-200 立式加工中心正面外观”，而不是”图片1″或干脆留空。装饰性图片则应对应留空，避免读屏软件念出一串无意义的词。
• 视频要有字幕或文字稿。企业宣传片、产品演示视频，至少配一份文字说明。
• 文字与背景的对比度要够。正文文字对比度建议不低于 4.5:1，大号文字不低于 3:1。浅灰色小字是重灾区——在设计稿上很好看，到弱视用户那里等于隐形。
• 颜色不能是唯一的信息载体。“必填项标红”不够，要同时给出文字提示或符号，因为色觉障碍用户可能区分不出红与绿。
• 放大到 200% 不丢内容。页面支持浏览器缩放与双指放大，放大后文字不重叠、按钮不跑出屏幕、不出现横向滚动条。

可理解性：内容要”能被看懂”

• 声明页面语言。网页代码中标注页面语言（如 lang="zh-CN"），读屏软件才能用正确发音朗读；否则会出现”用英文腔调念中文”的情况。
• 全站导航与操作保持一致。同一个功能在不同页面位置不同、叫法不同，会显著增加认知负担，对老年用户尤其不友好。
• 错误提示要具体可执行。表单提交失败时，说清”手机号格式不正确，请填写 11 位数字”，而不是只弹一句”提交失败”。
• 措辞平实。少用未加解释的行业缩写；必须使用时，第一次出现给出中文全称。

可操作性：不用鼠标也能办完事

这一项最容易被忽略，也最容易测试——把鼠标拔掉，只用 Tab 键、方向键和回车走一遍完整流程。

• 所有可点元素都能用键盘访问。导航、按钮、表单、下拉菜单、弹窗关闭按钮，都要能 Tab 到、能触发。
• 焦点样式必须可见。不少网站为”美观”用 CSS 去掉了焦点外框（outline），结果键盘用户完全不知道当前停在哪一格。正确做法是美化它，而不是删除它。
• 提供”跳到主要内容”链接。让键盘用户能跳过顶部导航，直接进入正文。
• 焦点顺序符合视觉顺序。Tab 键走下来的顺序，应与肉眼看到的从上到下、从左到右一致。
• 音视频不要自动大声播放；轮播图要能暂停、能手动切换。快速自动轮播对阅读障碍用户是灾难。
• 点击区域要够大。移动端可点元素建议不小于约 44×44 像素，避免”怎么点都点不中”。
• 避免闪烁内容。每秒 3 次以上的闪烁可能诱发光敏性反应。

兼容性：对辅助技术”友好”

• 使用语义化标签。该用按钮元素的地方不要用普通容器加一个点击事件，该用导航元素的地方不要用普通容器——读屏软件靠标签判断”这是导航还是按钮”。
• 表单控件与标签正确关联。每个输入框都要有能被读屏识别的标签，而不是只靠占位提示（占位提示一输入就消失，且部分读屏软件不朗读）。
• ARIA 属性用来补足语义，不要滥加。用错位置反而会让辅助技术读出错误信息。
• 验证码必须提供替代方案。语音验证码、无障碍替代验证，或改用不依赖视觉的验证方式。这是最常见的”流程阻断点”——一个纯图形验证码，能把整条转化链路掐死。

三、最常见的 12 个问题：一份自查对照表

把国内企业官网的高频问题汇总成下面这张表。优先级一栏按”是否阻断用户完成任务”来定：会阻断的列为高。

实际改造经验是：高优先级那 6 项，往往只用几天就能全部处理完，但它们挡住了绝大多数”完全用不了”的情况。先做这 6 项，投入产出比最高。

四、改造怎么落地：五步走

步骤一：做一次基线评估（约 1–2 天）

不要一上来就改代码。先摸清家底，把问题清单化。

• 自动检测工具先扫一遍。这类工具能发现约三到四成的问题（多为代码层），速度快，适合作为起点。
• 人工走查关键页面。首页、产品列表、产品详情、询价表单、联系我们——这几个页面覆盖了主要转化路径。
• 做一次读屏实测。手机端可用系统自带的读屏功能，Windows 端可用 NVDA 等免费读屏软件，走一遍主要流程，记录卡住的位置。
• 做一次键盘全流程测试。拔掉鼠标，只用键盘完成”找到产品 → 查看详情 → 提交询价”。

步骤二：先修内容层（成本最低、见效最快）

内容层的修复不需要动程序，改的是文案和标注，通常可以在后台直接完成：补图片替代文本、把无意义的链接文字改成具体描述、按层级整理标题、给视频补文字稿。这一层做完，视障用户和搜索引擎同时受益。

步骤三：再修视觉层

调整文字与背景的对比度、适当放大正文字号、加大移动端点击区域、恢复并美化焦点样式、避免只用颜色传递信息。这一步需要设计和前端配合，但改动是局部的。

步骤四：最后修交互与技术层

改用语义化标签、补齐表单标签关联、让弹窗和下拉菜单支持键盘操作、合理使用 ARIA、处理验证码替代方案。这一步的关键是”改模板而不是改页面”——一个列表模板修好，全站同类页面都受益。

步骤五：验收与长期维护

• 改造后用读屏和键盘各回归一次，确认阻断型问题清零；
• 把无障碍检查项写进网站上线检查清单，新页面按同一标准产出；
• 在后台编辑规范里写明”图片必须填替代文本””链接文字要说清去向”，从源头控制；
• 每次大改版（模板级改动）后重新走一遍关键流程。

五、一个常被忽略的事实：无障碍和 SEO 是同一件事

这是本文最想让你记住的一点。无障碍改造和搜索引擎优化，看起来是两个目标，实际上大部分具体动作是重叠的：

原因不复杂：辅助技术和搜索引擎面对的是同一个问题——它们都在”读”你的页面，而不是”看”你的页面。读屏软件读不出来的内容，爬虫往往也读不完整。把网站改得对读屏友好，等于顺手把可抓取性也做了一遍。

所以在预算有限的时候，无障碍改造并不是一件”先放着”的事——它和 SEO 优化共用一份工作量，属于同一笔投入的两种回报。

六、从哪一步开始最划算

分三种情况给建议：

• 如果网站正在开发或即将改版：把无障碍要求写进需求文档和验收清单，成本几乎为零，效果最好。这是最划算的时机。
• 如果是已经上线的老站：先做内容层（替代文本、链接文字、标题层级），这是投入最小、立刻能改善的部分；再做模板层改造，一次修好、全站受益。
• 如果预算很紧：只修”阻断型”问题——表单标签、验证码替代方案、键盘可达性、焦点样式。这四项决定了一个用户”能不能用”，优先级永远最高。

回到开头那两位用户。让老年人把网页放大后还能正常下单，让使用读屏软件的用户能顺利提交询价——这件事的价值不只是”合规”，它等于把你原本正在漏掉的那部分客户，重新接回了转化路径上。

如果你不确定自家官网的无障碍状况，可以先从本文第三节的 12 项对照表开始自查。相关的延伸阅读：企业官网移动端适配怎么做（本文提到的缩放、点击区域问题，在那篇里有更细的移动端处理方式）、企业官网结构化数据怎么配（同样是”让机器读懂你的页面”，两件事配合做效果更好）、以及 企业官网该放什么内容（内容层的组织方式）。需要我们对你的官网做一次无障碍与可抓取性的联合体检，可以通过首页的联系方式找到我们。