We’re increasingly dependent on the internet and computers for everything we do — this has become starkly more obvious through the COVID19 global pandemic.

我们所做的一切都越来越依赖于互联网和计算机-通过COVID19全球大流行，这一点变得更加明显。

From finding work, doing our work, banking, travel, through to shopping and keeping in touch with our loved ones — so many aspects of our lives are dependent on technology.

从寻找工作，工作，银行业务，旅行，购物到与亲人保持联系，我们生活的许多方面都依赖技术。

Although they’re critically important, and an ever-present resource, access is not always a given for people living with disabilities.

尽管访问权限至关重要，并且是永远存在的资源，但访问权限并不总是适合残疾人士使用。

About 25% of the world’s population has some form of disability.

世界上约25％的人口患有某种形式的残疾。

That’s 2.42 billion people and a $6.9 trillion dollar economy that’s being ignored. No, not a trivial amount at all.

那是24.2亿人，而一个价值6.9万亿美元的经济却被忽略了 。 不，一点也不微不足道。

Why? Simply because designers and developers of technology don’t consider the needs of people with disabilities.

为什么？ 仅仅因为技术的设计师和开发人员没有考虑残疾人的需求。

They’re seen as minority users, and we’re taught to design for the average person. Interestingly, the average person doesn’t actually exist, and this has caused a plethora of serious and sometimes fatal issues in different industries (this example from the air force is both fascinating and shocking).

他们被视为少数族裔用户，我们被教导为普通人设计。 有趣的是， 普通人实际上并不存在 ，这在不同行业中造成了许多严重甚至有时是致命的问题( 空军的这个例子既令人着迷，又令人震惊 )。

Accessible software and websites have more clear benefits — better search results, bigger audience reach, they encourage good coding practices, and increase usability for everyone.

可访问的软件和网站具有更明显的好处-更好的搜索结果，更大的受众范围，鼓励良好的编码习惯并提高每个人的可用性。

There’s a lot of work that we still need to do to bring accessibility standards and guidelines into the realm of usability — a lot of these are still “tick-box” exercises, that don’t always mean people with disabilities can use them. But they are still better than not having considered them at all.

为了将可访问性标准和指南带入可用性领域，我们仍然需要做大量的工作-其中许多仍然是“打勾”式的练习，并不总是意味着残疾人可以使用它们。 但是它们仍然比根本不考虑它们更好。

通用设计 (Universal Design)

So, if designing for the average person is a massive fail, how do we design for all? That’s what we call Universal/Accessible Design.

因此，如果为普通人设计是一个巨大的失败，那么我们如何为所有人设计？ 这就是我们所谓的通用/无障碍设计。

Coined by architect, Ronald Mac, Universal design employs seven principles to aid in the design of buildings, products, services, policy/law and environments to make them accessible to all people, regardless of age, disability or other factors.

由建筑师罗纳德·麦克(Ronald Mac)创造的通用设计采用七项原则来协助设计建筑物，产品，服务，政策/法律和环境，以使所有人都可以使用它们，而不论其年龄，残疾或其他因素如何。

The 7 principles are as follows:

这七个原则如下：

• Equitable Use: The design is useful and marketable to people with diverse abilities.

  公平使用：该设计对于具有多种能力的人很有用且可销售。

• Flexibility in Use: The design accommodates a wide range of individual preferences and abilities.

  使用的灵活性：设计可适应各种个人喜好和能力。

• Simple and Intuitive Use: The design is easy to understand, regardless of the user’s experience, knowledge, language skills, or concentration level.

  简单直观的使用方法：无论用户的经验，知识，语言技能或专心程度如何，设计都易于理解。

• Perceptible Information: The design communicates necessary information effectively to the user, regardless of ambient conditions or the user’s sensory abilities.

  可感知的信息：无论环境条件或用户的感觉能力如何，设计都可以有效地向用户传达必要的信息。

• Tolerance for Error: The design minimizes hazards and the adverse consequences of accidental or unintended actions.

  错误容忍度：设计将意外事故或意外行为的危害和不良后果降至最低。

• Low Physical Effort: The design can be used efficiently and comfortably and with minimum fatigue.

  体力劳动低：该设计可以高效，舒适地使用，并且疲劳程度最小。

• Size and Space for Approach and Use: Appropriate size and space is provided for approach, reach, manipulation, and use, regardless of the user’s body size, posture, or mobility.

  接近和使用的大小和空间：为接近，到达，操纵和使用提供了适当的大小和空间，而与用户的身体大小，姿势或活动性无关。

Interestingly, some of the technologies we enjoy were once designed for disabled people. Email, telephone, typewriter, touch screens — the list goes on — these incredibly successful technologies were created with Universal Design at their core.

有趣的是，我们喜欢的某些技术曾经是为残疾人设计的。 电子邮件，电话，打字机，触摸屏-列表还在继续-这些以通用设计为核心而创造的非凡成功的技术。

在软件设计中需要考虑访问 (Access needs to consider in Software Design)

Along with the “average person myth”, there’s a myth that making a website or app accessible is difficult and expensive.

