為 Web 設計優化的內容密集頁面的技巧

已發表: 2018-05-22

在線內容的呈現對於網站的可用性至關重要——如果用戶不能立即找到他所尋找的信息,他很可能會離開。 由於這個事實,許多網頁設計師和用戶體驗專業人士堅持認為每個頁面都應該包含有限的內容,但在許多情況下這根本是不可能的。 一些網站旨在顯示大量內容,設計師別無選擇,只能應對額外的挑戰。

值得慶幸的是,有一些技術可以在這方面有所幫助。 雖然每個網站都是獨一無二的,成功的設計不能盲目複製,但可以依靠 UX 行業的集體經驗來獲得更好的結果。 以下提示可以提供一些指導,如何在不壓倒訪問者的情況下處理內容繁重的頁面:

研究什麼有效——什麼無效

用戶體驗設計可能不是一門精確的科學,儘管用戶反應的某些模式比你想像的要穩定。 這就是為什麼每個優秀的用戶體驗設計師都會花費大量時間來探索競爭對手在做什麼。 你永遠不知道在哪裡可以找到一點靈感,因為有時在另一個網站上看到的一個細節可以引發一個原創的想法。 研究反面例子同樣重要,這樣你就知道要警惕哪些類型的錯誤以及要避免哪些組合。 當然,上下文很重要,因此有必要權衡示例的來源以及它將如何在您所針對的特定利基市場中發揮作用。

使用內容框和邊框

使內容更易於管理的最明顯方法是將其分成更小的塊。 如果這些內容單元通過邊界線、內容框或類似的設計技術在視覺上與頁面的其餘部分分開,它們將更容易處理和理解。 這與不同類型的內容有關——文本的關鍵段落應該放在一個單獨的框中,而這或多或少是對所有圖像進行的標準操作。 注意為視覺分隔符使用兼容的樣式,否則多樣性可能會混淆並否定積極效果。 每個內容框都應該有它的標題和/或描述,這樣一目了然就可以更容易地了解它的真正目的。

為每種內容類型創建單獨的部分

一個組織良好的頁面將引導讀者從上到下進行旅程,以精心挑選的順序提供結構化信息。 但是,一些訪問者只是跳過頁面,尋找特定條目或試圖快速了解內容。 由幾個明確標記的部分組成的頁面在這兩種情況下都更加用戶友好,可以加快快速搜索並為需要深入解釋的專用用戶提供更好的內容流。 理想情況下,每個部分應主要由同質內容組成——例如,文本部分後跟數據表,但這並不是一成不變的,取決於可用內容的性質。 這種模型的例子可以在各個行業中找到。

突出顯示關鍵信息和鏈接

即使在擁擠的頁面上,智能設計也會找到方法來表明內容的哪些部分最值得關注。 這可以通過多種方式實現,從使用顏色突出顯示到分層內容放置。 此過程的第一步是識別最重要的元素及其在整個內容結構中最自然的位置。 一旦明確了需要傳達的內容,設計師就可以搜索適當的視覺語言,將訪問者的注意力引導到選定的部分。 所選擇的技術將取決於所傳達信息的類型——數字數據可能最適合放在表格中,而描述性文本可以以項目符號列表的形式呈現。

適度使用多媒體

我們都知道多媒體內容比純文本更具表現力,但這也是在單個頁面上放置大量內容時要非常小心的另一個原因。 太多的圖像或視頻在沒有任何分類的情況下擠在一起可能會阻止用戶尋找他們可能感興趣的內容。 對於經常發布大量照片或視頻的網站,保持適當的平衡並提供清晰的分類和上下文描述非常重要。 交互元素應該謹慎使用,並且只有在有意義時才使用——在每個部分的頂部放置一個調查問題只會讓用戶感到厭煩。

不要忘記空的空間

處理大量內容的設計人員通常很想將其包裝得非常緊密以節省空間,但這在幾乎所有情況下都是一個嚴重的錯誤。 當視覺元素彼此過於靠近時,它們會干擾用戶的感知並降低單個元素被注意到的機會。 在每個文本框或圖像周圍留出足夠的可用空間可能會增加頁面的滾動長度,但如果訪問者仍然感興趣,這將不是問題。 在閱讀大量文本時,間隔佈局還可以減少疲勞,這是提高可讀性和優化頁面以面向大眾受眾的另一種方式。

像用戶一樣思考

每個 UX 設計指南都會告訴你,如果對用戶不實用,最漂亮的佈局就毫無意義。 要創建一個真正引起觀眾共鳴的頁面,您應該設身處地為用戶著想,並從該角度考慮每個設計功能。 導航系統應該以這種思維方式開發,允許從一個關鍵區域快速直觀地跳轉到另一個關鍵區域。 為了進一步幫助用戶,可以根據要求通過鼠標懸停文本和“閱讀更多”鏈接等工具提供附加說明。 頁面上的標題和副標題應該簡單直觀,因為過於復雜或模糊的語言可能會阻止一些用戶進一步查詢。 最後,頁面應該具有清晰可辨的可操作元素,以便用戶本能地知道在哪裡單擊以啟動操作。