J2.01.1large-text contrast threshold设计研究

阈值随字号与字重放宽

别名: 大文本对比度 · 大号文字阈值 · WCAG large text

概念解释

同一块灰字,12 px 的说明可能不达标,24 px 且加粗的标题却可以过。文本对比度的下限不是一条固定的「够不够黑」,而是随字号与字重放宽:常规文本要更高的亮度对比,大文本(常见口径约 18 pt 常规或 14 pt 加粗,落到屏幕上大约 24 px / 18.5 px)可以落到更低的比值。例外不是「标题更重要所以要求更松」,而是字母在视网膜上的空间频率变低之后,分辨笔画所需的明度差变小。图标、边框、控件轮廓不走这套放宽。

机制

对比敏感度函数(contrast sensitivity function)对中高空间频率更苛刻:笔画细、字形小,就落在需要更大明度差才能把笔画从背景里分开的区间。字号增大,等效空间频率下降;字重加大,笔画变厚,同样把能量推向更低频。所以放宽必须同时看尺寸和字重——16 px medium 的「标题」并不是大文本,14 px bold 在部分口径里才刚进门槛。

判定用的是渲染出来的视觉大小,不是样式表里的角色名。用户把系统字号调大之后,原来的常规文本可能变成大文本;画板上的 pt 到浏览器默认 16 px 根字号上要对一次。中文笔画更密,同样 px 不宜只因「块面看起来大」就按大文本放宽。

怎么研究

在实际渲染像素上取样测对比,而不是读稿上的色号。把同一段文案做成字号×字重矩阵,兼测朗读速度与认字正确率。WCAG 2.x 的亮度比值仍是合规常用尺;APCA 按字号字重连续建模,适合做研究对照,拿它替代比值去做达标声明会和多数法规口径错开。

自变量:字号、字重、前景与背景的亮度对比。 因变量:对比比值、朗读速度、漏读或误读率、被判定为大文本的样式比例。

抽查时把「看起来像标题」和「像素上够大」分开登记,避免角色名冒充尺寸。

边界

放宽只作用于文本。大按钮上的细线图标不能借用大文本阈值。更高符合级别对常规与大文本各有更严下限。占位符、禁用态、页脚法律小字仍按其实际尺寸走,不能因为「不是正文」而漏检。用户自定义字体和缩放会改变分类;投影、过远观看会让屏幕上的大文本重新变小。

怎么落地

  • 先给每档文字做「常规 / 大文本」分类:量渲染像素与字重,不要按标题或正文角色自动放宽。
  • 常规文本按更高下限配色;只有真正跨过字号或加粗门槛的才用较松下限。
  • 同一颜色不要既当 12 px 说明、又当 24 px 标题还自认为都过了——过的只是够大的那一档。
  • 验证:列出字号字重表,标出哪些够格当大文本;其余用对比检查器对渲染色取值。把系统字号开大,再看分类有没有翻面。

延伸

  • 同组J2.01.2 半透明文本需按实际合成色计算 · J2.01.3 图片与渐变背景上的文本需保底措施
  • 相邻J2.10 非文本对比度 · J2.15 深色与高对比模式的兼容
  • 站内检索large text · contrast ratio · contrast sensitivity function

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/J2.01.1