首頁?>?知識(shí)?資訊?>?如何創(chuàng)建一個(gè)無障礙網(wǎng)站?>?正文

如何創(chuàng)建一個(gè)無障礙網(wǎng)站

2019/5/31 0:00:00 · 稿源:傳誠信

作為網(wǎng)站設(shè)計(jì)或開發(fā)人員,您可以解決可訪問性,增加受眾群體,甚至提高搜索排名。通常這些問題都有一個(gè)簡(jiǎn)單的解決方案,對(duì)您的設(shè)計(jì)影響不大。
該準(zhǔn)則無障礙是廣泛的,但這里有幾個(gè)關(guān)鍵的建議。無論出于何種原因,在您的網(wǎng)站設(shè)計(jì)中包含所有指南可能是不可行的,這沒關(guān)系。目標(biāo)不是打破網(wǎng)站的核心功能或設(shè)計(jì),而是避免不必要的排除。包括盡可能多的優(yōu)化,因?yàn)槟谠O(shè)計(jì)的網(wǎng)站是合理的。

網(wǎng)站制作

  • 優(yōu)化視覺障礙
    到目前為止,您最大的任務(wù)在于改進(jìn)視覺設(shè)計(jì)。擁有不友好的顏色或?qū)Ρ榷鹊木W(wǎng)站可能會(huì)導(dǎo)致有困難的人混淆或頭痛。使用高對(duì)比度; 文字應(yīng)該是暗的或輕的,以便于閱讀。白色的淺灰色文字可能很時(shí)髦,但對(duì)于低視力的人來說,它幾乎是不可見的。
    考慮包括大文本模式,或可以修改字體,大小和樣式的菜單。
    避免使用閃爍和閃爍,重復(fù)模式和其他癲癇觸發(fā)器 - 特別是未經(jīng)同意。這些不僅令人討厭,而且非常危險(xiǎn)。屏幕閱讀器友好性應(yīng)該是一個(gè)優(yōu)先事項(xiàng)。有更多的屏幕閱讀器最佳實(shí)踐,但請(qǐng)注意以下幾點(diǎn):

    某些UI類型(例如隱藏在其中的按鈕的下拉菜單)不兼容。
    用標(biāo)題組織內(nèi)容。
    定義ARIA地標(biāo)以便于導(dǎo)航。
    alt必要時(shí)提供非可視替代方案,例如使用圖像標(biāo)記。
    W3C可訪問性標(biāo)準(zhǔn)

  • 不要僅通過視覺,聲音或顏色傳達(dá)信息
    不應(yīng)該說紫色文本放在藍(lán)色背景上是一個(gè)可怕的想法,不僅僅是對(duì)于色盲用戶,還有其他問題你可能沒有意識(shí)到。始終包含顏色以外的指示燈??ㄔ诒韱紊系娜瞬粫?huì)欣賞錯(cuò)誤框周圍的“ 簡(jiǎn)約 ”紅色突出顯示,沒有其他視覺指示。
    同樣,避免僅需要聲音或圖像進(jìn)行導(dǎo)航。包括視頻的音頻記錄或字幕。使用圖像alt標(biāo)記,并包含非文本內(nèi)容的文本版本。不要僅通過視覺,聲音或顏色傳達(dá)信息。

網(wǎng)站制作

  • 使您的網(wǎng)站易于瀏覽和理解
    網(wǎng)絡(luò)已經(jīng)轉(zhuǎn)向簡(jiǎn)化,這對(duì)于那些需要易于瀏覽網(wǎng)站的人來說非常棒。但是,仍然存在許多阻止可訪問性的常見錯(cuò)誤。它通常歸結(jié)為保持清晰一致的設(shè)計(jì)。
    使用可預(yù)測(cè)的導(dǎo)航元素。如果您在一個(gè)頁面的頂部欄中有鏈接,而在另一個(gè)頁面上有側(cè)欄,則只會(huì)導(dǎo)致混淆。
    需要盡可能少的機(jī)動(dòng)來繞行,例如使用粘性導(dǎo)航欄。
    使互動(dòng)元素脫穎而出。
    標(biāo)記和定義單擊目標(biāo)(框,鏈接,表單)。不要讓它們小而且難以按壓。
    您的網(wǎng)站應(yīng)該只能通過鍵盤導(dǎo)航。永遠(yuǎn)不要禁用焦點(diǎn)指示器。
    用清晰易懂的文字書寫,或提供更簡(jiǎn)單的版本。
    提供一種排除多余CSS的布局模式。
    提供有用的錯(cuò)誤消息,解釋出現(xiàn)了什么問題以及如何解決問題。
    創(chuàng)建響應(yīng)式網(wǎng)站,或設(shè)計(jì)移動(dòng)版本。
    使您的網(wǎng)站易于瀏覽和理解
    使網(wǎng)站可訪問

最后,如果許多網(wǎng)站采用這些標(biāo)準(zhǔn),我們將共同創(chuàng)建一個(gè)更好,更具包容性的互聯(lián)網(wǎng)。

  • 相關(guān)推薦
  • 大家在看
熱文
  • 熱門
  • 最新
客戶服務(wù)
咨詢熱線

010-62199213

24小時(shí)咨詢熱線

139-1050-5354