accessibility - 没有文字的背景颜色重要吗？

关于色彩对比：

在这个例子中，我是否需要小心蓝色背景，即使它上面没有直接的副本？即，当上面有副本时，我是否只需要关注背景颜色，并且我可以从屏幕阅读器中隐藏具有背景颜色的元素而不会造成问题？
在这一个中，我需要注意浅蓝色背景和按钮之间的对比度还是我只关心副本和按钮之间的对比度？（我知道图像模糊。这只是一个例子。）

标签： accessibilitycontrast

这两个例子都很好。

这里有两件事适用。

首先是文本和该文本的背景之间的对比度 - 正常文本的对比度必须为 4.5:1，大文本/粗体文本的对比度必须为 3:1，才能符合 WCAG AA。在第一个示例中，它基本上是白底黑字，因此很容易通过。

第二个是控制。按钮、输入等的对比度与背景的最小值应为 3:1，无论它们处于何种状态（因此，如果您上面的按钮在悬停时变为白色并带有黑色文本，则可能不会通过）。在您的第二个示例中，您的按钮在浅蓝色上是黑色的，所以它当然也通过了这个。

另外值得注意的是控件（您的按钮）中的文本具有相同的 4.5:1 对比度要求。再次，黑色上的白色很容易通过，所以你很好。

只需检查带有白色文本的红色按钮上的对比度（几乎可以肯定），红色和橙色的对比度可能具有欺骗性（但由于它是一种相当深的红色，我 99% 确定你只是看一下就可以了） .

为清楚起见，第一个中的蓝色背景可能比白色框暗 1%，这很好，因为它不是围绕它的交互式控件。