Web可访问性和色彩:它没有被灰

4分读

|马特龙,大风软件工程经理|金宝搏彩票

由于一些原因,造成对网页易读与-甚至理解,颜色的重要性,可以很容易的优先级列表上落低。然而,色彩对比网页无障碍的一个非常重要的方面。幸运的是,它不是很难理解和坚持。

有在与色2个主要部分WCAG 2.0指南1.4 - 可分辨-使用颜色对比

使用颜色

使用颜色是更直接的两个。不遵守的最简单的例子将是具有文本,上面写着类似“必填字段红色的”一无所有比色区分非必填字段必填字段等。有人用某种程度的色觉缺陷的可能有一个很难做出恰当反应。

另一个例子可以是一个接口,示出了3次不同的测试的状态:测试1测试2测试3。该测试的名称将是绿色指示通过测试,红色为失败的测试,和橙色的测试的成功运行,但是出现警告。下面的例子显示了4种不同的色觉缺陷如何影响一个人如何看待概述了最左边的预期输出。

一种更好的方法是还具有指示如下面的图像中的每个测试的状态的文本。

对比

内可访问性和颜色的情况下,对比度可被定义为在亮度差或2种颜色之间感知的亮度。这是很简单的是兼容,尤其是与所有可用的工具。最小WCAG AA颜色对比度为4.5:1和3:1的大型文本。所述AAA最小比率为7:1和4.5:1。基本上,如果前景/背景颜色组合没有足够的对比度,它的使用不会WCAG兼容。有可用的计算对比,其中包括一对夫妇的我自己的一些免费工具,ColorA11y Chrome扩展A11Y调色板,这都使用colora11y。WebAIM的色彩对比检查也是一个受欢迎的色彩对比工具。

看看下面的颜色:

大多数颜色显得相当的可读性,尤其是有人无色盲。使用NoCoffee视觉模拟器的Chrome扩展程序,看看为什么对比度通过最大化对比度损失重要。上表中的许多样品将是,如果在清晰全,难度比页面上的文本的其余部分阅读。此外,通知较大的文本是如何更容易阅读,这就是为什么方针有很大的文本不同的比例。

这很容易!

色盲影响人口约有近10%,所以,在选择任何设计调色板时要注意的颜色对比是很重要的。现在,您已经有了一个更好地了解事情需要注意的,为什么它是重要的,哪些工具可用,成为和保持兼容的应该很容易。

大风资源范围内无障碍金宝搏彩票

金宝搏彩票盖尔的产品设计遵循最新的Web内容无障碍指南和测试,以确保信息可用于各种各样的残疾人,包括那些失明或低视力。ReadSpeaker文本到语音技术还支持谁是视障学生,增强挣扎谁听力朗读,因为他们遵循沿着每个字中受益的读者体验。随着ReadSpeaker,可以调节阅读速度,启用自动滚动,并使用像增加单词或句子的大小,颜色和下划线提示强调的文字。


结识作者


马特长的技术领导者和开发人员拥有超过15年的经验,目前大风,一个圣智学习公司担任软件工程经理和开发工作。金宝搏彩票他的成功来自于由干劲十足的人包围,并热衷于不断自我完善,网络,标准,使内容提供给大家。他曾在关于Web开发和可访问性会议和各种聚会,促成开源软件项目,偶尔志愿者的时间来工作,一个非营利性网站可访问性组织。Web开发是绝对不只是他的日常工作。


除了所有的东西web开发,马特和他的妻子与他们的4个年轻的男孩和2岁的哈巴狗一个伟大的生命。当天他试图花费起动了吉他在地下室试图听起来像他的一些收藏页,亨德里克斯,格林伍德,寇根,白色,和奥尔巴赫的任何剩余时间。


发表评论