無障礙設計:使每個人都可以訪問網站

如果您知道10億人無法訪問您的網頁,該怎麼辦?即使他們設法訪問它,他們也無法導航也無法理解它,因此對他們來說,它似乎是一個完全無用的網頁。您願意改變嗎?

當我們說十億人口時,我們並不誇張。世界銀行的統計數據顯示,世界上確實有10億殘疾人,佔世界人口的15%。其中,有110-1.9億人患有嚴重殘疾。

我們都知道,社會無障礙是賦予社會上所有邊緣化和受歧視人民權力的問題。這意味著通過喚起人們的意識並開發輔助性技術來幫助那些融入任何形式的身體或精神殘疾的人們,向他們伸出援助之手。

網頁設計的無障礙又如何呢?設計區域應該不同嗎?

不應該。

因此,讓我們更深入地研究這個主題。

無障礙設計:使每個人都可以訪問網站

為什麼無障礙設計很重要

無障礙設計意味著設計網頁,應用程序,瀏覽器,工具以及所有其他數字產品,以照顧每個永久或暫時禁用某些功能的人。

換句話說,這意味著創建可用的,功能齊全且易於使用的產品,以滿足盡可能多的個人的需求。

無障礙設計並非假定一種千篇一律的用戶體驗,而是旨在取悅各種各樣的個人,並適應各種與世界互動的體驗和方式。輔助設備旨在消除殘疾人的障礙,而無障礙設計則致力於從根本上重新設計產品,以使障礙不存在。

幸運的是,近年來設計師和開發人員已開始對此給予更多關注,無障礙設計和可訪問性已成為設計界的流行語。

例如,填寫圖像屬性中Alt屬性,這表達了圖像上的內容,以使其對於搜索引擎更具可讀性,相信您會認為這是用於圖像優化的SEO技術之一?實際上並非全部真確。

它用於SEO優化,這是正確的。但是您知道圖像Alt屬性的首要目的嗎?它用於在文本上描述網頁上的非文本內容,並使其對於屏幕閱讀器可讀。因此,視障用戶可以輕鬆地知道圖像中顯示了什麼。這就是為什麼Alt屬性應更具描述性,而不是簡單地配備關鍵字。

因此,在照片和其他視覺內容中添加替代文本是無障礙可訪問性的核心原則之一。

無障礙設計:使每個人都可以訪問網站

什麼是網絡訪問能力

可訪問性是包含設計的主要目標之一。

使網頁,網上商店可訪問意味著,每個網頁的設計和編碼方式均使其易於使用,可使用,可理解且可導航到任何形式的肢體和精神殘疾用戶。

如Web Accessibility Initiative(WAI)所述,許多網頁和工具的開發都具有可訪問性障礙,這使某些人難以使用或無法使用它們。使網絡可訪問將使個人,企業和社會受益。

影響訪問網絡的障礙包括:

  • 聽覺的
  • 認知的
  • 神經學的
  • 物理
  • 言語
  • 視覺的

除此之外,可訪問性還使那些暫時或有狀況障礙的人受益,例如:

  • 在手機,智能手錶和其他設備上使用小屏幕的人
  • 因衰老而經歷能力變化的人
  • 暫時性殘障人士,例如斷腿,失去眼鏡,聽大聲的音樂
  • 有局限性的人,例如光線太低或太亮,或環境太嘈雜
  • 使用慢速Internet連接或有限帶寬的人

無障礙設計:使每個人都可以訪問網站

如何使每個人都能使用您的數字產品

如果您認為設計無障礙網頁很困難,而又不想為此煩惱,那麼我們提醒您,大約有10億人可能無法訪問您的網頁。

因此,讓我們幫助您理解這些準則,並使這些原則更易於理解。

根據《網絡內容可訪問性指南》(WCAG)2.0,有大量建議使殘障人士更容易訪問網絡內容,包括低視力,聽力受損,學習障礙,認知障礙,動作受限,言語障礙,光敏性,以及這些的組合。

符合WCAG準則的三個級別:

  • A –滿足基本的可訪問性要求
  • AA –滿足中等規模的可訪問性要求
  • AAA –滿足大量可訪問性要求

無障礙設計:使每個人都可以訪問網站

基本訪問級別的可用步驟

保持佈局清晰

沒有人喜歡混亂的設計或混亂的佈局,這些佈局充滿了不合理的導航標誌或不合邏輯的信息組。請確保以清晰的視覺佈局反映信息層次結構,使用戶可以自然瀏覽內容。

創建易於理解的鏈接

很多鏈接的錨文本顯示為點擊此處,但在現今已經不再建議了。如今,您應該將對鏈接的有意義的解釋放入錨文本中,保持簡明易懂。

