如何科學地劃分移動網站和完整版網站的分界線

出版圈郭志敏發表於2013-06-17

現在經常能聽到人們對下面這個問題爭論不休:移動使用者對他們在手機上可做之事的期望值越來越高,因此削減內容或功能不可避免會讓他們感到失望。持這種(有缺陷的)觀點的人認為,向包括移動使用者在內的所有人都顯示完整版網站是個更好的主意。

這個觀點存在缺陷的原因是,它假設你只能在全功能的桌面網站和功能較少的移動網站之間二選一。然而,就算存在缺失的功能或內容,任何遵循那些可用性原則的移動網站也都會提供指向完整版網站的連結。所以如果需要,使用者可以找到任何資訊。

設計的挑戰在於如何科學地劃分移動網站和完整版網站的分界線,使移動使用者的絕大多數需求都能在移動網站中得到滿足。如果實現了這一目標,則順著連結進入完整版網站而產生的額外互動成本將可以忽略不計。

沒錯,我們的確見過一些功能低下、設計差勁、幾乎不能滿足任何人需要的移動網站。但是因錯誤解讀某條可用性原則而導致糟糕的設計,並不代表就可以忽略這條久經驗證的可用性原則。(就像你不會把孩子連同洗澡水一起潑出去一樣。事實上,如果因一些糟糕的使用者介面而怪罪整個設計門類,Web根本就不會存在。網上到處都有看上去完全缺乏可用性的網站,但這並不妨礙我們遵循那些被爛網站所違反的原則而設計出良好的網站。)

正確的分析應該是這樣的。

  • 就絕大多數任務而言,移動使用者在一個設計良好的移動網站上獲得的體驗將遠勝於完整版網站。

  • 就極少數任務而言,移動使用者將會因為轉至完整版網站所產生的額外點選而被略微耽擱一些。

如果一件事的利經常發生而弊很罕見,那麼人們會很容易接受它。

另一種反對建立移動網站的觀點認為,你可以從一開始就對完整版網站進行優化,使其適合移動應用,然後就可以直接將這個“完整版”網站提供給移動使用者而不用擔心會給他們帶來不便。話雖說得沒錯,但這個觀點卻忽略了此做法將給桌面使用者帶來的不良影響:儘管有了更大的螢幕,更好的輸入裝置(見下文附註欄內容“輸入方式比拼:滑鼠和手指”),你為他們提供的卻是不夠理想的介面。如果桌面使用者佔少數,這也許可以接受,但絕大多數網站從桌面使用者這裡得到的流量遠多於移動使用者,從成交量的角度看則差距更大。因此,雖然我們希望為移動使用者提供服務,卻不能忽視桌面使用者,畢竟我們收入的大部分來自他們。

以下是桌面和移動端之間一些重要的區別。

  • 兩者提供的內容應該是不同的:小螢幕要求更簡明的文字,因為缺乏上下文關係影響了人們對其意思的理解。

    (是的,人們可以在Kindle或其他平板電腦上閱讀小說,但是這主要指那些有著易於追蹤的線性情節的簡單虛擬類作品。在小螢幕上閱讀商業性的內容或其他需要更高認知處理過程的非虛擬類作品是比較困難的。)

  • 不僅是文字,其他內容也應當設計成適合相應媒介的樣式。舉個例子,與大尺寸圖片不同,小圖片應當進行特殊的裁切和縮放以突出重點細節部分。僅僅簡單地拉伸尺寸以填充不同大小的螢幕空間是不夠的。[相應的例子參見3.1.3節,該節討論瞭如何針對移動螢幕上某張韓國流行音樂組合的圖片進行階段式設計(design iterations)。]

  • 對資訊架構(information architecture,以下簡稱為IA)做出修改,在移動網站裡將次要內容移至二級頁面,這一點我們將在第4章中討論。

  • 根據手指和滑鼠輸入存在的差異設計不同的互動手段(見下文附註欄內容“輸入方式比拼:滑鼠和手指”)。

  • 在移動端,需要簡化功能集合以降低複雜性和適應小螢幕。

我們的基本觀點是什麼?桌面端的使用者介面平臺和移動端在許多方面有所不同,包括互動手段、人們的閱讀方式、操作的上下文關係和掃一眼就能瞭解的內容數量。這種不平等是對稱的:移動使用者需要和桌面使用者不同的設計。同樣重要的是,桌面使用者也需要和移動使用者不同的設計。

