讓你的設計深刻人心--可用性設計

讓你的設計深刻人心--可用性設計

 

　　機械工業出版社的《大巧不工》一書提到「可用性設計」理念，這一設計理念實在精妙，對咱們web前端設計修煉啓發很多。

　　書中這樣寫到：

「
　　　　在可用性工程中，對軟件質量的衡量一般能夠用五個屬性來表示：有效性、效率、可記憶性、容錯性及易學性。
　　　　
　　　　·有效性
　　　　　　主要代表軟件是可用的，能幫助用戶準確地實現他們的目標。

　　　　若是用戶不能實際完成他們想要作的事情，不管體驗長仍是短，都是沒有意義的。

　　　　·效率
　　　　　　是用戶完成的速度。若是用戶要完成某項任務，須要經過N次點擊、刷新、錄入才能實現，

　　　　那麼用戶會主觀地判斷它的使用效率低。

　　　　·可記憶性
　　　　　　即軟件界面、交互方式等方面能給用戶留下很深的印象，

　　　　而且使用的時候不會有挫敗感，可以以一種愉快的心情使用。

　　　　·容錯性
　　　　　　體如今產品防止錯誤的程度和幫助用戶解決錯誤的能力上。

　　　　·易學性
　　　　　　應對不一樣層次的軟件用戶，能讓初學者快速轉變爲專家，又不影響專家的使用交互。

　　　　
　　　　把握可用性設計包括在用戶體驗設計中，要把我可用性設計方法，最基礎的仍是要把握可用性設計的本質概念——對用戶友好。

　　　　
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　」

 

像我這樣挑剔而又正常的用戶世間少之又少。結合書上內容，加上幾點本身這些年的見解，這篇文章應運而生。

1，別讓我思考

　　怎麼讓網站容易使用，「別讓我思考」可謂可用性第必定律。

　　某一次我遇到手機上面的提醒：點擊確認是使用WLAN下載，仍是使用移動網絡下載？糾結中，很久都作不了決定。
　　　　　　　　　　　　　　　　　　

　　下載門戶。混亂繁雜的廣告，網頁竟然出現了六個下載連接，是想人滾蛋，仍是快點關閉網頁的節奏嗎？
　　　　　　　　
　　

　　讓咱們產生疑問。然而，這些用戶的思考都是強迫性的，讓人很不舒服。最好的解決方案是，從客戶角度思考，即使用戶不具有任何的計算機操做基礎，也可以獨立天然地完成下一步操做
　　
　　小點：
　　1，鼠標移至可點擊鏈接或按鈕時，應顯示爲「手」圖標。文本編輯圖標」 I 」,會讓用戶沒法辨析這是連接仍是文本，這是圖片仍是按鈕。同時，按鈕是交互的基本元素，應使按鈕具備陰影和漸變效果，也就是立體感。推介幾句CSS3樣式代碼，可以經過單純的樣式代碼設計出以往要用photoshop加工過的圖片才能實現的立體按鈕。
　　
　　　　　　　　
　　下載連接：http://wenku.115.com/preview/?pickcode=a4r6r295i6rxth4pf，其餘顏色請本身設置

 

2，中止你的假設

　　對用戶友好，從用戶角度思考，並不表明咱們把本身看成用戶來思考。
　　
　　咱們在構建站點時，總會有一些本身編制的想法，經常把本身看成用戶來進行假設，而真實的狀況每每與咱們的想象相差甚遠，這就是所謂的思惟定式。

 

　　例如，電子商務提交訂單時，最後要求用戶填寫郵政編碼。若是用戶不太清楚本身的郵政編碼是否正確，即使輸入了郵政編碼在提交訂單的時候也會有所猶豫，尤爲第一次在該網站購物，由於用戶都有這樣的顧慮：萬一郵政編碼寫錯了，貨物會不會寄不到這裏？

　　前端很理智，明確了寄快件是要郵政編碼，可是用戶不理解。事實上，網頁能夠從後臺經過用戶點擊收貨地址的多級下拉框信息，處理數據，得出郵政編碼。

　　　　　　　　

　　再如，前端開發出高新的N多級菜單，在爲本身的技術沾沾自喜，用戶只會以爲這個網站很混亂，很難找到本身想要的內容。

同時多級菜單，嵌套多個html標籤，增長了維護的難度：

　　　　　　
　　在通常狀況下，咱們右手快速地滾動鼠標滾輪，一邊快速地掃視頁面上的信息，而後選擇感興趣的一條鏈接，點進去。咱們爲用戶悉心準備的貼心提醒，舒適提示，都有可能被忽略。咱們是否有這樣的經歷，做爲遊客去瀏覽某個網站，咱們都是隻關注本身的信息，其餘的內容對於咱們來講都是模糊的。
　　
　　用戶實際的操做狀況比咱們設想中的要無序和簡單，咱們設想中的用戶顯得更加理性，有條理，注意力集中。

　　　　　　　　　　
　　針對這種狀況，有如下幾個方法避免這些主觀臆測的事情發生：

　　2.1 層次清晰
　　
　　頁面要有清晰的視覺層級，這樣能夠保證用戶可以在短期內熟悉你的頁面
　　不能保證每一個用戶都能熟悉業務流程，嚴格按照設計人員所但願地去操做。所以除了要提供引導性信息和搜索功能外，對於邏輯上或者業務上關聯性高的部分進行整合，不一樣邏輯性的內容間也要有明顯的分界。

