尼爾森出品!掌握 9 種網(wǎng)頁掃描模式和 7 個設(shè)計建議
原文引自 Rita Kind-Envy 的文章 《People Don’t Read Online—They Scan. This Is How to Write for Them》,該譯文并非完整原文,內(nèi)容已做刪減和調(diào)整,并加入了部分譯者觀點。
尼爾森諾曼集團(Nielsen Norman Group)? 是一家在用戶體驗領(lǐng)域深受大眾信賴的用戶體驗研究和咨詢公司,該公司基于眼球追蹤技術(shù)?,監(jiān)測用戶如何通過視覺感知線上的圖文頁面,獲得了人眼瀏覽網(wǎng)頁的行為數(shù)據(jù)。實驗發(fā)現(xiàn),人眼在網(wǎng)頁獲取信息時更多的是“掃描”而非“逐字閱讀”,并總結(jié)出人眼在網(wǎng)頁閱讀時常見的 9 種掃描模式。本文將詳細介紹 9 種掃描模式,同時基于常見掃描模式給到了 7 個更好進行網(wǎng)頁信息傳遞的建議。
內(nèi)容概覽:
- 掃描的定義
- 9 種網(wǎng)頁掃描模式
- 7 個提升網(wǎng)頁信息傳遞效果的建議
- 結(jié)論
一、掃描的定義
“尼爾森諾曼集團”發(fā)現(xiàn)人眼在網(wǎng)頁獲取信息時更多的是“掃描”而非“逐字閱讀”,以下是關(guān)于掃描的介紹。
掃描指的是利用設(shè)備使電子束、無線電波等在特定區(qū)域來回移動而描繪出圖像。在人眼獲取信息的場景下,掃描指的是用戶快速瀏覽文字、短語、標題或頁面的各個部分以獲得所需信息的行為。
尼爾森諾曼集團發(fā)現(xiàn),79% 的人經(jīng)常會以掃描的形式瀏覽遇到的任何新頁面,只有 16% 的人會逐字閱讀新頁面。當用戶以非線性的方式處理內(nèi)容(跳過部分以找到需要的重要信息)時,可判斷用戶正在以掃描的形式獲取信息。
掃描可以理解為搜索,是一種尋找和過濾信息的有效策略,可有效避免信息過載。
二、9 種網(wǎng)頁掃描模式
以下是尼爾森諾曼集團基于實驗數(shù)據(jù),發(fā)現(xiàn)的 9 種最常見的人眼掃描模式,以下配圖均來自尼爾森諾曼集團。
1. F 型掃描模式
當用戶從左到右閱讀,大概率會這樣掃描文本。
F 型掃描模式
用戶習慣看每行文本的開頭幾個單詞,并且通常在前幾行每行看更多的單詞。當用戶視線向下移動時,會在下方每行文本上閱讀的單詞越來越少,最后只會看到靠近左邊的單詞。
F 型掃描模式的具體案例
對于從右到左閱讀的語言,比如阿拉伯語,F(xiàn) 型掃描模式會呈鏡像形式。
阿拉伯語網(wǎng)頁的鏡像 F 型掃描案例
2. 分層蛋糕掃描模式
為了快速感知內(nèi)容主題,用戶可能只閱讀 / 搜索 / 掃描副標題,因這種模式會一層一層堆疊,稱之為分層蛋糕掃描模式。
分層蛋糕掃描模式
這種掃描模式有助于快速感知內(nèi)容的主旨。人們會閱讀對自己有用的信息,忽略沒有用的文本段落。
分層蛋糕掃描模式的具體案例
簡明扼要、概括性高的副標題有助于用戶快速感知對應(yīng)模塊的核心內(nèi)容,快速找到需要的信息,并在長篇內(nèi)容中保持專注。
3. 點陣圖案掃描模式
點陣圖案掃描模式指的是,用戶在頁面中尋找關(guān)鍵詞閱讀的模式。
點陣圖案掃描模式
如下是搜索并查看數(shù)字的文章掃描熱力圖。
點陣圖案掃描模式的具體案例
很多時候掃描模式并不是隨機的,人們在線上閱讀時都會下意識地搜索關(guān)鍵信息,極少存在純粹為了愉悅而閱讀文章的情況。
4. 承諾型掃描模式
這是一種少見的模式。用戶如果對某個副標題感興趣,就會閱讀其下的全部內(nèi)容。
承諾型掃描模式
當人們在線上查看信息時,他們不只是瀏覽,而是在尋找答案。
只有當讀者找到與他們的任務(wù)、主題或興趣直接相關(guān)的部分時,才會出現(xiàn)承諾型掃描模式。讀者可以在找到正確信息后停止掃描開始逐字閱讀。
承諾型掃描模式的具體案例
5. 詳盡審閱掃描模式
備考的學生會按照這種模式閱讀頁面,文字寫作者做文字校對時也會這樣閱讀。
詳盡審閱型掃描模式
詳盡審閱掃描模式,需要耗費大量精力,在文字間來回穿梭。
詳盡審閱會發(fā)生在以下場景下:
- 文本難以理解,但出于外部原因需要逐字閱讀(比如考試)。
- 文本的內(nèi)容過于深奧,超出了讀者的專業(yè)水平。
- 內(nèi)容缺失,但讀者希望找到目標信息。
詳盡審閱型掃描模式的具體案例
用戶常常很難找到或理解所寫的信息,不得不進行更多的回溯,很多時候詳盡模式會讓讀者感到沮喪和失望。
6. 列表跳讀掃描模式
當讀者跳過文本只閱讀列表時發(fā)生。
列表跳讀掃描模式
列表跳讀也意味著,當每行的首個單詞非常相似,讀者將會錯過每行的前幾個詞。
列表跳讀掃描模式的具體案例
尼爾森諾曼集團指出,讀者在瀏覽常見問題列表時,常會跳過“為什么”和“如何”。
7. 章節(jié)跳過掃描模式
用戶有時也會跳過頁面的整個章節(jié)。
章節(jié)跳過掃描模式
章節(jié)跳過掃描模式常發(fā)生在價值較低或者不感興趣的內(nèi)容上。章節(jié)跳讀看起來像 F 型閱讀模式,但讀者幾乎不怎么看內(nèi)容。
章節(jié)跳過掃描模式的具體案例
8. 割草機掃描模式
該模式下與文本關(guān)系不大,而與網(wǎng)頁整體的內(nèi)容布局有關(guān)。如果頁面被劃分為圖片、視頻、文本等內(nèi)容單元,用戶的目光會以割草機的模式移動。
用戶從左上角的單元格開始,向右移動直到行尾,然后下拉到下一行,向左移動直到行首 ,下拉下一行,依次類推。
割草機掃描模式
以下的 Apple watch 商品列表頁是以“單元”內(nèi)容形式展示,在該頁面局部下,用戶的掃描模式可以理解為割草機模式。
割草機掃描模式的具體案例
9. 鋸齒型掃描模式
這種模式出現(xiàn)在頁面?zhèn)冗呌形谋菊?/ 圖像的情況下。
鋸齒型掃描模式
人們通過鋸齒型掃描要么是被圖片吸引,要么是被內(nèi)容所困擾。
鋸齒型掃描模式的具體案例
三、7 個提升網(wǎng)頁信息傳遞效果的建議
基于以上 9 種人眼掃描模式,給到以下 7 個提升網(wǎng)頁信息傳遞效果的建議。
1. 中心內(nèi)容前置
將模塊的中心信息前置(作為首句的開頭),F(xiàn) 型掃描模式體現(xiàn)了用戶更愿意閱讀每段的前幾行或每行的前幾個單詞。
可使用金字塔格式進行陳述。結(jié)論先行,先重要后次要,先全局后細節(jié),先結(jié)果后過程。
2. 添加副標題
就像分層蛋糕掃描模式提到的,使用與模塊內(nèi)容相關(guān)的副標題,有助于用戶快速感知對應(yīng)模塊的核心內(nèi)容,快速找到需要的信息,并在長篇內(nèi)容中保持專注。
3. 標記關(guān)鍵詞
使用粗體字來標記關(guān)鍵詞或以其他方式突出它們,對于點陣圖案掃描模式下的用戶非常管用,有利于他們快速找到需要的信息,但不能過度使用。
若你的潛在讀者會搜索某個數(shù)字,如在大量文字表述中將“八十千米每小時“調(diào)整為“80 km/h“,它的識別性會更好。
4. 重點可分類內(nèi)容通過列表形式呈現(xiàn)
列表是一種組織和展示信息的有效方式,通常使用項目符號或編號來標識每個內(nèi)容組。對于總結(jié)性信息、任務(wù)信息、不同項目優(yōu)缺點等均適合列表形式呈現(xiàn)。
列表跳讀模式因讀者很容易錯過類似的前幾個字,可避免每條的前幾個字重復。
5. 使用簡單易懂的語言
將內(nèi)容定位至具有最少專業(yè)知識的受眾,簡單易懂的語言可有效避免詳盡審閱,減少了回溯的需要,降低用戶理解門檻,減少產(chǎn)生負面情緒的可能性。
6. 內(nèi)容呈現(xiàn)簡潔
對于文字內(nèi)容,不要過度介紹,精煉語言。視覺呈現(xiàn)去掉增加用戶理解成本的非必要元素。冗長的介紹、附加的一些不必要的元素,只會增加用戶的理解成本。
7. 展現(xiàn)有價值的內(nèi)容
有價值的主題和觀點明確的內(nèi)容,對用戶更有吸引力。
結(jié)論
了解用戶的瀏覽習慣,有利于設(shè)計者更好的進行網(wǎng)頁設(shè)計。未來可能會因設(shè)計模式的轉(zhuǎn)變而產(chǎn)生新的行為類型,但大概率會基于同一個事實:用戶想要更高效的獲取信息。設(shè)計師需要在網(wǎng)頁內(nèi)容呈現(xiàn)上很好的對應(yīng)這一事實,將信息的有效傳遞作為設(shè)計的主要目標。
注釋:
- 尼爾森諾曼集團:英文全稱 Nielsen Norman Group,是由 Jakob Nielsen 和 Don Norman 創(chuàng)辦的一家用戶體驗研究和咨詢公司,因創(chuàng)始人在用戶體驗領(lǐng)域的領(lǐng)導力深受大眾信賴。Jakob Nielsen 定義了《10大可用性原則》,Norman 是《設(shè)計心理學》的作者。
- 眼球追蹤技術(shù):是一種通過專門的設(shè)備或軟件來跟蹤人眼睛的運動和焦點位置的技術(shù)。它可以用于研究人類視覺行為、用戶體驗設(shè)計、醫(yī)學診斷等領(lǐng)域。通過分析人眼的運動軌跡,可了解人在觀察物體時的注意力集中點,或評估用戶在瀏覽網(wǎng)頁或使用應(yīng)用程序時的行為。
作者:We-Design
想了解更多網(wǎng)站技術(shù)的內(nèi)容,請訪問:網(wǎng)站技術(shù)