輸入方式比拼:滑鼠和手指

桌上型電腦和膝上型電腦使用滑鼠作為主要的輸入方式,移動裝置和平板電腦使用人的手指作為主要的輸入方式。

沒錯,有時候那些更大的電腦會附帶軌跡球,膝上型電腦使用者也時常使用觸控板進行輸入,一些移動裝置甚至還自帶手寫筆。但是滑鼠和手指是當前流行使用者介面所用的主要輸入方式,所以我們就比較一下這兩者的區別。

表2-2對不同的輸入方式進行了比較。粗體文字的單元格意味著相應的指點方式在某一方面表現更好。

以下是對該表的幾點重要說明。

  • 迴歸時間(Homing time)是指將手從一種輸入裝置(比如鍵盤)移動到另一種裝置(比如滑鼠)所需的時間。
  • 加速運動的意思是指點裝置的移動速度和螢幕中游標的移動速度可以存在非線性的關係:快速移動滑鼠會導致螢幕游標加速移動;如果緩慢移動滑鼠,螢幕游標則會減速移動,從而使高精度定位成為可能。
  • 當我們說基本無需學習就能使用手指操作觸控式螢幕時,其實是假定使用者可以自如地使用自己的手和手指。嬰兒就需要好幾年才能掌握這一技能。

這張表告訴我們的是:沒有哪種輸入方式具有壓倒性優勢,滑鼠和手指都有著自己的強項。

當為某種平臺設計UI時,很重要的一點是發揮出相應輸入和輸出方式的優勢,並儘量掩蓋其劣勢。

舉個例子,因為滑鼠有個懸停狀態,所以在桌面電腦上經常被用於工具提示和其他翻轉樣式,且效果不錯。類似地,帶兩個鍵的滑鼠可以很容易實現上下文選單(context menus)。而在觸控式螢幕上,這些設計元素就顯得不那麼自然了。

滑鼠和觸控這兩種輸入方式各具優勢,這也是應當為桌面網站和移動網站以及桌面應用程式和移動應用設計不同UI的一個主要原因。

其他支援兩種UI的理由還包括桌面電腦自帶實體鍵盤(讓輸入更快,不容易出錯)、螢幕尺寸存在巨大差異等。

表2-2 滑鼠和手指輸入方式的比較

滑鼠手指
精度
同時點選數量1通常是1,多點觸控下可以達到2~3
控制裝置數量3:左/右鍵,滾輪1
迴歸時間
狀態種類懸停,按鍵按下,按鍵彈起手指按下,手指提起
加速運動
適合在大螢幕顯示器(30英寸或更大)上使用是,因為有加速否,手臂會疲勞
可見的螢幕游標
遮擋視線否,因此視覺反饋是連續的
適合移動使用是,不用額外攜帶裝置
直接與螢幕互動,用起來“有趣”否,屬於間接指點裝置
支援輔助功能
易於掌握較容易基本無需學習

本文摘自即將上市的《貼心設計:打造高可用性的移動產品》

可用性測試鼻祖Jakob Nielsen最新力作《貼心設計》,關注移動裝置上的高可用性,讓你的產品設計一目瞭然、人見人愛!

我們如何才能為今天的智慧手機和平板電腦使用者設計出最棒的網站和應用?如何在受到限制的小型裝置上創造出讓人滿意的使用者體驗?

本書就如何為你的客戶或業務制定移動戰略以及如何針對小螢幕進行設計和寫作提供了至關重要的洞見。書中所採用的基於使用者資料的方法將會幫助設計師、軟體開發者、作家、編輯、產品經理和廣告主理解該如何為他們的客戶製作移動網站和應用,以及如何順應移動應用的未來趨勢來改善使用者體驗。

這本新的指南重點關注移動裝置(主要是智慧手機和觸屏手機)上的可用性,還涵蓋了構建移動戰略、為小螢幕設計、移動寫作、可用性對比和展望未來等主題。書中內含228張高清全綵圖片以表明觀點。

這本指南基於專家評議和多項國際調研,展現了移動世界的全貌。參與者從學生到早期技術使用者不等,還有用各種移動裝置訪問網站的商務人士。

enter image description here

相關文章