設計可訪問性網站的 10 種方法

我對現代網頁設計感到沮喪。 我當然對大多數主題和模板設計師感到沮喪，他們在不檢查全局可訪問性的情況下出售他們的作品。

許多設計師實際上採用了良好的、可訪問的 CMS，然後創建了具有很大可訪問性問題的設計。

我是澳大利亞的一名律師、網站設計師和可訪問性/多樣性顧問。 在為企業、政府和教育部門提供建議後，我發現很多網站無法訪問，並且給許多用戶帶來了糟糕的體驗。

為什麼可訪問性很重要？

2010 年，發達國家有 10% 的人患有閱讀障礙。 在非發達國家，這一數字為 15%。

在澳大利亞，可訪問性被認為非常重要，如果您的網站無法訪問，我可以將您告上法庭。 震驚？

不，我絕不會建議客戶專注於“盲人網站”，而是所有人都可以訪問的網站。 這包括有閱讀障礙、身體殘疾、聽力障礙的人——甚至是老一代。 簡而言之，您的整個受眾中有很大一部分無法以您的方式訪問您的網站。

昂貴的？ 不，事實上它回到了設計標準，因為這是真正的基本東西。

您可以採取以下十個步驟來確保您的網站可訪問。

#1。 讓您的網站易於使用

我不需要告訴你們如何設計。 但是這三個關鍵原則將幫助殘疾用戶：

1. 使網站易於閱讀和理解
2. 使網站易於瀏覽
3. 使網站易於在移動設備上使用

這將使您接近可訪問性，它們還將幫助搜索引擎也喜歡您的網站！

我用來測試網站的屏幕閱讀器就像谷歌機器人（除了盲人技術首先出現）。

#2。 使用無障礙軟件進行測試

您知道 PC 具有輔助導航和閱讀屏幕的輔助軟件嗎？ 您可能知道，但您是否也知道移動設備的核心內置了輔助功能軟件？ 該軟件可以閱讀給人們，包括那些有視力障礙的人：

• Apple (iOS) 使用 VoiceOver；
• Android 使用對講；
• Windows 使用講述人。

幾乎所有的網站設計師都在模板中包含一個菜單，但 95% 無法使用上述任何技術閱讀！ 這些無障礙服務中的大多數都無法識別菜單存在，因為它的編碼不正確。 大多數情況下，問題在於菜單編碼不佳或標記不清晰。

值得將一些網站加載到您的手機中並打開輔助功能。 查看您網站的菜單是否有效。

#3。 不要全部寫大寫

這可能是任何人都可以對其網站進行的最基本更改：不要全部大寫。

這是經過科學測試和證明的，因為任何人都很難閱讀所有大寫字母！

在菜單項和按鈕中可以找到最過度使用的大寫字母。 如果您使用常規大寫正常書寫，您正在幫助傳達您的信息，除非您有特定的設計目的 - 例如品牌或徽標。

#4。 清楚地解釋您的鏈接

“閱讀更多”或“單擊此處”按鈕不會告訴 Google（或使用屏幕閱讀器的用戶）鏈接背後的內容。 只需將您的鏈接脫離上下文，看看它是否有意義。 頁面中間的“閱讀更多”對你有什麼意義嗎？閱讀更多是什麼？

#5。 使用良好的對比風格

這並不意味著扼殺你的內容——它意味著讓視力受損的人更容易。 這裡有一個提示...將您的手機屏幕調到一半並嘗試閱讀網站。 它在光明和黑暗中看起來如何？

#6。 使用“跳轉到內容”鏈接

想像一下在閱讀主要內容之前點頭 30 次！ 如果您不允許有閱讀障礙的人跳過菜單，他們必須這樣做。 實際上，使用標題標籤也是如此，H1 到 H4 可以幫助搜索引擎和閱讀障礙者瀏覽您的網站。

哦，不要隱藏屏幕外的鏈接！ 視力受損的人經常使用放大鏡並手動查找這些鏈接（而不是通過鍵盤）。

#7。 停止使用彈出窗口

至少，停止使用那些我們無法按“esc”來擺脫的東西。 您知道我們的軟件基本上無法進入那些彈出框嗎？ 通常我們最終會閱讀盒子後面的內容 - 它在您看來是灰色的，但對我們來說卻不是。

如果您要使用彈出窗口：

• 製作它們，以便可以使用“esc”按鈕將其關閉。
• 製作它們以便我們的軟件可以讀取框，而不是後面的文本。
• 提供查找內容或填寫表格的替代方法的詳細信息 - “或訪問我們的 xxxx 頁面了解更多詳細信息”。

#8。 文本調整大小在某些情況下可能很有用

就個人而言，文本調整大小遠不如跳轉到內容鏈接重要。 這是因為有閱讀障礙的人（包括老一代）會使用 windows 放大鏡或一些專業產品 - 例如縮放文本、魔術眼或其他免費軟件。 在我的經驗文本中，調整大小通常會破壞移動內容 - 甚至比捏或使用核心移動輔助功能更不敏感。

此外，通過自適應技術調整文本大小，用戶可以將其關閉和打開，以便他們可以在屏幕上找到自己（一些縮放，因此他們一次只能看到屏幕的 1/8）。 也就是說，文本調整器可能仍然是相關的，值得為政府網站投入使用——只是對我來說不是前 10 名優先事項。

#9。 使用字體圖標而不是圖像圖標

使用放大鏡的人一次只能看到大約 1/8 的網站，而使用手機的人通常會通過點擊“閱讀器”按鈕來加載圖像免費版本。 我可以寫一篇關於大多數“圖像圖標”在最大縮放時像素化到極端的事實的帖子，但字體圖標不會（好吧，反正沒有那麼多）。

#10。 添加視頻腳本

如果 YouTube 視頻完全無聲，則將其放在網站上是沒有意義的，也沒有任何意義將一個沒有文字記錄或聽力障礙者遵循的方式的視頻放在網站上。 這就像擁有全球受眾或客戶群，但只提供日語信息。

只是為了好玩，獲取一個沒有語音的技術 YouTube 視頻，然後閉上你的眼睛。 注意——閉上你的眼睛不會復制失明，因為你可以再次睜開它們，但這是一個有趣的練習。

無障礙資源

這些網站提供了檢查您的網站的指南和工具：

• Web Aim 可訪問性檢查器
• 澳大利亞政府網頁內容無障礙指南
• W3C 驗證器。 請注意，W3C 驗證器會返回許多不必要的錯誤。 您需要判斷每個錯誤是否值得麻煩。

這些站點提供了屏幕閱讀器，您可以使用它來測試您的桌面站點：

• 語音工作訪問 (JAWS)
• 艾平方提供免費試用版
• Window Eyes - 屏幕閱讀器
• NV Access 提供完全免費的非可視桌面輔助 (NVDA) 屏幕閱讀器

注意：我不推薦 Sitecues：它不是我所說的易於安裝或對有打印障礙的人有效的東西。

結論

像任何事情一樣，在功能和嚴格遵守規則之間存在平衡。 我的客戶網站都不是 100% 可訪問/符合 W3C 的。 它們是可訪問的 - 並且搜索引擎友好。 它們合乎邏輯且對比鮮明，但也具有影響力的風格和特徵。

全世界有多少人有閱讀障礙？ 有多少潛在客戶？

無論您是在 Joomla、Drupal、WordPress、純 HTML 還是任何其他平台上構建網站，我希望我已經讓您相信，對於您的企業和您的客戶來說，這個問題值得認真對待。