　　某公司網站下底部連接，層次很清晰，不過黑乎乎的一團，看得好累呀。

　　　　　　　　　　　　　　
　　導航連接應該更加精簡，有優先級區分，不一樣優先級的連接應該有所區別，這樣才能讓用戶快速定位本身想要的信息。導航是網頁的靈魂，若是用戶在你的站點迷路了，那他必定會選擇離開。

　　我在開發某網站時，設計主導航的事後，料想到網站的篇幅過大，假若用戶對當前頁面不感興趣，想跳轉到其餘頁面，就須要先點擊右下角的「回到頂部」按鈕，而後找到頂部的導航欄。可是不少時候，對於絕大部分用戶來講，當前頁面不感興趣就關閉網頁，其餘精彩的有用的內容就被忽視掉，同時這就使得網站流失了大量潛在的客戶。爲解決這一點，我特地設置左側導航欄，當用戶滾動頁面，錯過頂部導航欄時，左側導航欄出現，在必要時引導客戶前往其餘頁面。

　        

　　　　
　　2.2 尊重習慣
　　
　　尊重習慣給咱們帶來好多好處，無需浪費文字描述，就能夠把一些事情交代清楚。
　　好比，百度註冊頁面上，表單對輸入的信息進行及時的反饋，用戶驗證碼正確，直接顯示一個綠色小溝就能夠了，無須要經過文字提醒用戶應該怎麼填寫驗證碼。

　　
　　又好比，電子商務網站上面有購物車功能，只須要一個簡單的手推車圖案就能把不少事情交代清楚，無需太多文字解釋。
　　

　　  或者 
　　另外就是一些組件的分佈，例如導航欄應該在頂部，公司信息應該在腳部。用戶習慣他們在哪裏，他們就應該在哪裏，這樣用戶不須要考慮就能找到他們，對於功能複雜，信息量大的網站更應該注意這一點。
　　

3，明確能點擊的內容

　　讓用戶知道哪些內容是能夠點擊的，這一點與上文所提到「別讓我思考」的「小點」不謀而合，這裏就不贅述了。
　　

 

4，我在哪裏

　　保持一種清晰視覺線索，保證你能夠清楚你如今所在的位置。
　　導航所指向的當前頁面應該與其餘未被激活的頁面樣式上有所區分。

　　

　　麪包屑導航，它能夠告訴你從主頁到當前頁面的詳細路徑，這種導航方式能偶讓用戶以爲本身位於強大而又精細的導航系統中，用戶想回到上一層次，只須要當中的一條連接。

　　

　　

　　百度知道上對導航的變形：

　　　　　　

　　天貓購物步驟：

　　

　　
　　表單在各類網站中的做用不言而喻，小到用戶登陸用戶註冊，大到填寫報表，錄入信息系統數據，表單的可用性，直接影響用戶對網站的總體印象
　　表單編輯的內容過多，建議分頁進行填寫，但必須清楚告訴用戶當前正在編輯的表單處於第幾部，這樣用戶能夠清楚知道本身處在什麼狀態，流程還有多久就結束。一樣地，填寫表單的時候要提供有效的簡潔的提示信息

 

 

5，應對不一樣層面的錯誤

試過在註冊某個網站的時候，忽然提示「系統異常，請聯繫管理員」。這是究竟是什麼緣由形成的呢 ？若是隻是小問題，我本身能解決爲何還要我勞師動衆驚動管理員，還要話幾天時間等管理員郵件回覆呢？沒有明確的錯誤提示，會讓用戶鬱悶，甚至是絕望。好的軟件不但能讓你流程地使用，聰明的網站不會讓你由於某次失敗的操做而責怪本身，認爲本身太笨不能摸索軟件功能的特性，咱們應該引導用戶想正確的方向去操做，這樣你就能很天然地完成正確的選擇，即使出現錯誤，可能很好地處理錯誤和異常，徹底感受不到本身犯錯。

百度，對錯誤的提示：

　　　　　　　　　　

　　應對不一樣層面的錯誤，如下幾點要注意的 ：
　　　　1，設計有用的信息提醒，解釋問題發生的緣由
　　　　2，針對出現問題的環節，給用戶可行的解決方案，告訴用戶下一步要作什麼
　　　　3，給維護人員考慮，保留相應的提示，讓維護人員更好地定位問題。

　　　　前兩點能都保證良好的交互體驗，最後一點則可以縮短解決問題的時間，有效控制維護網站的成本。

 

6，提供必定的輔助功能

 

提供相關的服務，例如記錄女性生理週期App給用戶提供一個溝通交流平臺，讓用戶在討論圈內交流隱私經歷和想法，交換備孕和生育經驗；大學生的課程表App爲不一樣學校的同窗開闢一個交流空間，爲同窗們課下提供交流平臺。提供的這些功能延長了用戶在軟件上逗留的時間，活躍的交流平臺，豐富的瀏覽信息，使得App的功能不只僅停留在單調的基礎層面。

 

　　　　　　　　　　　　　　　　　　

 

 

 

　　　　總結，在這樣一個用戶需求日益變化，而互聯網資源及其豐富的時代，如何才能吸引用戶，如何才能創造價值？設計時遵循以用戶爲中心的設計原則是不錯的思路。

 

 

 -----------------------------------------------------------------------------------------------------------------------------------------------------

 

在我編程進步路上，我前端成長的路上，感謝全部學術指導性網站，感謝我所閱讀過的書刊的做者們，感謝大家的一路陪伴，我會加倍努力，堅持下去，作得更好。