如果您知道 10 億人無法訪問您的網站,您會怎麼做?即使他們設法訪問它,也無法瀏覽或理解它,因此它們似乎是一個完全無用的網頁。您願意改變嗎?
當我們説十億人時,我們並沒有誇大其詞。世界銀行的統計資料顯示,世界上確實有 10 億殘疾人,佔世界人口的 15%。其中,有 110-190 萬人患有嚴重殘疾。
我們都知道,社會包容性是一個賦予社會所有邊緣化和受歧視羣體權力的問題。這意味著通過提高意識和製作可以幫助他們融入 WooCommerce 社羣的輔助技術,向處理任何身心殘疾的每個人伸出援助之手。
那麼 WooCommerce 獨立站網頁設計包容性呢?設計區域應該不同嗎?它不應該。
所以,讓我們深入探討這個主題。
為什麼包容設計很重要
包容性設計意味著設計網站、應用程序、瀏覽器、工具以及其他所有永久或暫時禁用的數字產品。
換句話説,它意味著建立可用、功能和易用的產品,以滿足儘可能多的個人的需求。
包容性設計不是假設一種通用的多用户體驗,而是旨在取悦各種各樣的個人,並提供各種體驗和與世界互動的方式。雖然輔助裝置旨在消除殘疾人的障礙,但包容性設計力求從根本上重新設計產品,以便不存在障礙。-Eone 雜誌
幸運的是,設計師和開發人員最近開始更加關注這一點。
是的,包容性設計和可訪問性在設計界已成為一些流行語。但它不是最近剛剛發明的東西。這在《您可以從零開始設計網站或使用預 WordPress 建網站, 比其他網站更好嗎》?中也有提到過。
例如,採用影像替代屬性 Alt 文字。它是 CMS 後端的框,您可以使用在影像上看到的內容填充,以使其對搜索引擎更具可讀性,作為影像優化的 SEO 站羣技術之一。對?嗯,不是真的。
它用於 SEO 站羣優化,這是正確的。但是您知道影像 Alt 文字的首要目的嗎?它用於以文字方式描述網頁上的非文字內容,並使其可供屏幕閲讀器閲讀。因此,視障多用户可以很容易地知道影像中顯示的內容。這就是為什麼 Alt 文字應該更具描述性,而不僅僅是配備關鍵字。
因此,將 Alt 文字新增到照片和其他可視內容是 Web 可訪問性的核心原則之一。
什麼是網站可訪問性
可訪問性是包容性設計的主要目標之一。
使網站,電子商店或網絡應用程序可訪問意味著每個網頁的設計和編碼方式都使其易於使用、可用、易於理解,並可導航到任何形式的身心殘疾多用户。
正如 Web 可訪問性倡議(WAI)所描述的那樣,許多站點和工具的開發具有可訪問性障礙,使得某些人難以或不可能使用這些障礙。使網絡可訪問將有利於個人、企業和社會。
影響對 Web 訪問的因素包括:
聽覺
認知
神經
物理
言語
視覺
除此之外,網絡可訪問性還有利於臨時或情境殘疾的人,例如:
人們在手機,智慧手錶和其他裝置上使用小屏幕;
人們因衰老而體驗到能力的變化;
臨時殘疾的人,如斷腿,丟失眼鏡,接觸嘈雜的音樂;
具有情境限制的人,例如太低或太亮的光線,或太嘈雜的環境;
使用慢速 Internet 連線或頻寬有限的人。
多用户體驗設計師和 UX 知識庫草圖的創始人 Krisztina Szerovay 繪製的草圖非常有力地展示了可訪問性原則的全面評論。
如何使您的數字產品可以訪問每個人
如果您認為 WordPress 外貿獨立站網站建設中設計可訪問性很困難並且您根本不想打擾它,我們會提醒您,如果您不這樣做,可能會有無法訪問您網站的 10 億人。
因此,讓我們幫助您瞭解這些指導原則並使原則更易於理解。
根據網頁內容無障礙指南(WCAG)2.0,有一系列建議可讓殘障人士更容易獲取網頁內容,包括視力低下,聽力喪失,學習障礙,認知限制,運動受限,語言障礙,光敏性,和這些的組合。
WCAG 指南符合三個級別:
1.A – 滿足基本的可訪問性要求
2.AA – 滿足中等規模的可訪問性要求
3.AAA – 滿足高容量可訪問性要求
基本可達性水平的可用步驟:
保持您的佈局清晰
沒有人喜歡凌亂的設計或混亂的佈局,充滿了不合理的導航標誌或非邏輯的信息組。因此,正如 Andrew Wilshere 和 Teresa Lamb 在為 Design Lab 撰寫的文章中所述,請確保以清晰的視覺佈局反映信息層次結構,使多用户能夠自然地瀏覽內容。
創造無法理解的鏈接
還記得鏈接的錨文字是 “這裏”,“這裏” 和 “這裏” 的時間嗎?好吧,那些時間早已不復存在是有原因的。如今,您應該關注屏幕閲讀器並將鏈接的有意義的解釋放入錨文字中。保持簡潔易懂。
設計大按鈕
號召性用語按鈕是最重要的 WooCommerce 獨立站網頁設計元件之一,因此請小心處理。這意味著您應該使按鈕足夠大,以吸引每個多用户的眼球。這也意味著您需要在小屏幕上使它們與眾不同,易於接近,並且不會造成混淆。
啓用可自定義的文字
您可能認為字型大小 12 足以讓您的網站讀者閲讀。但是,讀者可能不同意。一些多用户可能會發現閲讀此類文字非常困難,他們可能只是讓您的網站永遠不會回來。因此,請務必始終啓用多用户調整字型大小的可能性。它將使閲讀體驗更加愉快。
測試鍵盤導航
在測試 Web 設計原型時,不要忘記沿途測試鍵盤導航。從左到右,嘗試上下移動,測試 Tab 和 Enter 鍵,並確保只使用鍵盤即可瀏覽整個網站。這種導航是網絡可訪問性最重要的方面之一,因為它可能會影響許多不同殘疾人。
做出良好的色彩對比
如果在白色背景上放置淺灰色字母,則會使文字難以讀取。在更暗的背景上使用深色字母也會發生同樣的情況。因此,在行動之前要先考慮一下,並確保在您的網頁上建立高對比度值,以便更多多用户可以訪問它。此外,請注意每個處理色盲的人,並儘量不要將相似或不可識別的顏色並排放置。多用户會很感激。
請勿過度使用屏幕
在考慮產品功能和設計屏幕布局時,請記住 “少即是多” 並保持設計簡約。含義:將元素保持在最小值,使它們可見並且不要過度擁擠屏幕。如果您這樣做,它對多用户來説似乎是壓倒性的,它可能會提高您網站的跳出率,沒有人會希望這種情況發生。
提供視頻內容的標題
觀看帶有字幕的不是母語的視頻是很常見的。如果沒有字幕,您將無法理解一個字,對吧? 嗯,這正是聽力損失的人經歷的。他們無法理解沒有字幕的單詞。因此,請務必為您在網站上播放的每個視頻提供字幕。並且不要忘記黃金法則 – 不要在自動播放上放置視頻。
為經驗豐富的音訊提供可用的錄音
如果您在自己的網站上播放視頻,或者通常上傳大量音訊資料,請務必為每次錄製提供成績單。您可以製作完整版本或更短的摘要,但不管怎樣,都不要忽視與音訊對齊的文字的重要性。它將使聽覺受損者受益,並使其他人也更容易獲得您網站的內容。
試著在多用户的鞋子裏走動
如果您是經常與客户打交道的設計師或開發人員,他們中的大多數人很可能甚至不會考慮可訪問性。
讓我們以耳機制造商為例。他可能會説聽覺受損或聾人當然不在他的目標受眾中,他可能想知道他為什麼要讓他們的網站可以訪問。
或者,圖書出版商可能會認為誦讀困難的人與他的業務無關,而只是忽視他們作為潛在客户。
最大的諷刺可能是,如果盲人輔助裝置的製作者不能讓視障人士訪問他的網站。
如果您發現自己處於這種狀況,您該怎麼辦?您是否應該介入並向客户解釋包容性設計的重要性?我們相信您應該會。
您怎麼能告訴他們您的意思?
首先,您應該執行輔助功能測試並檢視網站的痛點。為此,您可以使用 Jennifer Aldrich 在 UX 雜誌上推薦的一些線上測試工具。她的列表包括 AChecker,Contrast Analyzer,Skala Preview 和 Wave Web Accessibility evaluation Tool 。
然後,您可以簡單地將您的客户的商業 WordPress 外貿獨立站網站建設設置為由屏幕閲讀器閲。這種現場演示將使他們親身體驗網絡可訪問性的起伏。這可能會改變他們的想法。
如果您想親自體驗,可以嘗試使用 Funkify 的測試版,這是 Chrome 的新擴充套件程序,可幫助您通過具有不同能力和殘疾的多用户的眼睛看到網絡和使用界面。
結論
這是一句話的總結:
包容性設計和網絡可訪問性不僅僅是流行語。
設計包容性和可訪問性意味著您建立的每個數字解決方案都應為每個多用户提供定製的多用户體驗,無論他們是永久或暫時禁用,還是根本不禁用。遵循這些指南還可以使您的網站更易於多用户使用。它可以提高您的頁面訪問量,延長多用户在您的網站上停留的時間,讓客户更容易從您的電子商店購買,並使您的網頁更加 SEO 站羣友好。
每個人都有權檢視,稽核您的線上內容並與之互動。不要馬上把它拿走。
考慮 WooCommerce 獨立站網頁設計的各個方面,讓您的多用户滿意。
本文僅僅是可訪問性主題的一部分,但我們希望我們能夠解釋其重要性,併為您提供可用的步驟,通過讓每個人都可以訪問它們來改進您的網站和數字產品。