在问到here关于WCAG对比度要求的问题后,我试图找出解决WCAG指南和我正在设计的产品的企业标识指南之间冲突的最佳解决方案。
在整个产品的UI中,品牌的原色主要应用于按钮。浅色文字与品牌原色的组合导致对比度不足。为了获得足够的对比度,我试着调暗按钮标签的文本颜色或按钮的背景颜色(见附件截图)。然而,由于各种原因,改变品牌的颜色不是一个可接受的解决方案。
除了在按钮标签上使用深色文本之外,我如何才能在不修改品牌原色的情况下获得足够的对比度?
发布于 2019-07-26 21:46:02
如果不更改背景颜色或使用较暗的文本,则无法获得足够的AA级对比度。
为了找到良好的匹配颜色,您必须将颜色转换为HSL颜色空间,而不是RGB。然后保存色调和饱和度,您可以更改亮度和测试颜色。
这样你就可以找到像#0F7FAD这样的颜色,它将与你的初始颜色相匹配,只是稍微暗一点。
发布于 2019-08-07 02:14:03
我与你感同身受,我曾多次努力尝试同时满足A11Y指南和设计语言/品牌指南。这不是一场容易或很快就能赢得的战斗,但我为你们努力使网络更具包容性而鼓掌!
在过去,我的团队进一步推动对话的一个选项是允许最终用户选择他们需要或希望使用的网站版本。
他们想要高对比度的样式吗?
在中构建一个选项来替换样式表-并以不同的方法应用品牌颜色。
适用于主题区域的其他问题:
您的用户是否需要放大或宽大间距的文本大小?
那么放大的UI元素呢?
一组色盲样式表怎么样?
TLDR: UI通常不是万能的,所以请考虑以点菜的方式定制可访问性产品。让消费者选择他们需要的东西!
希望这对我有所帮助,让我知道它的进展!
https://stackoverflow.com/questions/57182581
复制相似问题