Color Contrast Analyzer

Chrome浏览器插件下载和安装教程(图文讲解)

1.1 版新功能:将图像分析下载到 PNG 文件。

此扩展允许您根据 WCAG 2 文本颜色对比度要求分析网页上的文本颜色对比度问题。它会在页面出现在浏览器中时对其进行评估,因此它能够处理渐变和高级 CSS 属性上的文本。您可以选择分析网页的一部分、选项卡的整个可见内容或整个网页。

此外,您可以在计算机上评估可在 Chrome 中打开的文件,例如图像文件和 PDF 文件。请注意,对于 PDF 文件,您将只能评估页面的可见部分。要分析本地文件,您需要转到“扩展”页面并选中此扩展的“允许访问文件 URL”。

您可以选择评估 AA 或 AAA 一致性,同时指定要分析的文本的大小。

输出将向您显示颜色之间的边缘差异足以满足指定对比度要求的位置的地图。如果基础页面上的某个项目未在输出掩码中勾勒出轮廓,则根据您选择的一致性级别,该项目没有足够的颜色对比度。生成的图像分析可以作为 PNG 文件下载到您的计算机。

为了更好地处理渐变,您还可以选择应该用于分析相邻像素的像素半径。像素半径越大,它将寻找具有足够高对比度的边界越远。然而,更大的像素半径会增加大量的计算时间。

首次安装扩展程序时,您可能需要刷新要分析的网页,以便所有选择选项都可用。

此外,在安装扩展程序时,它会要求您授予访问您所有网站、标签和浏览活动数据的权限。我们不会以任何方式使用或收集这些数据。为了获得对浏览器窗口进行截图的许可,这是我们必须要求的访问级别。您可以在以下 URL 中查看源代码。

https://github.com/gdkraus/color-contrast-chrome

该工具是北卡罗来纳州立大学 IT 无障碍办公室的产品。

http://accessibility.oit.ncsu.edu/