设计中的可访问性和包容性

包容性是一个设计机会，设计过程的一个重要部分是确保我们为更多的人而不仅仅是为我们自己设计。包容性首先要意识到那些可能在访问您的应用程序时遇到困难或以不同方式使用它的人，然后一直延伸到您仍然了解您的应用程序如何描绘人们。

如果您没有以尽可能包容的方式进行设计，那么是时候重新考虑了。它不会自动发生，默认情况下，您可能会根据自己的世界观和偏见做出假设。请务必退后一步，提醒自己我们是为人类设计的。

2018 年，世界卫生组织报告称，超过 10 亿人（占全球人口的 15%）患有某种形式的损伤。这是您可以而且应该接触的潜在受众。

包容性是指设计的服务或产品可供尽可能多的个人或团体访问和使用，同时帮助满足被排斥人群的需求。因此，包容性设计通常可以改善所有客户的产品体验。

设计一种产品来满足世界的需求或目标并不总是可能或合适的。就像您不会启动一款只有一种语言选项来服务整个世界的应用程序一样。

相反，首先确定目标客户群，并考虑构建一套产品或核心产品的衍生版本，以更好地服务于大量人群。为问题创建多样化的解决方案可能会降低获取最多样化客户的障碍。这是成功服务客户和努力帮助所有人之间的平衡。集中精力为大多数人解决可行的问题。

所有受众都受益于包容性设计。如果您正在创建营销材料来宣传公司、产品或服务，使它们更易于阅读和理解可以帮助您的所有观众。但最重要的是，包容性设计可以帮助残疾人和老年人。

每个设计决策都有可能包含或排除客户。包容性设计强调了解客户多样性对于为这些决策提供信息做出的贡献，从而包容尽可能多的人。用户多样性涵盖了能力、需求和愿望的变化。

拥有精心设计的客户旅程非常重要，这样您的客户在使用您的产品时就不会遇到任何障碍。您需要解决真实和想象的障碍，并为您的客户消除它们。

免费开始客户旅程地图

获取此模板

figma-7d7l42" style="box-sizing: inherit; cursor: var(--cursorText); margin: 32px 0px 16px; font-weight: 500; font-size: var(--h2-fs); line-height: var(--h2-lh); letter-spacing: var(--h2-ls); position: relative; font-family: Whyte, sans-serif; text-wrap: wrap; background-color: rgb(255, 255, 255);">包容性和交叉性

包容性不仅仅限于您的客户。这对于您的工作环境也至关重要。Project Include 提供了开始解决工作场所包容性问题的建议。

当您开始在包容性道路上定义客户和同事群体时，需要考虑交叉性的概念。交叉性描述了诸如种族主义、性别歧视、体能歧视、跨性别恐惧症、同性恋恐惧症、仇外心理、阶级主义等压迫制度如何相互关联，并且不能相互独立地考虑或研究。

figma-7d7l42" style="box-sizing: inherit; cursor: var(--cursorText); margin: 32px 0px 16px; font-weight: 500; font-size: var(--h2-fs); line-height: var(--h2-lh); letter-spacing: var(--h2-ls); position: relative; font-family: Whyte, sans-serif; text-wrap: wrap; background-color: rgb(255, 255, 255);">无障碍

可访问性是指您的产品包容最广泛的个人并可供最广泛的个人使用的程度。我们在物理空间中看到了这一点，为临时或永久行动受限的人提供坡道而不是楼梯。虽然需要坡道才能进入建筑物的人会得到帮助，但可能走楼梯的人也可以使用坡道并从中受益。

重要的是不要对您的客户及其能力做出假设。并非所有残疾人都承认或认为自己是残疾人。通常，患有与衰老相关的障碍的老年人不会想到在表格或调查中勾选标有“残疾”的方框。

当谈论无障碍和残疾时，不确定使用什么语言和术语是可以的。通过咨询残疾人来询问某人。这不仅仅是让你的词汇和语气正确，这为你提供了征求反馈甚至建立受众的机会。