除了“普通人的神话”外，还有一个神话是使网站或应用程序易于访问既困难又昂贵。

Designing with accessibility from scratch doesn’t necessarily add extra features or content; therefore there shouldn’t be an additional cost or effort… plus, it’s much cheaper than having to redesign later on.

从头开始具有可访问性的设计不一定会添加额外的功能或内容； 因此，不应有额外的成本或工作量……而且，与以后重新设计相比，它要便宜得多。

When designing anything, we should consider the number and type of potential accessibility issues users will have. Here are some conditions we should consider when we design software and website:

在设计任何东西时，我们应该考虑用户可能遇到的潜在可访问性问题的数量和类型。 在设计软件和网站时，应考虑以下条件：

• Visual Impairment: This includes a partial or total inability to see or to perceive colour contrasts.

  视觉障碍：这包括部分或全部无法看到或察觉颜色对比。

• Hearing Impairment: Some users have a reduced ability to hear.

  听力障碍：有些用户的听觉能力降低。

• Motor Skills/Physical Disabilities: Users may have difficulty moving parts of their bodies, including making precise movements (such as when using a mouse).

  运动技能/肢体残疾：用户可能难以移动身体的各个部分，包括进行精确的运动(例如使用鼠标时)。

• Photosensitive Seizures: Conditions such as epilepsy can cause seizures that are often triggered by flashing lights.

  光敏性癫痫发作：诸如癫痫之类的状况可能会导致癫痫发作，通常是由闪光灯引起的。

• Cognitive Disabilities: There are also many conditions that affect cognitive ability, such as dementia and dyslexia.

  认知障碍：还有许多影响认知能力的疾病，例如痴呆症和诵读困难症。

无障碍设计注意事项 (Design considerations for accessibility)

Now that we know the reasons why we need to design for all, and the different types of access needs, what are the actionable steps we can take in designing software and websites?

现在我们知道了为什么需要针对所有人进行设计的原因，以及不同类型的访问需求，在设计软件和网站时可以采取哪些可行步骤？

The following list is drawn from accessible Web design, based on the WCAG accessibility standards, and are surprisingly simple to implement.

以下列表是基于WCAG可访问性标准的可访问Web设计得出的，并且实现起来非常简单。

1.包括视觉内容的替代文本 (1. Include text alternatives for visual content)

Adding alternative text descriptions to visual content, enables assistive technologies, such as screen readers, to interpret the image into spoken form so that people with vision impairments can understand and navigate the interface. The text should be a brief sentence that describes the image clearly. If alt text is neglected, screen readers will either skip the image, or read out its file name.

在视觉内容上添加替代文本描述，可以使诸如屏幕阅读器之类的辅助技术将图像解释为语音形式，从而使视力障碍者可以理解和浏览界面。 文字应该是简短的句子，以清楚地描述图像。 如果忽略替代文本，屏幕阅读器将跳过图像或读出其文件名。

For all video content, remember to incorporate subtitles for users who are deaf. This also benefits people who may want to watch the video on mute or in public spaces. If the video is mainly visual without dialogue or narration, add a video caption that describes the content. If you haven’t already, try this setting on Netflix, it’s quite interesting!

对于所有视频内容，请记住为聋哑用户添加字幕。 这也使可能想在静音或公共场所观看视频的人受益。 如果视频主要是可视的，没有对话或旁白，请添加描述内容的视频标题。 如果您还没有，请在Netflix上尝试此设置，这很有趣！

2.保留文本层次结构 (2. Retain text hierarchy)

The visual hierarchy of the interface should be easily interpreted by assistive technology. Remember to specify the different titles, headings and paragraph styles.

界面的视觉层次结构应通过辅助技术轻松解释。 记住要指定不同的标题，标题和段落样式。

Labelling your text enables browsers and screen readers and alternative access methods to correctly navigate through the content and present in the right order.

标记文本可以使浏览器和屏幕阅读器以及其他访问方法正确地浏览内容并以正确的顺序显示。

3.正确的色彩对比水平 (3. The right level of colour contrast)

Colour is key in anything design related. The right colour palette contributes to the brand, mood and tone of the software. But, the proper use of colour is also a major component in the legibility of an interface.

颜色是任何与设计相关的关键。 正确的调色板有助于软件的品牌，氛围和色调。 但是，正确使用颜色也是界面可读性的主要组成部分。

Colour contrast is often overlooked, but people who have low vision can find it hard to read text from a background colour if it has low contrast. The right contrast can ensure all the elements are distinguishable and clear. The WCAG suggests a minimal contrast ratio of 4.5 to 1 between the text colour and its background.

色彩对比度通常被忽略，但是视力低下的人会发现很难从背景色中读取文本。 正确的对比可以确保所有元素都清晰可辨。 WCAG建议在文本颜色与其背景之间的最小对比度为4.5：1。

4.不要仅仅依靠颜色来传达信息 (4. Don’t rely on colour alone to convey information)

Users who have visual impairments may not perceive colour accurately, or at all. That’s why it’s important to use more than just colour to communicate different information.

