网站设计的高对比度模式
当我们谈论网站设计可访问性时，我们往往会谈论很多事情——比如暗模式、键盘导航、偏好减少动作和屏幕阅读器——但有一个事情并没有受到太多关注：网站页面的高对比度模式（以后简称WHCM）。这是我在一些网站上看到的一种趋势，我们已经规范了一些可能会损害用户在 WHCM 中体验的做法。在本文中，我想解释它是什么，并给出一套我们可以牢记的好的做法，以使我们的网站在这种模式下更易于使用。
高对比度模式是一种辅助功能，通过将不同元素（如背景、按钮或文本）的颜色替换为某些用户设置的颜色来改变我们网站和 Windows 应用程序的外观。这有多种用途，例如提高可读性、通过删除某些元素来减少网站的视觉噪音（并且通过扩展，让它们有更好的焦点），以及让用户完全控制网站的对比度。您可以通过转到“设置”，然后单击“辅助功能”，最后单击“高对比度”来查看。谈谈一些统计数据，根据Melanie Richard 在她的演讲“量身定制的网络：有效地尊重视觉偏好”中，大约 4% 的活动设备使用 Windows 高对比度模式，并且感谢WebAIM 对低视力用户的调查，我们可以估计大约 30% 的低视力用户使用 Windows 高对比度模式。所有这些都应该让您了解使我们的网站对这种模式友好的重要性。
高对比度模式”这个名称有点误导，因为用户可以选择他们喜欢的颜色，从而导致调色板的对比度比平时低——这并不是一个很奇怪的情况。根据 WebAIM 的调查，大约 3% 的 Windows 高对比度模式用户将其设置为创建低对比度的调色板。我相信您了解使我们的网站与 WHCM 友好的重要性，并且您可能会认为，由于其替换我们大部分样式的性质，制作一个适用于该模式的网站可能很困难。好消息，事实并非如此！我们只需要考虑一些重要的问题，以确保不损害用户体验。
尽管当我们的网站在 WHCM 中显示时我们失去了多少控制权，但只要我们牢记一些注意事项，我们就可以毫不费力地使其工作。在开始之前，我希望您牢记这种模式的黄金法则：首先，高对比度模式关乎可用性，我们需要尊重这一点，高于任何其他美学问题。我们对这种模式的最大优先级是简化可读性并且不以任何方式损害用户体验。
网站设计高对比度模式是我看到一些网站忽略的东西，它会给使用此辅助功能的人带来问题。好消息是，我们有足够的工具让我们的网站在 WHCM 中运行良好，更何况微软努力创建媒体查询forced-colors——这为使我们的网站在这种模式下看起来更好而打开了新的大门。请记住：这是一个可访问性和可用性功能，因此当您想在此模式下调整项目时请记住这一点！
相关资讯
阿里云、腾讯云、华为云严选优质服务商
