您是否熟悉盲人和視力障礙用戶一般如何上網?您可能從未想過它,但由于各種技術和工具,他們能夠像任何非弱勢群體一樣閱讀消息、回復電子郵件和訂購專用服務器。然而,總有一個大問題——網絡必須是可訪問的,并且在沖浪時不應構成任何不必要的障礙。雖然這并不一定意味著網頁必須以黑白設計并且看起來像 90 年代。相反,它只是一個令人愉快和實用的設計,一個合理的網頁結構和合適的顏色,每個人都會欣賞。我們讓 Web 更易于訪問的 11 個技巧部分基于 WCAG 規則,部分根據用戶體驗設計的一般技巧(即所謂的 UX)進行調整。
1. 書面內容
為了使文本更易于理解,即使對于在捷克人口中占大約 1% 到 2% 的圖形不通者來說,遵循幾條原則也非常重要。文本應該主要是明確的并且由白話語言書寫。所有這些可能成為專家的新詞都使文本的易讀性及其隨后的理解惡化。也應避免使用縮寫詞,尤其是那些鮮為人知的縮寫詞。
文本的組織和凝聚力似乎更為重要。合乎邏輯的,不太長的段落,理想情況下不會在行尾完成,而是提供足夠長的間隙,應該被認為是理所當然的;因此,讀者有一些可以返回的線索和檢查點。
當談到 Web 可訪問性時,在 HTML 代碼中遵循正確的語義符號也很重要。例如,在插入列表時,需要使用特定的標簽 <ul>、<ol>、<li>,并且在特殊文本的情況下,一些適當的標簽類型 <strong>、<code>、<abbr> 和 <塊引用>。
對于所有用戶來說,背景和文字有一個合適的對比度會更令人愉悅。明亮背景上的深色字體是最常見的字體,反之亦然。更清晰的文字既省力又省能源,因為在光線不好的條件下,必須提高顯示器的亮度。
2. 標題和標題(H1-H6)
另一個方面是使用標題和標題;它們不僅對更合乎邏輯的文本組織產生巨大影響,而且它們可能有助于盲人更好地導航。大多數閱讀設備都提供標題和標題的結構化列表作為文本內容,這顯著簡化了網站上的文本定位。
此外,它們的使用可能會帶來令人愉快的營銷獎勵,因為由于標題和標題,搜索引擎會找出文章的內容。結果,在搜索時,您可能會在結果中升級,從而增加網絡流量。
3. 一個可訪問的控件
使用輔助技術瀏覽網頁的殘疾人在很多方面受到限制;因此,他們很難控制頁面上的一些交互元素。例如,盲人根本不需要使用鼠標,因為幾乎不可能指示光標的位置。因此,為了讓他們可以訪問網絡,只使用鍵盤進行瀏覽的可能性至關重要。
當應用充分突出顯示的元素時,網絡上的文本方向也變得更容易(見下圖)。高光應提供足夠的對比度——不僅僅是柔和的變亮或變暗——尤其不應僅與鼠標移動有關。在 CSS 中實現這個功能只需要幾分鐘,但對于普通網站訪問者來說,文本方向也更加愉快。
閱讀設備用戶會喜歡跳過單個部分的選項,尤其是在每個站點上重復的部分。網絡導航系統可能由大綱、錨點鏈接(網站上的立足點)和隱藏在網站開頭的鏈接(所謂的跳過鏈接)組成;最后但同樣重要的是,在 HTML 中使用某些元素和角色的網站限制也可能會有所幫助。
輪播或所謂的旋轉橫幅,通常顯示新聞和關鍵信息,可能意味著潛在的問題。因此,當可以停止當前網站上的橫幅時,對于有視力障礙和沒有視力障礙的人來說都更實用。
一般來說,有必要遵守可訪問性的基本原則——如果您在網站上插入任何特殊元素,請始終確保它對有缺陷的用戶來說是易讀的,并且可以通過鍵盤控制,因此可以指定元素的類型、描述和狀態以及元素的內容。還要注意指令明確依賴于對某個元素的識別,例如“為了繼續,指示所有方塊”或“聽到聲音信號,立即單擊按鈕”。
4. 音視頻
創建視聽文本腳本當然需要時間,因此很明顯通常沒有足夠的時間來這樣做。但是,如果您堅持使用完全可訪問的網絡,則在音頻和視頻的情況下,這是最簡單的方法。
此外,成績單也可能適合有障礙和無障礙的人。因此,他們不會被迫瀏覽整個播客和視頻來查找信息項。最后但并非最不重要的一點是,成績單可以防止用戶潛在的技術問題。
有些視頻帶有字幕。有必要考慮他們是否真的能夠提供足夠的信息。如果你選擇普通的翻譯字幕,你應該確定聾人和聽力障礙者能夠聽到一切,因為翻譯字幕很遺憾不顯示誰在說話,而且大多不包括非語言的聲音,如鈴聲鐘聲和炸彈爆炸;結果,觀眾可能會錯過一些重要的信息。
這就是為什么聾人使用所謂的隱藏字幕將角色的聲音用顏色分開并且還涉及其他關鍵聲音。顯然制作這樣的字幕更加困難,但為了完全理解內容,這似乎是必要的。
5. 使用的外部玩家
使網絡更具吸引力的一種流行方法是使用來自 YouTube、Soundcloud 和其他類似視聽服務器的外部內容。除了播放器代碼,建議也上傳原始來源的鏈接,以確保可訪問性。經常發生的是,在原始版本中通常有更多功能可以使內容易于訪問。其中,可以使用自動生成的字幕。
然而,仍然需要檢查插入的播放器是否至少包含基本控件,即播放/暫停,以便使用鍵盤快捷鍵控制它。然而,永遠不要在外部和/或所有視聽媒體中使用自動播放。對于有殘疾和沒有殘疾的人來說,這可能會讓人非常不愉快和困惑,特別是對于盲人來說,它會破壞網站中的文本方向。
6. 圖片、圖表和圖表
圖片總是需要替代文本或標題。兩者都可以用,但文字不要重復,最好互相補全。然而,不僅圖片而且機器難以辨認的圖表和圖像圖表都應該在替代文本中包含特定圖形元素特征的信息的事實摘要。對于沒有替代描述的盲圖像按鈕和其他圖像控制元素可能是一個特殊的復雜問題。在這些時刻,盲人可能會被卡住,因為他們不知道他們應該做什么以及他們有什么選擇。
在網絡上使用圖形驗證碼時,請用聲音替代完成它。有視力障礙的人會欣賞它。貴公司的基本信息,例如名稱、聯系方式和地址,不應以圖像的形式出現,而應以文本的形式出現。一般來說,所有訪問者都會感謝能夠以文本形式簡單快速地復制信息。
7.色彩對比
大約 8% 的男性和 1% 的女性發現很難識別不同深淺的顏色。除非信息表達了某種信息,否則在許多情況下它變得不可訪問。例如,原本看起來井井有條的彩色圖形,在黑白中可能會顯得混亂。在下圖中,您可以看到紅色和綠色的對比度看起來幾乎相同,因此幾乎不可能將圖例與切片相匹配。
使用黑白和單色屏幕可能代表一個非常相似的問題。因此,在創建類似的圖形和圖表時,請確保它們在彩色和無色的變化中都易于理解。
8. 其他圖形問題
大多數網站都遵守有關網站上按鈕和其他元素位置的某些習慣,例如右上角的“登錄”、左上角介紹性網站上的單擊矢量徽標以及標題中的社交網絡鏈接。遵守這些習俗將使您的網絡更易于訪問,并將簡化所有人的文本導向。
閃爍的元素通常也會對用戶造成不適,而不會造成損害。有認知障礙和注意力障礙的人會覺得這種閃光沒有吸引力,不會妨礙他們集中注意力。特別是癲癇患者,對于他們來說,它可能會造成嚴重的癲癇發作威脅,他們會欣賞它的缺席。總而言之,應完全避免閃光元素。
網站上的裝飾性動畫可能看起來很有趣,但對于有視力障礙和注意力障礙的人來說,這會讓人感到困惑,并使網絡上的文本定位變得困難。
9.超文本鏈接
不是很好定義的鏈接是一個常見的缺陷,可訪問性。為殘障人士準備的各種閱讀設備可以只顯示鏈接,從而忽略其他文本。當使用諸如“閱讀更多,更多信息請點擊這里”之類的通用文本時,訪問者絕對沒有機會找出鏈接指向的位置以及它所關注的內容。
因此,鏈接的文本應該包含最恰當的描述,說明它會將訪問者引導到哪里。另一種選擇是添加一個替代描述,該描述清楚地傳達有關超文本鏈接所指內容的信息,從而確保該鏈接可從上下文中理解。
然而,足夠了,這也適用于超文本鏈接。因此,如果文本太長,搜索變得更加困難。因此,當鏈接文本從不以相同的字母開頭時,主要對閱讀設備用戶來說更方便;那么返回文本也將更容易。
10. 表格
填寫表格需要精確。對于盲人,以及有視覺和認知障礙的人來說,這可能在三個方面很困難;首先,文本框標簽,尤其是強制性標簽,必須是獨特的,并且使用輔助技術可以訪問,以便用戶能夠識別他們到底在寫什么。在實踐中,HTML Web 代碼必須與表單元素綁定,例如編輯字段和復選標記按鈕,以及下方的說明。
當涉及到錯誤消息時,可能會出現另一個問題。如果是主要目的是發送用戶機密信息的表單,用戶應該可以退出發送該表單;因此,可以提前防止發送錯誤填寫的表格和/或有錯誤的表格。
11. 文件
在許多文章和說明中,可能會偶然發現不發布 PDF 和/或 DOCX 內容文件的建議,而是直接作為文本發布。但在實踐中,這些不應被視為理所當然。相反,網絡可能會變得更加難以訪問。因此,最好將信息作為文件下載,并且在 pdf 中時,始終確保它也包含文本部分。此外,當前的 Word 和 Acrobat Reader 版本具有集成的訪問控制功能。