J2.01.3text on non-uniform background设计研究
图片与渐变背景上的文本需保底措施
别名: 图片上的字 · 渐变对比度 · scrim · 对比度保底
概念解释
对比度是两个颜色之间的关系。照片和渐变是一群颜色。白字压在街景上，半句落在沥青上能过、半句落在白色车身上就过不了。平均对比没有意义，读者会撞上最差的那一块。这种底上的文本需要保底：衬底、实心条、足够厚的遮罩，或把字限制在已经保证过关的区域，而不是指望「整体看起来还行」。
机制
每个字形覆盖不同的底图像素。一行标题穿过云和树，字母各自面对不同的局部亮度。人的阅读是序列的，只要有一段跌破下限，那几个字就会糊。渐变更糟：它保证字符串里总有字母坐在中间带上，两端对比被拉向 1。
保底的作用是把「字与底」重新变成近似两色问题。半透明黑遮罩铺在图上，字再叠在遮罩上——若遮罩本身也透明，仍须按合成色来测，而且要沿整行取样，不能只测遮罩色板。视频和用户上传封面每换一帧/一张图，最差补丁都在变，没有固定色就没有固定比值，只能靠结构手段（衬底始终在）而不是挑一张代表图过关。
怎么研究
沿字符串等距取点，报告最小比值而不是平均。准备最差素材：高光云、白墙、浅色渐变中段、过曝人脸。对比「裸字 / 遮罩 / 实心条」三种处理。
自变量：背景类型（照片、视频帧、线性或径向渐变）、保底方式、取样位置。 因变量：最小比值、低于下限的字形数、无保底时的假通过率。
多数自动工具取一个点或只读覆盖层的 CSS 色，会把渐变中段漏掉。要把页面放到真实封面图和主题切换后再测。
边界
纯色底不需要保底。装饰性水印若本就不打算被读，应改成装饰图而不是低对比正文。大面积实心条会改变版面，但对比优先于「字直接压在英雄图上」的构图习惯。深色模式若只反转文字不换图，原来的深色衬底可能反过来不够。地图、幻灯片里随视口移动的底，保底层必须跟着字走，不能钉在画布一角。
怎么落地
- 把正文从照片和渐变上拿开，或在文字背后加实心条 / 高不透明遮罩，让局部重新变成两色。
- 禁止只靠文字阴影当唯一保底；细光晕在高光区域仍然会断。
- 用户上传封面、轮播、视频上的标题，保底层写进组件，不要依赖编辑选一张「够暗的图」。
- 验证：换成最亮的那张素材截图，沿标题每个词取最亮和最暗的底，最小比值仍要过当前字号那一档下限。关掉遮罩应立刻出现不及格取样点，说明保底在干活，而不是图碰巧够暗。