有视觉障碍的用户可能无法准确感知色彩，或根本无法感知色彩。 这就是为什么重要的是使用不仅仅是颜色来传达不同的信息。

For instance, when designing buttons, make sure to add text labels, even if they have been differentiated using colour. A quick and easy way to test colour accessibility is by converting the design to black and white to see if the same information still comes across.

例如，在设计按钮时，即使已使用颜色区分了文本标签，也请确保添加文本标签。 测试颜色可访问性的一种快速简便的方法是将设计转换为黑白，以查看是否仍然遇到相同的信息。

5.启用键盘导航 (5. Enable keyboard navigation)

The computer mouse isn’t the only way people can interact with your software or website. This is particularly important for people with physical disabilities who will use alternative access methods for computer interaction.

电脑鼠标并不是人们与您的软件或网站进行交互的唯一方式。 对于身体残障人士来说，这将使用替代的访问方法进行计算机交互尤为重要。

From the get-go, it’s important to ensure that all functionalities are accessible with a keyboard (keys such as tab, enter, and the arrows). This can be easily tested in house by trying to navigate the user interface without a mouse, and seeing how far you get.

从一开始，重要的是要确保所有功能都可以通过键盘(如Tab，Enter和箭头之类的键)访问。 通过尝试在不使用鼠标的情况下导航用户界面并查看能走多远，可以轻松地在内部进行测试。

6.清楚地标记表单字段 (6. Clearly label form fields)

It’s important to provide users with clear labelled elements, so they can understand what information needs to be filled in, and where.

为用户提供清晰的标签元素很重要，这样他们才能了解哪些信息需要填写以及在何处填写。

Remember to keep the text consistent, so that the visible text visible is the same as the field’s name. This makes it simple for people using assistive technology to fill out forms without frustration.

请记住要使文本保持一致，以便可见的可见文本与字段名称相同。 这使使用辅助技术的人可以轻松完成表格的填写，而不会感到沮丧。

7.避免可能引起癫痫发作的内容 (7. Avoid content that may cause seizures)

Accessibility guidelines suggest that no element should flash or flicker over three times per second. Anything above that threshold can trigger seizures in people who are photosensitive.

辅助功能准则建议，任何元素每秒均不应闪烁3次以上。 超过该阈值的任何物体都可能引发光敏性患者的癫痫发作。

For any flashing content, it’s recommended to use lower contrast, and avoid saturated reds. And let’s be honest, this consideration makes for a visually more pleasing experience in general.

对于任何闪烁的内容，建议使用较低的对比度，并避免饱和的红色。 老实说，这种考虑通常会带来视觉上更令人愉悦的体验。

从这里到哪里... (Where to from here…)

Remember, accessibility isn’t just about ‘doing good’. Accessible software and websites have better search results, reach a bigger audience, they encourage good coding practices, and increase usability for everyone.

请记住，可访问性不只是“做得好”。 可访问的软件和网站具有更好的搜索结果，覆盖更多的受众，他们鼓励良好的编码习惯，并提高每个人的可用性。

So, make accessibility part of your design research. Verify your assumptions with people who have disabilities, or better yet, co-design with them. It definitely makes for a more purposeful, and engaging design and development process.

因此，使可访问性成为您设计研究的一部分。 与残障人士一起验证您的假设，或者更好的是与残障人士共同设计。 它无疑使设计和开发过程更具针对性和吸引力。

If you’re inspired by this post, check out these useful tools that can kickstart your journey to building more meaningful, inclusive solutions

如果您受到本文的启发，请查看这些有用的工具，这些工具可以帮助您开始构建更有意义，更具包容性的解决方案

• WebAIM Colour Contrast Checker: Great contrast colour checker that gives you results in real time for regular and large text.

  WebAIM颜色对比度检查器 ： 出色的对比度颜色检查器，可为您提供常规和大文本的实时结果。

• Inclusive Components: A pattern library in the form of a blog, with a focus on inclusive design. Each post explores a common interface component and comes up with a better, more robust and accessible version of it.

  包容性组件 ：博客形式的模式库，重点是包容性设计。 每篇文章都探讨了一个通用的界面组件，并提出了一个更好，更健壮和易于访问的版本。

• Colour Oracle: A free colour blindness simulator for Windows, Mac, and Linux. It shows you in real time what people with common color vision impairments see.

  Color Oracle ：适用于Windows，Mac和Linux的免费色盲模拟器。 它实时显示具有常见色觉障碍的人所见。

• Vox Product Accessibility Guidelines: A comprehensive checklist for designers, engineers, and project managers.

  Vox产品辅助功能指南：针对设计师，工程师和项目经理的全面清单。

• AXE Google Chrome Extension: Test any site for accessibility violations using the Chrome inspector.

  AX Google Chrome扩展程序 ：使用Chrome检查器测试任何网站的可访问性违规行为。

• Contrast: A macOS app for quick access to WCAG colour contrast ratios.

  对比度 ：macOS应用程序，用于快速访问WCAG色彩对比度。