網站設計中如何做好引導設計模式?

引導設計模式從字面意思理解就是在一個網站上引導用戶瀏覽網頁，很多人想到，網站也需要做這樣的設計嗎?又不是去什么風景區(qū)怎么也需要引導設計模式，其實，如果你的網站網頁非常多，那還真的非常有必要的，但是如果是一般的企業(yè)網站，可能也沒什么必要，因為頁面二十多個也就夠用了，對于一些大型門戶網站來講，卻是非常有必要的，很多邏輯性非常強的頁面同樣也是非常重要的。很多時候，我們去一些政府類型的功能性網站，經常會在網站信息中找不到自己想要的內容，斑駁的網站中各種信息和功能交雜在一起，顯得網站亂糟糟的，用戶在瀏覽網頁的時候根本不清不楚有時候為了找一個表格下載下來也要浪費很長時間，這也體現到了網站引導設計的重要性。網站引導設計可以減少用戶的流失，能夠讓用戶盡快找到其所需的東西，網站中的引導是存在于用戶與目標之間的一條直線，讓用戶與目標之間建立有效聯(lián)系，減少不必要的時間和精力消耗。網站引導設計之前一定要對網站做一個整體的分析，根據用戶對互聯(lián)網的了解程度可區(qū)分為新手型用戶和專家型用戶。新手型用戶對互聯(lián)網的了解程度比較低，理論上引導過程應盡量詳細，讓其感受到濃厚的人文關懷。一般來說此類用戶使用網站比較迷茫，不明白自己想要做什么，只會吸引感興趣的內容。而專家型用戶對互聯(lián)網了解程度較高，已然不需要過多的引導，只要能傳達出網站產品的特色、核心功能即可。此類用戶點擊網站的目的明確，只會關注自己所需要的。引導設計大致分為三個類型，如下：全局式引導：這個類型的引導比較常見，也是不對用戶了解程度有要求的的一種引導方式。全局式引導的好處在于可以明確且清楚的去突出產品，給用戶留下深刻的印象，也方便用戶快速上手操作，接受度會得到明顯的提高。局部式引導：也被稱作備注式引導。這個類型通常會在注冊頁面或登陸頁面時出現，例如知乎網的引導框，提示用戶新的變化，引導用戶點擊查看。向導式引導：也被稱作為分步驟引導。這是將復雜繁瑣的操作過程進行分段，告訴用戶此項操作總數共有多少項，此時已進行到哪一步，以及后邊的進程。人的心理總是傾向于目標明確、結構清晰的對象，讓用戶能夠清晰的見到整個過程，有兩個作用：一是引導用戶。此種引導方式在京東網、各大支付平臺、各大網銀平臺或者較為復雜的網絡平臺時顯得尤為重要。用戶可能是首次接觸到這個網站，對于如何操作仍是一知半解。此時能夠有一個清晰的導向示意圖，讓其可以一步一步操作，會提升客戶極大的心理信任。二是給用戶心理依賴感和安全感。用戶傾向于執(zhí)行自己知道終點的操作。小結：引導模設計的效果就是在潛移默化中進行，讓用戶毫追隨并接受你的引導。三個引導方式并不是孤立存在的，而是相輔相成、互相襯托。在不同的情況下應選擇不同的方式。

網站設計—異常情況和處理方式有哪些?

