做爰三级在线播放_又大又粗又猛又舒服又爽_暖暖www免费高清视频最新期_午夜精品aaa国产福利

信息無障礙研究與應用

2020-11-25    資深UI設計者

互聯網設計師如何著手發起無障礙優化?

信息無障礙,是指任何人在任何情況下都能平等地、方便地、無障礙地獲取信息和利用信息。隨著互聯網覆蓋越來越廣,對于身體有局限的群體而言,更加迫切通過互聯網獲取信息,而這就需要互聯網產品進行信息無障礙的優化。在我國其受益人群至少包括:8500多萬殘障人士,2億多60歲以上的老年人,數量龐大。率先考慮信息無障礙能為產品增加優勢而帶來更多用戶。


如今智能手機掀起了一場無障礙輔助工具的革命,而站在這個關鍵點的互聯網設計師,也要開始行動起來,先從以下這幾個容易實現的事情開始著手進行無障礙的優化吧。




關于讀屏


對視障用戶來說,是用聽取讀屏語音來了解你設計的界面信息的。讀屏軟件就像他們了解互聯網世界的眼睛,它的原理是直接讀出界面里的文字,如果icon按鈕未加無障礙標簽讀屏會讀為"無法發音",那么視障者就無法獲取這些信息,自然也就無法使用你設計的功能。


解決的辦法是:


1.需要在產品代碼中添加無障礙標簽(Android :contentDescription ; iOS:accessibilityLabel在對應的開發者文檔里很容易找到,可以發給你合作的研發同學)。


2.裝飾性icon可隱藏標簽不讀,提升讀屏效率。不建議不做處理也不加標簽,那么用戶聽到的就是“無標簽”,這樣會讓用戶以為這里有什么重要信息讀不到而感到不安。


3.標簽語義簡短準確,盡可能使用動詞。


4.必要時需要走查焦點順序,確保不會被錯誤的焦點順序誤導頁面含義。 



并且最好由設計師進行語義的標注,因為設計師才是對頁面里圖形應用最了解的人。避免出現“搜索”被寫成“放大鏡”、或者是“searchBtn_123”之類的情況。 





關于色彩


顏色可以用來區分信息數據的類別和維度,也可以幫助傳達情緒等重要信息。然而,世界上有超過8%的男性和0.4%的女性都被色覺障礙的問題困擾。我們通?;\統的稱這類人群為“色盲”,他們是典型的識別顏色有問題的群體。


"色彩"的目標是"易于感知",指的是互聯網產品的內容信息的色彩對任何人來說,都應該擁有足夠高的辨識度和舒適度,我從以下4個方向進行介紹。 

 

1.更安全的配色


a.色盲人群:


設計師在進行設計配色時應時刻自測,避免明度相似的橙黃綠兩兩配色和明度相似的紅綠配色,因為這樣的配色勢必會造成色盲用戶的可讀性問題。并且,紅色在紅綠色盲眼中并不是一種明亮醒目的顏色。相反紅色對他們來說顯得非常深,而暗紅色則幾乎接近黑色。因此色盲人士很難分辨出文章內的深紅色的強調字,從而遺漏關鍵信息(設計時,可利用此插件模擬色盲眼中的顏色:Color Oracle) 。




b.文化差異:


因為色彩在不同國家文化中代表不同含義,所以對于國際用戶來說也是存在障礙的。在西方文化里,紅色通常用于表示消極趨勢,而綠色則表示積極趨勢,但在東方文化中卻正相反。


c.特殊群體:


臨床醫學研究表明對于部分自閉癥患者來說,高飽和高對比度的顏色,甚至只是黃色都會讓他們感到不舒服和不安,因此在自閉癥康復中心是不會出現過于對比刺激的顏色的。


另外,老年群體隨著年齡的增長,晶狀體變黃變渾濁,會選擇性的吸收藍光,從而導致老年人對藍色的鑒別能力下降明顯,如果你的主流用戶是老年人,請盡量避免將藍色運用到重要的按鍵中去。



2.更強的文本對比度


文本對比度與可讀性息息相關,它測量的文本顏色和背景色之間的明度差。WCAG AA對于文本對比度的規范是:4.5:1,若字號夠大(>18pt,或粗體>14pt)時,標準可降到3:1。如果滿足4.5:1這個標準會讓你的頁面視覺看起來不那么優雅,可以嘗試局部加強可視性的方法:



關于可讀性其他需要注意的點:盡量不要在圖片上疊加文字,除非你能保證圖片背景顏色單一且對比度足夠高。



Material Design設計規范建議,需要淡淡的遮罩確保上層文字的可讀性;并且不建議極高對比度的文本,因為這樣會使一部分視障者看到的字旋轉模糊。


 

3.更多樣的視覺變量 


顏色是數據可視化中最常用的視覺變量之一。但是對于無法辨別顏色的用戶,如果顏色作為的唯一的提示信息,他們可能將無法理解你傳達的信息。那么有什么改善的方法呢?


