D1.07.2Disabled-state contrast设计研究
低对比禁用态可能低于可读阈
别名: low contrast · disabled contrast · legibility · unavailable control
概念解释
禁用态对比(disabled-state contrast)是不可用控件仍须让人读清其标签、理解其存在和辨认其状态的一组视觉条件。设计常用降低不透明度或把文字变浅来表达禁用,但若对比低到文本、图标或边界融进背景,用户得到的不是「暂不可用」,而是「这里没有东西」或「我看不清它」。禁用的语义是限制操作,不是抹除信息。
机制
低饱和、低对比的灰色易被当作背景,且小字、细图标、强光、低质量屏幕、放大和视觉疲劳会进一步压低可辨性。用户必须先看见控件,才能把外观差异解释为不可用,并根据原因寻找补救;看不清时,焦点和指针探索也无法建立完整的操作地图。把「弱化」直接等同于「降低文字可读性」混淆了两个信号:视觉优先级可以降低,但状态、名称与理由仍需可感知。
怎么研究
在实际背景、主题、亮度、缩放和强制颜色设置下,测试用户能否发现禁用控件、读出标签、区分禁用与缺失,并解释能否以及如何恢复。将灰度、色觉模拟和截图检查作为早期筛查,随后用真实设备的查找和修复任务测量发现率、阅读错误和重试行为。不要只测色值:透明度叠加、图片背景、父级 opacity 与浏览器渲染会使最终对比不同于设计变量。
边界
禁用控件无需与主要操作具有相同强调度;若所有状态都同样醒目,禁用的层级意义会消失。可读也不意味着让不可用元素看起来仍可点击:应结合形态、指针行为和原因线索表达限制。对确实不该出现在当前情境的功能,隐藏可能比保留低对比残影更合适;但一旦选择展示,便承担其文本和状态可被理解的责任。
怎么落地
- 分别检查禁用态的文字、图标、边界与原因提示的最终渲染对比,不以原始色值或 opacity 代替实测。
- 使用可读文字与清晰的非色彩状态线索降低优先级;不要把唯一的名称或补救路径一起淡出。
- 在深浅主题、图片容器、强光设备和高缩放下做「找出不可用动作并说明原因」测试。
- 将视觉回归门槛覆盖禁用态;任何读不出标签、误以为控件消失或仍尝试激活的版本都需要调整。