在設計中異常指的是除了正常狀態(tài)之外的情況，舉個例子，假如你要設計一個下載按鈕，那么下載按鈕需要有幾種狀態(tài)呢?正常狀態(tài)下需要提供的下載按鈕的狀態(tài)應該有：點擊下載(下載前)正在下載(或者是下載中、已下載59%等描述)下載完成如果你在設計中只提供了這三種下載狀態(tài)是不夠的(其實有部分新手設計師，只提供了點擊下載這種狀態(tài))。還應該考慮如果下載中出現了斷網，或者是用戶暫停下載等情況的時候應該怎么處理呢?這就是異常情況。所以除了前面三種狀態(tài)，還需要提供繼續(xù)下載，下載失敗等狀態(tài)。下載完成后，現在的設計一般是會自動安裝的，此時顯示安裝中，如果不自動安裝還需要提供安裝操作，安裝完成后提供打開的操作。當然這里面包含的異常狀態(tài)主要是暫停后的繼續(xù)下載、下載失敗等。下圖就是我做的下載按鈕，可以看到其實很多狀態(tài)如點擊下載、下載完成、安裝、打開等在視覺表現上是一樣，只是文本不同。即使是這樣，這些應有的狀態(tài)無論是交互設計師還是視覺設計師都應該給出的，不然程序員會不知道哪一種情況用什么形式的按鈕。主要包含以下7 種情況：與網絡環(huán)境等有關的：下載失敗、服務器出錯、斷網，網速過慢、加載失敗、網絡連接失敗(wifi密碼正確，連接不成功);空狀態(tài)：搜索結果為空、無瀏覽記錄、無收藏、無購買記錄、無訂單記錄、無下載記錄等;表單類異常：密碼錯誤、輸入字符太少，數量超額，賬號密碼等不符合相應規(guī)則、賬號過期、必填項未填寫(提示并定位)、必填項的輸入字符為空等;時效性：二維碼/驗證碼的過期/失效處理，例如具有實效性的鏈接，二維碼等;限定值：上傳文件超過限定大小、操作過于頻繁(刷新頻繁，點贊、抖一抖，戳一戳等，需給出友好提示);不可用：賬號不存在、賬號過期、選項不可選、按鈕置灰等;其他：外接設備連接失敗(如遙控器、音響、手機等)、斷電/電量過低、安裝失敗;2.用戶在操作中是感受不到這種異常，并且對用戶的操作有較小影響的。其實在一些登錄、支付、提交等按鈕，還有一種「不可用」的狀態(tài)，用戶未輸入信息時，登錄按鈕置灰，只有當用戶輸入相應的信息后，按鈕才高亮。二、異常情況的匯總通過上面的例子，相信已經充分了解到設計中的異常是什么，以及異常的處理方式，那么接下來總結一下設計中常見的異常情況。異常情況處理其實分為兩種情況。兩種異常情況處理1.界面中有明顯的提示，需要用戶了解此情況的，并且影響用戶進行下一步操作的。主要是用戶切換任務引起的異常：如按 home鍵突然退出/切換應用、返回鍵退出、下載過程退出等。以上就是在設計中常見的一些異常情況匯總，看到這里，可能很多朋友就要說了，這么多，我怎么記得住。我個人的建議是：如果你熟悉上面的這些異常的話，其實在設計類似的模塊時就會考慮到相應的情況;如果你不熟悉這些，你可以把文章描述的異常情況當作一個檢查表，設計到相應的模塊時，可以參考是否會出現上方的情況。三、異常處理接下來分析一下這些異常情況的處理方式，按異常方式來處理。與網絡環(huán)境等有關的：下載失敗、服務器出錯、斷網，網速過慢、加載失敗、網絡連接失敗(wifi密碼正確，連接不成功)1.下載失敗一般需要給出明確的下載失敗提示，可以通過彈窗、Toast、列表等提示。如下圖所示，然后給出用戶下一步的操作提示，例如重試、重新下載、刪除等操作。2.空狀態(tài)搜索結果為空、無瀏覽記錄、無收藏、無購買記錄、無訂單記錄、無下載記錄等。其實空狀態(tài)很好理解，就是頁面沒有內容時，空頁面一般會提示用戶當前頁面的空狀態(tài)，同時也可以做適當的引導。例如在影視類App中，如果觀看記錄為空，則可以為用戶推薦影片，如熱播影片、猜您喜歡，其他人都在看等熱門推薦供用戶選擇。不過如果無法確定你推薦的用戶是否喜歡，不建議做推薦。3.表單類異常密碼錯誤、輸入字符太少，數量超額，賬號密碼等不符合規(guī)則、賬號過期、必選項未填寫(提示并定位)、必填項的輸入字符為空等。4.時效性二維碼/驗證碼的過期/失效處理，例如具有實效性的鏈接，二維碼等。實效性比較多的體現在二維碼、付款碼、驗證碼等有時間限定的情況下才有效的情況，通常失效之后需要重新刷新，手機的篩選操作通常是點擊或者是下拉刷新;PC端的通常好似點擊，TV 端的是按「OK」鍵刷新。如下圖所示為 QQ 的掃碼登錄頁面和 UC瀏覽器的手機登錄頁面。5.限定值上傳文件超過限定大小、操作過于頻繁(刷新頻繁，點贊、抖一抖，戳一戳等，需給出友好提示)對于文件過大無法上傳、下載這種建議都是采取彈窗的方式告訴用戶當前狀況，明確問題并且加上操作提示。如新媒體管家中的導入的word 的文件不能超過10M的提示如下左圖所示。對于操作過于頻繁，比較常見于 QQ 中的抖動窗口，其實在一些電視頁面的手機截圖工具中，刷新太頻繁也會彈出Toast 提示。6.不可用賬號不存在、賬號過期、選項不可選、按鈕置灰等。賬號不存在用于登錄時，輸入的賬號不在已注冊的賬號中，則會提示此賬號不存在，是否立即注冊等。7.賬號過期APP 或網站中，登錄賬號后，如果太久不使用，則會有過期的期限，設計師需要根據 APP的具體情況設置登錄過期的時間期限，此時需要提醒用戶重新登錄。主要有 Toast和彈窗兩種方式提示，這需要根據賬號過期對用戶的影響大小來決定用哪一種方式。如下方左圖所示，登錄賬號過期對用戶使用此應用的影響不大，則可以采用 Toast輕提示的方式處理;如下方右圖，如果不登錄賬號則無法使用此應用的功能，則需要采用彈窗強提示的方式，提示用戶去登錄。8.選項不可選主要包含當前的選項中有不可選的選項，還包括在不達到某種條件情況下，無法使用此功能的按鈕等。9.其他外接設備連接失敗(如遙控器、音響、手機等)、斷電/電量過低、安裝失敗。外接設備連接失敗需要提示，如果知道連接失敗原因，建議給出原因。斷電情況通常用于 PC端和 TV端，斷電后需要為用戶恢復文件。很多設計軟件都有這個功能，一旦軟件無響應或者其他異常情況導致文件出問題，一般都會提供恢復文件。安裝失敗后需要提供提示安裝失敗原因，如存儲空間不足、文件已損壞的提示。10.用戶切換任務引起的異常較多如按 home 鍵突然退出/切換應用、返回鍵退出、下載過程退出。11.服務器出錯服務器出錯的頁面常見的500、501、502、503、504、505 等 5 開頭的頁面。其中這些錯誤的解釋如下：500 內部服務錯誤：顧名思義500 錯誤一般是服務器遇到意外情況，而無法完成請求;501 服務器不具備完成請求的功能;502 Bad Gateway錯誤;503服務器目前無法使用(由于超載或停機維護);504 Bad Gateway timeout 網關超時;505 服務器不支持請求中所用的 HTTP協(xié)議版本。服務器異常時，在網頁端的處理方式為提示+返回，在移動端的處理方式為提示+重試，下圖是一些普通的處理方式。近幾年，很多網站和應用將這種異常頁面設計的相對美觀和有故事性一些，提升了整體的趣味性，減少用戶的焦慮。例如網絡被外星人劫走了之類的，相信大家也看過很多。這里就不舉例子了。12.網絡異常斷網、網速過慢、網絡連接失敗(wifi密碼正確，連接不成功)其實都是屬于網絡異常的情況，加載失敗有時是網絡速度慢造成的，有時可能是IIS(Internet Information Services互聯(lián)網信息服務)空間不足。下圖是一些網絡異常情況下的處理方式。如果網絡異常之前應用沒有緩存之前的頁面的內容，則整體提示用戶網絡異常，也可以提供一個操作指導用戶操作;如果網絡異常之前頁面已經緩存則顯示之前的頁面，Toast輕提示用戶網絡異常，此類異常建議用戶再次打開時，回到上次用戶離開前的狀態(tài)。如果數據被清理，則回到上次保存的數據頁面中。四、總結文章主要總結了設計中常用的異常情況，并且給出了相應的解決方案，最長用的規(guī)則就是給出異常提示+下一步操作提示，既明確了出錯原因，又指引用戶下一步操作，用戶是相對容易接受的。

網站名稱：網站設計中如何做好引導設計模式?
網址分享：http://muchs.cn/news/62127.html

網站建設、網絡推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網站制作，網絡營銷seo公司；服務項目有網站設計等

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)