設計大的按鈕

號召性用語按鈕是最重要的網頁設計組件之一,因此請謹慎使用。這意味著您應該使按鈕足夠大,以引起每個用戶的注意。這也意味著您需要使它們與眾不同,在小屏幕上易於接近且不混淆。

啟用自定義文本

您可能會認為12的字體大小足以滿足您網頁的讀者的需要。但是,讀者可能不同意。一些用戶可能會覺得很難閱讀此類文本,他們可能只是離開您的網頁而永不回來。因此,請記住始終使用戶能夠調整字體大小。這將使閱讀體驗更加愉快。

測試鍵盤導航

在測試Web設計原型時,請不要忘記在整個過程中測試鍵盤導航。從左到右,嘗試上下移動,測試Tab和Enter鍵,並確保僅使用鍵盤即可瀏覽整個網頁。這種導航是網絡可訪問性最重要的方面之一,因為它可能會影響許多殘障人士。

無障礙設計:使每個人都可以訪問網站

形成良好的色彩對比

如果在白色背景上放置淺灰色字母,則將使文本難以閱讀。深色背景上的深色字母也會發生同樣的情況。因此,在採取行動之前,請三思,並確保在網頁上創建高對比度的值,以使更多的用戶可以使用它。另外,請注意處理色盲的每個人,並儘量不要並排放置相似或無法識別的顏色。用戶將不勝感激。

不要使屏幕過分擁擠

考慮產品功能並設計屏幕佈局時,請記住"少即是多,並保持設計簡約。含義:將元素保持在最低限度,使其可見並且不會使屏幕擁擠。如果這樣做,那麼對於用戶來說似乎不堪重負,並且可能會增加您網頁的跳出率,而且沒人會希望這種情況發生。

提供視頻內容的字幕

觀看母語以外的視頻很常見。如果沒有字幕,您將聽不懂單詞,對嗎?好吧,這正是有聽力損失經驗的人所需要的。沒有字幕加上聽不懂。因此,請確保為您在網頁上播放的每個視頻提供字幕。另外,請不要忘記黃金分割法則-不要將視頻放到自動播放中。

提供預先錄製的音頻的字幕

如果您在網頁上運行播客,或者通常上傳大量音頻材料,請確保為每個錄音提供成績單。您可以製作完整版本或簡短的摘要,但是無論哪種方式,都不要忽略與音頻對齊的文本的重要性。它將使聽覺受損的人受益,並使您的內容對其他所有人也更容易訪問。

無障礙設計:使每個人都可以訪問網站

嘗試代入用戶角色

如果您是經常與客戶打交道的設計師或開發人員,那麼他們中的大多數人甚至根本不會考慮可訪問性。

讓我們以耳機生產商為例。他可能會說聽覺受損或聾啞的人肯定不在目標受眾中,並且他可能想知道為什麼要讓他們的網頁可供他們訪問。

或者,一本書的出版商可能認為閱讀困難的人與他的業務無關,而只是忽視他們是潛在的顧客。

最具諷刺意味的是,如果盲人輔助設備的生產商沒有使視障人士可以訪問他的網頁。

如果您發現自己處於這種情況,該怎麼辦?您是否應該干預並向客戶解釋融合設計的重要性?

你怎麼能告訴他們你的意思呢?

首先,您應該運行可訪問性測試並查看網頁的痛點。為此,您可以使用Jennifer Aldrich在UX Magazine上推薦的一些在線測試工具。她的清單包括AChecker,對比度分析器,Skala Preview和Wave Web可訪問性評估工具。

然後,您只需將客戶的商業網頁放在屏幕閱讀器中即可閱讀。這樣的現場演示將使他們親身體驗網頁訪問的興衰。這可能會改變他們的想法。

如果您想親自體驗,可以嘗試Funkify(測試版)的Beta版,該擴展程序是Chrome的新擴展,可幫助您查看網絡並通過具有不同能力和殘障能力的用戶的眼睛使用界面。

無障礙設計:使每個人都可以訪問網站

結論

無障礙設計和網頁可訪問性不僅僅是流行語。

無障礙和可訪問性的設計意味著您創建的每個數字解決方案都應為每個用戶提供定制的用戶體驗,無論它們是永久性或臨時性禁用還是完全禁用。遵循這些準則也將使您的網頁對一般用戶更有用。它可以增加您的頁面訪問量,延長用戶訪問您網頁的時間,使客戶更容易從您的電子商店購買商品,並使您的網頁對SEO更加友好。

每個人都有權上網,查看您的網頁內容並與之互動。並且緊記考慮網頁設計的各個方面,使您的用戶滿意。