a. 不讓顏色成為唯一的視覺變量:除顏色外,我們可以追加圖標、紋理或者文字來加以標注。



b.色盲模式:Trello作為一款工具產品,在標注信息時,提供色盲模式可打開和關閉,并用不同紋理加以區別,色盲友好模式是一個很好的范例,它可以有效幫助色盲,又不會妨礙非色盲用戶。


c.以明度飽和度為度量:雖然色盲人士對色相的辨識能力較弱,但卻對明度、飽和度非常敏感。我們可以使用明度或飽和度區分信息??催@個例子:傳統熱力圖習慣用暖色代表熱力高冷色代表熱力低,Google Analaytics的熱力圖采用深藍色顯示熱度高的時段、淺藍色顯示熱度低的時段,簡單有效。




關于控件


控件可以是按鈕、鏈接、輸入框或任何帶有事件監聽器的HTML元素。控件太小或彼此太靠近可能會給用戶帶來糟糕的體驗問題。


比如對于無法用指尖定位的用戶(有顫抖疾病的用戶),或因年齡而導致靈活性降低的老年用戶,都會難以點擊過小控件。


為了給用戶足夠的間距來準確選擇控件,Material Design建議至少48×48dp,iOS設計系統將目標熱區尺寸最小值定為44 x 44pt,而WCAG對WEB的規范則建議至少44×44px。一個控件可以在視覺上是24 x 24px,但是在所有邊上都會有一個額外的填充使它達到44×44px。并且太靠近的控件可能會因誤點擊而帶來挫敗感,所以同時還建議控件之間的空間足夠遠以減少誤觸。Microsoft給pc的建議是至少有8px的間距,而Material Design推薦的控件至少間隔8dp。我們可根據以上規范來審視自己設計的控件。




關于文字


1.文字大?。?/strong>


有視覺障礙的用戶可能會把字號調得很大。你需要保證你的設計在大字號的情況下內容不會溢出或排版錯亂。做設計的時候,可以使用2倍以上的字體測試你的設計。


在互聯網早期,設計了字號在9-14px之間的網頁,如今已與20年前不同,瀏覽器已經可以在任何尺寸設備上使用,小到智能手表大到4K熒幕,我們不能再使用固定的字號來設計產品了。字號應該與設計本身一樣具有響應性。例如可以允許用戶自定義字號、行高或字間距等以達到舒適的閱讀水平。


 

2.文字樣式:


文字作為傳達信息的重要載體,對于許多用戶來說,裝飾字體或草書字體都是比較難閱讀的。且用過細的、過小的、斜體和全大寫文本,也會降低識別度。




關于動效


有效的動畫可以給頁面帶來生命感,但如果濫用動效不僅會分散用戶注意力,嚴重的話對某些用戶來說來說可能是致命的(光敏性癲癇的臨床誘因之一就是閃光圖像的刺激)。


1997年的一天,日本電視臺正在播放《精靈寶可夢》第38集“電腦戰士3D龍”,但就在這天晚上發生了600多名兒童昏倒在家中集體送醫事件,轟動了動畫界,任天堂的股價也隨之大跌。原來,為了達到震撼效果,3D龍的背景運用了“藍-紅-藍”的快速閃爍來表現爆炸,這樣高頻率的閃爍刺激了孩子們脆弱的眼睛,導致他們集體患上了急性光敏癥。也因為這件事日本開始著手對動畫片的制作制定規范。Twitter在2019年為了保護對閃爍圖像敏感的人員安全,也采取了禁用APNG動圖格式的措施。


另外WCAG 2.3.3官方說明,一些用戶會因滾動頁面的動效(例如緩動和視差滾動)而觸發大腦前庭疾病從而產生頭暈的癥狀,所以iOS、Mac、Windows 10都具有關閉動效的功能。


為了避免給特殊人群造成困擾,設計師在開始做動效之前,應該看看以下四條是否滿足:


1.動效每秒閃動不超過3次,發生的閃光區域不超過超過25%否則,光敏癲癇患者會有發病的風險。


2.避免過于夸張的視差和運動效果,因為大腦前庭失調者會引發眩暈。


3.避免有多個元素通過不斷移動、閃爍而分散注意力,因為這可能會讓注意力缺陷者產生困擾 。


4.如果有上述情況,需提供一些控件或選項來暫停、隱藏或者更改任何動畫或效果的頻率。




結語


作為體驗設計師,研究無障礙會讓我們收獲良多。當然,目前所做的改進并非一勞永逸,而是我們與更廣范圍的用戶保持持續對話的開端。不斷改進產品的無障礙體驗,讓產品更友善,讓美妙的互聯網的世界變得更平等,我們希望能不斷向這一目標前進。


文章來源:站酷   作者:百度MEUX

藍藍設計91whvog3.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務

日歷

鏈接

個人資料

藍藍設計的小編 http://91whvog3.cn

存檔