专业的短链接生成工具
链接域名
短网址有效期
以人为本,为颜色障碍用户打造人性化设计
更新时间:2025-5-10 06:50:03 作者:爱短链
颜色障碍者(色盲)是一个特殊的群体。
他们对某种或多种颜色有视觉障碍,但许多设计并没有考虑到颜色障碍者(色盲)的需求和困难。
通过阅读本文,了解设计应如何考虑颜色障碍(色盲)用户体验。
观察颜色的方法是一样的吗? 请看上图。
如果看到数字21或者没有看到任何数字,可能会有一些颜色识别障碍(色盲)(如果有全彩视力,应该看到数字74)。
色盲色弱试图 据估计,每 12 名男性中有 1 名字(8%)有某种形式的色盲,而女性往往是 200 名中只有 1 名字。
在英国,这意味着大约有 270 一万人受到影响,这是人口的很大一部分,但我们在设计网站和用户界面时经常忘记它们。
在我们团队(Si digital)我们将考虑每个项目的用户体验和可访问性。
我们使用各种工具和技能来帮助我们理解视觉障碍,使我们的网站更实用,并考虑色盲用户的感考虑色盲用户的感,使它不会沮丧。
颜色识别障碍(色盲)是什么? 颜色识别障碍(色盲)有很多种,严重程度不同。
人们普遍错误地认为,颜色识别障碍(色盲)的人只能看到黑色和白色。
即使这可能是真的,单色(也称为全色盲)也是非常罕见的,估计通常 3.3 一万人中有一人受到影响。
这种严重的视觉障碍使人们看到灰色的东西。
记住一个重要因素。
对于大多数颜色识别障碍(色盲)患者来说,区分不同的颜色并不难。
真正的问题是区分相似颜色的亮度和暗度。
正常视力与单色盲、红色盲、绿色盲 红绿色识别障碍(色盲)更为常见,分为两组。
红弱视(Protanomaly)人们对红光的敏感度较低,红色、橙色和黄色往往是绿色的,看起来不那么饱和。
绿色弱视(Deuteranomaly)人对绿光敏感度低,很难区分蓝、黄、紫、红、蓝、绿。
野外的颜色 长期以来,颜色识别障碍(色盲)带来的困难不仅在网站设计中被忽视,而且在电视、电影,尤其是电子游戏中也被忽视。
许多用户无法玩游戏,或者因为颜色识别障碍(色盲)而无法识别重要性UI元素使游戏难以继续。
以游戏《巫师3》为例: 当切换成红绿盲视角时,地面上的红色标记几乎看不见 该游戏的特点是使用增强感官的功能来跟踪气味、脚印和线索。
然而,游戏开发者选择深红色作为标记,所以许多用户抱怨他们看不清楚(或根本看不见)。
更改颜色或更改颜色的简单选项可能会使游戏更容易开始。
由于视觉障碍人口比例高,颜色识别障碍(色盲)用户是一个需要认真对待的问题。
如果您的网页或应用程序没有特别优化,您可能会失去大量用户。
例如,如果用户因为颜色冲突和缺乏对比而无法区分一系列图标,用户会感到沮丧,并找到其他网页或应用程序服务来取代您的网页。
如果这成为每个潜在客户的颜色识别障碍(色盲),你将失去 8% 潜在销售额-对于收入1000万英镑的公司,公司将遭受损失 80 一万英镑的巨额销售额。
设计中如何考虑颜色识别障碍(色盲) 即使颜色识别障碍(色盲)会给用户带来很大的麻烦,也很容易克服。
如果你意识到这个问题,你就成功了一半。
1. 使用对比色 对比色的应用 即使患有单色识别障碍(色盲)的人仍然有对比感-明暗之间的比例差异。
为了确保你的网站使有视觉障碍的人更具可读性,你必须确保你的内容与背景形成鲜明的对比。
例如,白色背景上的黑色文本对比度和可读性较高,而白色背景上的黄色文本对比度较低,即使是视力全彩的人也几乎不可读。
2. 使用不同的亮度而不是多种颜色 同一颜色不同亮度的应用 单色配色方案(不要与全色盲、单色盲混淆)使用不同的亮度效果,比使用多种不同的颜色要好。
这将有效地减少用户与颜色相关的挫败感,也是反映设计中颜色对比度的好方法。
单色配色方案不一定是黑色和白色,而是使用不同亮度的蓝色。
在完成可读性的前提下,我们也实现了视觉愉悦。
3. 在设计中亲身体验色盲 使用设计软件切换不同类型的色盲模式 Adobe Photoshop 中色盲模拟 许多免费工具可以模拟色盲的环境,让您了解色盲识别障碍(色盲)的外部环境,以确保您的用户界面按照您的预期工作。
Photoshop 有自己的校准设置功能(稍微隐藏),只需进入检查