跳至主要内容
短.be

二维码无障碍设计

确保视障人士、老年人等所有用户都能顺利使用二维码的设计考量。包括文本替代方案、色彩对比度和尺寸规范。

2026 年 8 月 25 日 / 约 1 分钟阅读

QR 码

二维码的无障碍性,是指为了让视觉障碍、色觉多样性、运动功能障碍、因高龄导致视力下降等处于各种状况的用户都能毫无问题地使用二维码,而在设计上做出的考量。

二维码本质上是依赖视觉的技术,因此确保无障碍性需要一些巧思。最基本的做法是在二维码附近同时用文字标出相同的链接地址。屏幕阅读器无法从二维码图片中读出内容,因此旁边有没有并列标注文字形式的 URL,会直接影响用户能否访问目标页面。如果并列标注短链接,手动输入也会更容易。

对色觉多样性的考量也很重要。据称约 5% 的日本男性 (约 300 万人) 具有色觉多样性。把二维码彩色化时,需要避开红与绿的组合,做成依靠明暗对比也能读取的设计。WCAG 2.1 中 4.5:1 这一数值针对的是文本的基准(1.4.3),与二维码这类非文本图形对应的是要求 3:1 的 1.4.11;不过考虑到扫描的余量,以 4.5:1 以上为目标更为稳妥。

二维码的尺寸也是重要的无障碍要因。高龄者和视力较弱的用户,有时很难把智能手机的摄像头准确对准二维码。所需的尺寸会随读取距离和摄像头性能而变化,印刷物上可以先以 3cm 四方左右为参考,并同时留出周围的留白 (静默区)。

在网页上刊登二维码图片时,最佳做法是在 alt 文本中设置「通往某某页面的链接二维码」这样的说明,并在二维码下方再放置一个文字链接。在印刷物上,把短链接用较大的字体标注在二维码旁边,就能为无法读取二维码的用户也提供访问同一信息的手段。

这篇文章对您有帮助吗?

相关术语

QR 码

一种二维条形码,可以存储 URL、文本等信息,通过智能手机摄像头扫描读取。

QR 码设计

在保持可扫描性的前提下,对 QR 码的外观进行品牌化定制的设计实践。

彩色二维码

自定义前景色或背景色的二维码。可以融入品牌配色方案,但必须确保足够的对比度以保证扫描成功率。

二维码最小尺寸

二维码能被正确扫描的最小印刷尺寸。由数据量、印刷质量和扫描距离共同决定。

QR 码印刷

将 QR 码复制到纸张、薄膜、金属、织物等物理介质的印刷工艺与质量管控。分辨率、对比度、静区、材质特性四大要素决定实际扫描成功率。

二维码 WCAG 合规

将 WCAG(Web Content Accessibility Guidelines)的标准应用于二维码的放置 / 替代文本 / 颜色对比度的无障碍设计。

相关文章

短链接无障碍设计指南 - 屏幕阅读器适配、链接文本与 WCAG 合规

解说短链接对视觉障碍者、老年人、认知障碍用户的影响。介绍屏幕阅读器的 URL 朗读问题、符合 WCAG 标准的链接文本设计方法。

QR 码入门 - 从零开始轻松了解原理、扫码方法和制作方式

通俗讲解 QR 码是什么、它和传统条形码有什么区别、里面可以存储哪些类型的信息、怎么用手机扫码读取,以及如何自己动手免费制作 QR 码。还介绍了短链接与 QR 码的组合技巧,以及在学校文化节海报上的实际应用案例,是一篇面向初学者的入门指南。

二维码与短链接的组合 - 从线下到线上的引流设计

从技术角度解说二维码版本与数据容量的关系。包含按网址长度比较二维码尺寸数据的实践指南。

常见问题

无法使用二维码的用户应如何应对?
在二维码旁边以文本形式标注相同的短链接。印刷品中使用较大字号,网页中则放置普通超链接。二维码只是便捷手段之一,不应成为唯一的访问途径。
如何设计适合色觉多样性用户的二维码配色?
黑白单色最为安全。如需彩色设计,应避免红绿搭配,选择深蓝与白、黑与浅黄等明暗差异大的组合。关键在于确保仅凭明暗对比即可正常识别。
网页中的二维码图片需要设置 alt 文本吗?
必须设置。建议使用"前往 XX 页面的二维码链接"等描述性 alt 文本,并在附近放置指向相同目标的文本链接,这是最佳实践。

把知识用到真实链接上

免费缩短网址