WCAG 2.0 - 为相同资源组合相邻图像和低对比度文本链接

Question

我正在设计一个网站，我想在不同颜色的背景上使用白色文字。不幸的是，这些背景中的2个不能提供足够的对比度以符合WCAG 2.0 AA。

该文字是“阅读更多”链接。

我的问题是 - 如果链接有标题属性，这会使文本可访问，因此WCAG AA会投诉吗？

除此之外，还会有一个小的V形图像，标签中附有alt标签，这种冗余是否有利于AA合规性？

谢谢！

Answer 1

听起来你有两个问题：

1. Colour contrast背景文字。
2. Not describing links。

不幸的是，由于某些用户无法访问信息（例如使用键盘但可以看到屏幕的人），因此无法依靠标题来传达信息。

对比度问题有一些潜在的调整：

• 在文字所在的部分对图像应用效果（例如淡化为黑色）。
• 将效果应用于文本，例如增加对比度的阴影。
• 为不同图像上的文字选择不同的颜色。

否则您会遇到必须提供样式切换器或个性化选项以增强对比度的情况（假设您想要符合WCAG2-AA）。

我无法确定链接是否没有描述他们的目标，就好像它们上面有一个标题可以提供上下文。但是，“阅读更多”链接确实会敲响警钟。

如果V形图像具有特定于目标页面的alt文本，那将有所帮助。例如：

<a href="#"><img src="file.gif" alt="Specific page title ">Read more</a>

注意：由于替代文字的读取方式与内嵌文字类似，因此请在末尾添加空格。

或者如果订单是相反的：

<a href="#">Read more<img src="file.gif" alt=" about specific page title "></a>

总的来说，如果你的盒子有一个描述目标页面的标题，我会把它作为一个链接并使用一个脚本来使盒子的其余部分可以点击。 （例如，http://ukwindsurfing.com/上的中央框）