跳到内容

State of HTML 2025

无障碍

让所有人都能访问网站和应用程序。

我们重点介绍我们认为您应该了解的有趣特性或库。

特性亮点: <search>

<search> 元素是那些不需要花费太多精力就能添加到最佳实践列表中的简单胜利之一。第 1 步：使用它来表示应用程序中的任何搜索字段。第 2 步：好吧，真的就是这样！

现在所有四个主要浏览器都支持它，真的没有理由不使用它。

基准: 新近可用

了解更多

有用资源

无障碍功能

地标元素（<main>、<nav> 等）虽然不是很新或令人兴奋，但它们仍然是 Web 无障碍的基础。

通过...分组：

根据此项排序:

1
无障碍
地标元素 (Landmark elements)
96.7%
4,383
2
无障碍
88.2%
8%
4,381
3
无障碍
29.3%
29.1%
41.2%
4,377
4
无障碍
13%
22.5%
64.3%
4,378

经验

  • <span aria-hidden="true">🤓</span> 用过: 使用过此项目的受访者。
  • <span aria-hidden="true">👀</span> 有听说过: 听说过此项目，但没有使用过此项目的受访者。
  • <span aria-hidden="true">🤷</span> 没听说过: 从未听说过此项目的受访者。

情绪（态度）

  • 积极: 有兴趣了解此技术，或者愿意再次使用它的受访者
  • 中立: 未对此技术发表看法的受访者
  • 消极: 对此技术不感兴趣，或者使用此技术有糟糕体验的受访者
“已使用”平均值:57%
“积极”平均值:37%
“消极”平均值:2%

其他无障碍技术

虽然像 alt 文本或正确的标题层次结构这样的事情已经成为大多数前端开发人员的第二天性，但像 prefers- 媒体查询集这样的新工具尚未真正成为主流。
在您的常规无障碍策略中，还有哪些其他技巧？
多选
0%
20%
40%
60%
80%
100%
01
描述性 alt 文本
3,647
02
信息层次结构
3,452
03
表单控制标签
3,331
04
有意义的链接文本
+1
2,827
05
足够的对比度
+1
2,778
06
可视焦点环
+1
2,725
07
直观的键盘导航
-3
2,454
08
<fieldset> 和 <legend>
+2
2,250
09
不只依赖指针
2,194
10
不仅仅依赖颜色
-2
2,192
0%
20%
40%
60%
80%
100%
受访者百分比
4,124
66%
10

用户残疾情况

很高兴看到，除了考虑到视力障碍用户外，与去年相比，更多的开发人员也考虑到了非典型色觉和行动障碍。
在制作网站时，您会考虑到哪些用户残疾问题？
多选
0%
20%
40%
60%
80%
100%
1
低视力
2,724
2
色觉异常
2,163
3
行动障碍
1,387
4
前庭失调
920
5
听力障碍
687
6
学习障碍
677
7
无
665
8
其他认知障碍
600
9
其他答案
52
0%
20%
40%
60%
80%
100%
受访者百分比
3,727
60%
10

屏幕阅读器

像 VoiceOver 或 Chrome DevTools 这样易于访问的工具再次战胜了更专业的选项。尽管许多开发人员仍然不使用任何类型的屏幕阅读器（还要注意，39% 的调查受访者完全跳过了这个问题）。
您使用哪种屏幕阅读器进行无障碍性测试？
多选
0%
20%
40%
60%
80%
100%
01
VoiceOver
+1
1,376
02
无
1,358
03
Chrome DevTools
-1
1,306
04
NVDA
742
05
JAWS
414
06
WAVE
366
07
TalkBack
216
08
Narrator
199
09
Orca
137
10
Chromevox
88
11
Firefox Accessibility Inspector
12
其他答案
51
0%
20%
40%
60%
80%
100%
受访者百分比
3,784
61%
10

无障碍工具

与去年的结果相比，浏览器开发工具的使用率大幅跃升，超过 Lighthouse 成为领先的无障碍测试工具。
您使用什么工具进行无障碍性测试？
多选
0%
20%
40%
60%
80%
100%
01
Browser Devtools
+1
2,259
02
Lighthouse
-1
1,983
03
Axe
1,145
04
Firefox Accessibility Inspector
1,033
05
无
-1
717
06
WAVE
+1
648
07
-1
544
08
Accessibility Insights
523
09
Pa11y
+1
188
10
Arc
-1
167
0%
20%
40%
60%
80%
100%
受访者百分比
3,860
62%
10

无障碍痛点

虽然在无障碍方面存在技术差距（例如跨根 ARIA），但每当我们询问它时，一个反复出现的主题是，主要痛点围绕着人，涉及工作场所优先级、教育和认知开销的问题位居榜首。
在网络无障碍方面，您最大的痛点是什么？
多选
总体上最主要的痛点主题。

视图:

不为“limitations”之一的项目
0%
20%
40%
60%
80%
100%
01
Education
3
02
workplace
1
03
Cognitive overload
2
04
Debugging
1
05
Environments & Consumers
06
Screen reader issues
2
07
ARIA
1
08
Browser support
1
09
Low priority
-7
10
Tooling
2
11
Excessive complexity
-2
12
Keyboard navigation
13
Standards & Specs
1
14
Focus management
-3
15
16
Missing elements
17
Ecosystem issues
18
Content
1
19
Accessible visual design
20
Reliance on JavaScript
21
Access to screen readers
+3
22
Component-Based Architecture
23
Invalid/Spam
24
CSS Integration
25
26
其他答案
0%
20%
40%
60%
80%
100%
受访者百分比
606
10%
25
5

资源推荐

Website Accessibility, v3
Jon Kuperman
Bloomberg

Website Accessibility, v3

Build content for everyone and become your company's accessibility expert! Learn the importance of semantic HTML and alt text for ensuring screen readers can navigate your site.
感谢合作伙伴对我们的支持! 了解更多。