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色彩對比度。