微软的包容性设计工具包强调了我们如何从设计师对无障碍的关注中受益。下表列出了不同类型的暂时和永久残疾。

构建可访问产品的多种方法之一是为有色觉缺陷的人设计，这是一种人的眼睛在正常光线条件下无法看到颜色的情况。色觉缺陷的人很难区分颜色。许多产品的一个显着特征是颜色，但是对于难以区分颜色的人来说，按钮或其他界面元素会发生什么情况呢？

例如，对于某些人来说可能看起来不同的橙色和绿色，对于患有红色盲（色盲的一种）的人来说可能看起来几乎相同。

大多数患有色觉缺陷的人并不是对颜色视而不见，而是看到颜色的能力下降。然而，这些缺陷的最严重形式被称为色盲。

色盲影响着全世界数百万人：据估计，共有 260-3.2 亿人受到遗传影响——每 12 名男性中就有 1 名，每 200 名女性中就有 1 名。然而，各种颜色缺陷因人而异。世界卫生组织(WHO) 确定全球 4% 的人口患有视力障碍，4% 的人口视力低下，0.6% 的人口失明。

色觉缺陷有多种类别；最常见的是红绿色盲或红色盲。其他色觉缺陷包括红色盲、绿色盲、绿色盲、蓝色盲、蓝色弱视、全色盲、全色盲和低对比度。

色觉缺陷可以是后天获得的，但大多数是遗传性的。影响眼睛内部颜色的基因（称为“感光色素”）携带在 X 染色体上。如果这些基因异常或受损，就会出现色盲。有时，色盲可能是由于眼睛、视神经或大脑处理颜色信息的部分受到物理或化学损伤而引起的。色觉也会随着年龄的增长而下降，最常见的原因是白内障——眼睛晶状体混浊和发黄。

有许多工具和指南可用于测试和规划足够鲜明的对比度水平，以针对多种类型的视力下降和色觉缺陷保持易于使用的设计。Able是一款流行的 Figma 插件，可确保您的工作易于访问。

亲自体验：尝试在不使用鼠标或使用语音或文本浏览器（在线提供免费选项）的情况下使用您的网站。体验如何？将替代文本附加到网页或应用程序代码中的每个图像是为视力不佳的人创建访问权限的另一种方式，使用屏幕阅读器导航他们的设备。

正如您将在层次结构课程中看到的那样，设计简单、间隔良好的布局已经成为我们用来将注意力集中在最重要信息上的策略。通过这样做，您也提高了可读性。可读性对于每个设计都至关重要，对于无障碍设计也至关重要。

可读性可以通过许多不同的策略来扩展，从更高的对比度颜色、更大的文本、更短的行长、字距调整、行距、字体选择等等，这些都将在排版课程中进一步介绍。

figma-7d7l42" style="box-sizing: inherit; cursor: var(--cursorText); margin: 32px 0px 16px; font-weight: 500; font-size: var(--h2-fs); line-height: var(--h2-lh); letter-spacing: var(--h2-ls); position: relative; font-family: Whyte, sans-serif; text-wrap: wrap; background-color: rgb(255, 255, 255);">可用性

可用性是指使用产品或服务来实现特定客户目标的简单、直观和高效的程度。

这是了解产品或服务如何工作的学习曲线的大小，缺乏执行所需交互所需的说明，以及完成这些操作所需的时间或精力（例如所需的点击次数）。

一个例子是较大设备上的移动应用程序的布局。当人们用一只手拿着手机时，仅用拇指就能触及的屏幕区域所占的比例越来越小。菜单栏和搜索字段更频繁地出现在屏幕底部，以提高其可用性。

正如《什么是设计？》中提到的那样。部分，审美可用性效应也在这里发挥作用。无论产品的美观程度如何，让您的产品可用是至关重要的