Godzilla. 2018-10-23 網(wǎng)站建設(shè)

為您的Web設(shè)計(jì)過(guò)程帶來(lái)可訪問(wèn)性

互聯(lián)網(wǎng)本質(zhì)上是各行各業(yè)的人們可以參觀的地方。殘疾人面臨的物理障礙在網(wǎng)上減少了。遺憾的是，許多人在網(wǎng)絡(luò)上遇到了新的障礙：內(nèi)容不是為了訪問(wèn)而設(shè)計(jì)的。

　　作為網(wǎng)頁(yè)設(shè)計(jì)師或開(kāi)發(fā)人員，您可以解決這些問(wèn)題，增加受眾群體，甚至提高搜索排名。關(guān)于創(chuàng)造完美頁(yè)面的靈感來(lái)源，通常這些問(wèn)題都有一個(gè)簡(jiǎn)單的解決方案，對(duì)您的設(shè)計(jì)影響不大 - 如果您愿意發(fā)揮創(chuàng)意。

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

　　可訪問(wèn)性指南很廣泛，但這里有一些重要的建議。無(wú)論出于何種原因，在您的網(wǎng)站設(shè)計(jì)中包含所有指南可能是不可行的，這沒(méi)關(guān)系。

　　目標(biāo)不是打破網(wǎng)站的核心功能或設(shè)計(jì)，而是避免不必要的排除。包括盡可能多的優(yōu)化，這對(duì)您正在設(shè)計(jì)的網(wǎng)站是明智的。

　　2、優(yōu)化視覺(jué)障礙

　　到目前為止，您最大的任務(wù)在于改進(jìn)視覺(jué)設(shè)計(jì)。擁有不友好的顏色或?qū)Ρ榷鹊木W(wǎng)站可能會(huì)導(dǎo)致有困難的人混淆或頭痛。

　　.使用高對(duì)比度文字應(yīng)該是暗的或足夠輕的，以便于閱讀。白色的淺灰色文字可能很時(shí)髦，但對(duì)于低視力的人來(lái)說(shuō)，它幾乎是不可見(jiàn)的。

　　.考慮包括大文本模式，或可以修改字體，大小和樣式的菜單。

　　.避免使用閃爍和明亮，重復(fù)模式和其他癲癇觸發(fā)器 - 特別是未經(jīng)同意。這些不僅令人討厭，而且非常危險(xiǎn)。

　　屏幕閱讀器的友好性應(yīng)該是首要任務(wù)。有更多的屏幕閱讀器最佳實(shí)踐，但這里有一些要記住的事項(xiàng)：

　　.某些UI類(lèi)型（例如隱藏在其中的按鈕的下拉菜單）不兼容。

　　.始終使用lang屬性指定語(yǔ)言。

　　.用標(biāo)題組織內(nèi)容。

　　.定義ARIA地標(biāo)以便于導(dǎo)航。

　　.必要時(shí)提供非可視替代方案，例如使用圖像alt標(biāo)記。

　　3、不要僅通過(guò)視覺(jué)，聲音或顏色傳達(dá)信息

　　上海網(wǎng)站設(shè)計(jì)認(rèn)為不應(yīng)該說(shuō)紫色文本放在藍(lán)色背景上是一個(gè)可怕的想法，不僅僅是對(duì)于色盲用戶，還有其他問(wèn)題你可能沒(méi)有意識(shí)到。

　　.始終包含顏色以外的指示燈?？ㄔ诒韱紊系娜瞬粫?huì)欣賞錯(cuò)誤框周?chē)?ldquo;簡(jiǎn)約”紅色突出顯示，如果沒(méi)有其他視覺(jué)指示的話。

　　.同樣，避免單獨(dú)使用聲音或圖像進(jìn)行導(dǎo)航。

　　.包括視頻的音頻記錄或字幕。

　　.使用圖像alt標(biāo)記，并包含非文本內(nèi)容的文本版本。

　　4、使您的網(wǎng)站易于瀏覽和理解

　　網(wǎng)絡(luò)已經(jīng)轉(zhuǎn)向簡(jiǎn)化，這對(duì)于那些需要易于瀏覽的網(wǎng)站的人來(lái)說(shuō)非常棒。但是，仍然存在許多阻止可訪問(wèn)性的常見(jiàn)錯(cuò)誤。它通常歸結(jié)為保持清晰一致的設(shè)計(jì)。

　　.使用可預(yù)測(cè)的導(dǎo)航元素。如果您在一個(gè)頁(yè)面的頂部欄中有鏈接，而在另一個(gè)頁(yè)面上有側(cè)欄，那么您只會(huì)引起混淆。

　　.需要盡可能少的機(jī)動(dòng)來(lái)繞行，例如使用粘性導(dǎo)航欄。

　　.使互動(dòng)元素脫穎而出。

　　.標(biāo)記和定義點(diǎn)擊目標(biāo)（框，鏈接，表單）。不要讓它們變小，難以按壓。

　　.您的網(wǎng)站應(yīng)該只能通過(guò)鍵盤(pán)導(dǎo)航。永遠(yuǎn)不要禁用焦點(diǎn)指示器。

　　.用清晰易懂的文字書(shū)寫(xiě)，或提供更簡(jiǎn)單的版本。

　　.提供一種排除多余CSS的布局模式。

　　.提供有用的錯(cuò)誤消息，解釋出現(xiàn)了什么問(wèn)題以及如何解決問(wèn)題。

　　.創(chuàng)建響應(yīng)式網(wǎng)站或設(shè)計(jì)移動(dòng)版本。

　　5、使Web可訪問(wèn)

　　這些只是關(guān)于如何讓每個(gè)人都可以使用您的網(wǎng)站的一些建議。如果可能，請(qǐng)讓殘疾人測(cè)試您的網(wǎng)站，或使用工具模擬色盲，屏幕閱讀器等。

　　世界上有15％的人有殘疾，現(xiàn)在是時(shí)候創(chuàng)建一個(gè)滿足每個(gè)人需求的網(wǎng)站了。最后，如果許多網(wǎng)站采用這些標(biāo)準(zhǔn)，我們將共同創(chuàng)建一個(gè)更好，更具包容性的互聯(lián)網(wǎng)。