在用戶體驗(yàn)這個(gè)行業(yè),經(jīng)常會(huì)聽到,可用性,可訪問性這樣專業(yè)的名詞,但是,事實(shí)上在很多產(chǎn)品實(shí)現(xiàn)過程里都忽略了這一點(diǎn)!WHY?
舉個(gè)很簡單的例子,用戶的注冊流程,很多交互設(shè)計(jì)師在做這塊流程設(shè)計(jì)的時(shí)候都無可避免的忽略了部分可用性和可訪問性,直白點(diǎn)說,產(chǎn)品的應(yīng)用場景沒有cover全用戶群,損害了這部分用戶的可用性和訪問性。
太抽象?不明白?好,那我們就用戶注冊流程展開,侃侃流程中用戶提交表單的設(shè)計(jì)。
看上圖,這是現(xiàn)有支付寶注冊流程中的一塊功能,要實(shí)現(xiàn)的功能很簡單,個(gè)人用戶直接填寫注冊信息,是企業(yè)用戶的話,就先選擇企業(yè),再填寫注冊信息,最后提交表單,完成操作。流程早就發(fā)布上線了,看上去很和諧,但是不然……
不然在哪里呢?應(yīng)用場景,沒錯(cuò),您答對(duì)了。交互設(shè)計(jì)師在設(shè)計(jì)這個(gè)流程的時(shí)候忽略了一些場景,沒有考慮到那些客戶端對(duì)JavaScript不支持或支持不好的用戶。做個(gè)實(shí)驗(yàn),打開支付寶的注冊頁面,然后禁用腳本,你會(huì)發(fā)現(xiàn),不論怎么搞,你都無法點(diǎn)出企業(yè)類的注冊信息了!OK,現(xiàn)在明白了吧,企業(yè)類的用戶在這種場景下基本上就game over了,搞不好還會(huì)再來上一句“FT,支付寶真TMD難用。
聽到這里,或許很多交互設(shè)計(jì)師坐不住了,“這不是前端開發(fā)工程師要去考慮的嗎?”,我認(rèn)為要這樣來理解,如果單純的從前端開發(fā)的角度而言,這種實(shí)現(xiàn)方式是無可厚非的。什么做法?對(duì)的,要說明一下……
實(shí)現(xiàn)方案1: 采用css樣式設(shè)置企業(yè)注冊信息的容器默認(rèn)為隱藏,當(dāng)用戶點(diǎn)選企業(yè)后通過js腳本改變?nèi)萜鞯碾[藏屬性為顯示。
實(shí)現(xiàn)方案2: 通過腳本控制企業(yè)注冊信息的容器的初始狀態(tài)為隱藏,當(dāng)用戶點(diǎn)選企業(yè)后通過腳本改變?nèi)萜鞯碾[藏屬性為顯示。
一般情況下,前端會(huì)有兩種實(shí)現(xiàn)方案,拋開可訪問性,光從Developer這個(gè)層面上來選擇的話,我選第一種,F(xiàn)在的注冊流程中用的也是這個(gè)方案。
討論一下這兩個(gè)方案吧,各有優(yōu)缺點(diǎn),但是今天我們討論的是可用性和可訪問性,所以很顯然第一種方案是不可取的。那為什么前端開發(fā)工程師還是選擇了她呢?自然也有他的道理,如果采用第二種方案的話,勢必要在頁面結(jié)構(gòu)加載完成后,再去初始化要隱藏的容器,當(dāng)客戶端網(wǎng)速不佳的情況下,會(huì)先顯示企業(yè)注冊信息的內(nèi)容,幾秒后又不見了,體驗(yàn)上有所折扣。但是就可用性和可訪問性而言,是無懈可擊的。假設(shè),當(dāng)前用戶環(huán)境禁用了腳本,那么他訪問這個(gè)頁面的時(shí)候,企業(yè)注冊信息不會(huì)被隱藏,會(huì)顯示在當(dāng)前頁面上,易用性可能有一些缺失,但是功能上是可訪問可用的,整個(gè)流程是健全的。相比兩種情況,我想我會(huì)選擇采用方案2。當(dāng)然如果你不屑可用可訪問性,那就磚頭砸我吧!
很多交互設(shè)計(jì)師都會(huì)想當(dāng)然的認(rèn)為,類似這樣的應(yīng)用場景受重群體是很小的,也許真實(shí)的數(shù)據(jù)會(huì)讓你大吃一驚!總而言之,多為用戶想想,是設(shè)計(jì)師最起碼的職業(yè)道德!
可用性和可訪問性的重要還能表現(xiàn)在很多應(yīng)用上,如語音閱讀器,手機(jī)瀏覽器等,這些在ppk談javascript中有比較詳細(xì)的描述,有興趣的話,可以查閱《ppk談javascript》?偠灾Z義化的頁面結(jié)構(gòu)在以后互聯(lián)網(wǎng)產(chǎn)品的可用性和可訪問性中起著非常重要的作用!
說到這里,我相信看懂的都應(yīng)該明白可用性和可訪問性是咋會(huì)事了,除了明白,你是不是也看到了一些問題呢?沒錯(cuò),絕對(duì)是有問題的,交互設(shè)計(jì)和前端開發(fā)過程中都存在的問題,專業(yè)化路線絕對(duì)不是單一的,專業(yè)化cover的度很重要!
本文鏈接:http://m.95time.cn/design/doc/2009/6374.asp
出處:Alibaba.com UED
責(zé)任編輯:bluehearts
|