搜索最後結果頁(SERP):不要被F型瀏覽晃動了

  2006年四月,美國長時期研討網站可用性的聞名網站預設師傑柯柏·尼爾森(Jakob Nielsen)刊發了一項《眼珠子軌跡的研討》報告陳述(原文:F-Shaped Pattern For Reading Web Content)。

  報告陳述中提出,大部分數事情狀況下瀏覽者都由不得自己的以F式樣的標准樣式閱覽網頁,這種基本永恆固定的閱覽習性表決了網頁閃現F形的關心注視熱度。

  研討者用了幾種不一樣的頁面做眼動儀測試,獲得了3張熱度圖,用顏色來表達瀏覽者目光聚攏的熱度,分為最熱(紅色)、較熱(黃色)、不熱(藍色)和基本不關心注視(灰色)4種。那裡面圖3搜索最後結果頁因SERP中網站題目、網頁提要較寬,第二條線會隨之加長,但還是是F式樣。

  

  圖1:F型瀏覽

  研討擔任職務的人這麼解釋F型瀏覽:

  第1步:水准移動

  瀏覽者首先在網頁最上部形成一個水准瀏覽軌跡。

  第二步:視線下移,短范圍水准移動

  瀏覽者會將視線向下移,電子掃描比上一步短的地區范圍。

  第三步:鉛直瀏覽

  瀏覽者完成上兩步後,會將視線沿網頁左側鉛直電子掃描;這一步的瀏覽速度較慢,也較有系統性、頭緒性。

  F型瀏覽身後的問題

  F型瀏覽標准樣式這個理論已經推出許久了,我在眾多網站和BLOG上也看見過這麼的分享。我在深刻思考幾個問題:

  1. 顯露出來F型瀏覽標准樣式的端由是啥子?它的身後是啥子樣的用戶需要?

  2. F型瀏覽會遭受網站內部實質意義、用戶需要影響而發生變更嗎?會顯露出來別的式樣嗎?

  3. F型瀏覽標准樣式能夠給我們啥子啟發?怎麼樣引導我們施行SERP的預設?

  攜帶這些個問題,我施行了一點資料的發掘和試驗,繼續往前有了更多的疑問,瀏覽者都由不得自己的以F式樣的標准樣式閱覽網頁,這句話,特別值當質疑。由於我發覺,瀏覽者並未是無認識形成了某種瀏覽行徑,而是遭受網站預設與自身需要的兩重影響而導致的。

  啥子導致了F型瀏覽?

  Jakob Nielsen消耗的錢的苦心用三種不一樣的網頁施行測試,目標是為了奉告我們,F型瀏覽在不一樣的網站上都是通用的,用戶的F型瀏覽行徑並不會遭受網站內部實質意義和預設顯露出來太大的不一樣。

  不過他並未進一步剖析顯露出來F型瀏覽的端由,最後結果讓眾多人誤覺得這實在是一種由不得自己的行徑。

  也正由於這麼,F型瀏覽也很容易被看出眾多破綻來。譬如:

  為何不是E而是F?由於我們看見眾多眼動儀測試的圖片F下邊並未一只有一個水准瀏覽線,而是多個。

  為何下邊的一個水准瀏覽線要短於上頭的一條,而其實我們看見的眾多眼動儀圖片卻是下邊的水准瀏覽線要長於上頭的一個?

  而進一步的研討也發覺,當思索問題到網頁浩博的內部實質意義元素,譬如圖片刻,F型瀏覽很容易就被突破。如圖,你能看見一個典型的F嗎?

  

  圖2:圖片因素對F型瀏覽的影響

  那末,研討擔任職務的人又來補給F型瀏覽了,它們說,當有了圖片元素影響後,用戶的瀏覽行徑發生了變更,不再閃現F型瀏覽,而是顯露出來了一個E字:

  

  我想,再這樣推下去,仍然防止不得破綻出現的次數非常多,E出來了,F出來了,日後還會有L,I,C,Z

  仍然早早透過現象去剖析實質,讓我們早點接觸F型瀏覽身後的端由更好。

  我覺得,F型還是是E型瀏覽形式,完全不是無認識的由不得自己的行徑,而是網站內部實質意義、預設,用戶需要和用戶習性多重因素效用下的最後結果。

  用戶的習性:從左向右,從上到下,這也是傳統閱覽習性在網絡上的延伸。

  互聯網用戶的閱覽習性:有點像我們閱覽黃頁還是產物品名目錄的形式:迅速電子掃描的形式,捕獵關鍵點,讀短句子,不重視連篇累牘——這些個是可以有確定的評論的。

  用戶的需要:這種習性是怎麼樣養成的?我想是由於互聯網用戶心裡有個需要:尋覓某個物品。這個物品有可能是具體的,譬如搜索某個產品。也有可能是依稀的,譬如瀏覽新聞網站,我們是想電子掃描一下子看看有沒有激發興致的網站關鍵詞。當發覺這些個網站關鍵詞後,我們會閱覽更多的匡助信息以幫忙決斷:這到底是不是我要找的物品,當發覺似的時刻,會萌生到詳細情形頁面的點擊,當然發覺不似的話,便會接著向下閱覽,接著再度循環。

  用戶的耐性是有限度的,所以隨著電子掃描的施行,頁面長度的拉伸,它們若找不到非常多興致點,興致天然會漸漸消減,因為這個就有可能形成了所說的的F型還是金三角學熱區。

  用戶在瀏覽的時刻,前腦裡顯露出來了三個詞和詞組:或許是,是,否。

  當詞和詞組是或許似的時刻,用戶水准瀏覽以取得更多信息,當解答是否時,用戶讓步水准瀏覽,下移閱覽下一段還是下一個搜索條目。當解答是是時,普通會萌生一個點擊。如圖所示:

  

  圖3:F型瀏覽是有認識的行徑

  這是我心裡的F型瀏覽板型:

  縱向電子掃描用以相比較:信息為第1維度要關心注視的信息,用戶尋覓的是最關緊並且有差別化的信息,用戶電子掃描的速度急速。用戶相比較中會萌生定位,因此產沒燒開過的水平閱覽。

  橫向閱覽用以判斷:信息為第二維度信息,信息可以沒有差別化,用戶會減低電子掃描的速度以取得更多有用的信息,幫忙自個兒做判斷,要麼要領擊到詳細情形頁。

  用戶的相比較需求有差別化的信息,因為這個當用戶做了一次過淋後,原本差別化的信息變為雷同時,F的縱向條著手轉移到額外一組信息處,譬如在淘寶上搜索mp3,當我通過過淋,用篩子選出一組均是米奇的MP3時,圖片的差別化就沒有了,我的F縱向直接過渡到題目還是其它信息。

  在以下的圖片無差別化的list上,我甚至於可能直接將F的縱向瀏覽轉移到價錢還是地區上。

  

  因為這個,我們可以把F型了解得更加寬泛一點,這麼就無須去很糾結上頭一橫長仍然下邊一橫長還是是兩橫半中腰的距離,當然也不會很糾結為什麼F會有多條水准橫線。

  非典型肺炎型性F型瀏覽——用戶需要、網站預設等因素的影響

  上頭顯露出來一張夾雜了一張圖片的搜索最後結果頁(圖2),那末我想,當顯露出來多張圖片刻,效果又是怎麼樣呢?

  剛好,這幾天我想買個電腦包,去淘寶上搜索電腦包,而後不做不論什麼用篩子選,直接看搜索到的最後結果。我有認識測候自個兒的行徑(當然,做研討無須認為合適而使用我的形式),而後發覺:

  1. 我首先只看圖片——圖片能夠幫忙我快迅速地解決斷,這個包的顏色、格式、風格是否是我所要尋覓的(因為這個迅速顯露出來了一條長長的鉛直瀏覽線)。

  2. 當圖片滿意需要後,我會橫向閱覽該包的解釋明白(題目)。——假如題目中裡面含有了諸如二手,18寸等字眼,我便會讓步橫向瀏覽,直接用一個斜線過渡到下一個產品圖片。

  3. 當迅速電子掃描題目未顯露出來讓我say no的字眼時,我將眼看東西假想線落到達價錢上。請看倒數第二個紅色的包包,圖片經過,題目經過,不過價錢越過預算,於是我讓步用斜線過渡到下邊的產品。

  

  我們如果有一個一樣和我在買電腦包的人,如果他不關切顏色,不關切格式,只關切價錢(眾多做成批出售的或許就是這樣)——那末他一來這個搜索最後結果頁,會不會頭先從價錢存在的地方的列著手縱向瀏覽,擯除,挑選,橫向研討並下決策——讓步仍然點擊?這是絕對可能的。

  在電子商業上的事務網站上,由於圖片大部分數是第1挑選要素,它有自然產生的的優位能夠幫忙做挑選,因為這個我們的瀏覽眼看東西假想線從左上方著手,先縱向再橫向,縱向和橫向的意向是有著微妙的差別的。這個稍後再說。

  我們再看看口碑網,一樣預設的搜索最後結果頁的瀏覽眼看東西假想線:

  我,代表著一個平常的的來找包房的用戶。平常的的找包房的用戶關切啥子?

  他第1關切的是房型和地段。其次是價錢。

  因為這個,他的瀏覽眼看東西假想線即可能就是這樣——

  1. 穿過了圖片先看題目,由於題目普通會裡面含有小區名字,房型等關緊因素。

  2. 當題目裡有讓他say no的字眼時,其它的信息(圖片、價錢、更多紹介等)通通都會視而不見。迅速縱向瀏覽到下邊的列表。

  3. 當題目裡有字眼滿意需要後,用戶會橫向掃到價錢字眼,做第二次判斷。

  4. 當價錢越過心理預先期待時(或過低時),用戶讓步此列表,眼看東西假想線顯露出來Z型的下移,下移到下一條列表的題目。

  5. 當價錢同時滿意希望時,普通會萌生一個到詳細情形頁面的點擊(兩個黃色地區范圍)。

  在下邊的例子中,一樣是圖片,卻僅只起到一個匡助的效用,當用戶經過題目還是價錢掌握的信息不完全可以判斷時,纔會做為參照因素。

  

  再看看網站預設,是怎麼樣影響用戶瀏覽行徑的。

  而,在以相冊形式展覽的SERP頁面,用戶的行徑又是如何的呢?

  譬如,在淘寶商城,切換成gallery方式。我的需要是尋覓一個雙肩的電腦包,圖片還是是第1維度要關心注視的,因為這個我的眼看東西假想線很可能閃現Z狀,當我發覺了有合宜的格式和顏色的包包後,我纔會電子掃描第二維度的信息:價錢還是題目等。

  不過,我又發覺,錯非我有認識,能力夠保障是一個Z型瀏覽,大部分數事情狀況,我在Gallery方式展覽的list上,眼看東西假想線閃現放射狀的,散亂的,沒有規律的,我或許會被那裡面的某張圖片先吸引到——這張圖片或許是當中的而不是左上角的圖片,而後再由這張圖片著手,上進還是向下瀏覽。

  這種galley的預設,固然能夠冒尖圖片的影響,不過其實倒並不便用戶做相比較和用篩子選,會漏掉一點信息,因為這個有可能會顯露出來上上下下的重復瀏覽——這或許也是海外主流的電子商業上的事務網站沒有把這種方式作為主要的list預設的端由,當然,這是我私人的料想。——假如有機緣,我們會利用gallery做一下子眼動儀的測試,來證驗這個論斷。

  一個tips是,當以gallery形式閃現產品時,同一行的產品不適宜過多。

  

  F型瀏覽給我的啟發

  我覺得,F型瀏覽不是完全的,也不是無認識的,而是遭受網站預設、用戶需要、用戶習性多重因素影響。那末,我們的SERP預設,特別是List items預設,要遵循啥子原則呢?

  只所以寫這篇文章,我也因為近期在項目裡碰到了一個問題:

  list頁面怎麼樣承載多種暴光需要?

  鑒於這個頁面的關緊性,眾多業務部門都期望能夠在list頁面做一點暴光,僅一個產品列表而言,有部門期望能夠放出企業還是產品的證明信息,有的部門也許感到沒不可缺少讓用戶點擊到詳細情形頁,可以放出更多信息,譬如企業的結合形式,產品運營方,也許期望list能夠裡面含有供應商的更多信息,譬如規模,主營產品,設施和加工有經驗,工藝等。

  不過,list一個豆腐塊狀的體積,怎麼能夠裡面含有那末多信息呢?

  所以,我們需求使心服各個業務方:list頁面預設的目標不是讓用戶閱覽,做決策,而是迅速尋覓,定位,判斷,而真正的決策是需求用戶到達詳細情形頁甚至於是與供應商結合過能力做出的。list頁面的預設目標需求天真,纔不至於捉襟見肘,疏忽了最主要的目標,堆積了數量多的信息,反倒減低了用戶的瀏覽、相比較、定位的速率。

  我們能做啥子?

  1. 信息優先級的區分清楚

  就電子商業上的事務網站而言,我覺得可以區分清楚三個優先級。

  第1步:相比較和迅速用篩子選。

  第二步:取得更多信息以幫忙判斷。

  第三步:研討並決策——下一步動作還是讓步。

  

  嚴重聲明一點兒:以上的信息優先級要視網站性質、受眾需要而有不一樣,不服水土不論什麼類型的SERP。譬如,一樣是電子商業上的事務網站,淘寶和alibaba就有非常大的不同。淘寶面向的私人買主,而alibaba.com面向的是全世界的成批出售商、中小規模的公司采集購買。用戶類型差別比較大,采集購買類型差別比較大,因為這個需要就不同,關心注視的信息維度就不同。

  對於成批出售商來講,由於一個產品要采集購買數量多,普通也都是來樣加工訂制,不像是淘寶的現貨采集購買,也比較重視長時期的供貨關系,因為這個對單品細節的關心注視就略微要偏弱一點,更關切供應商本身的信譽、供貨有經驗、主營產品等。

  並且,行業不一樣,采集購買類型也不同,關心注視的信息維度也不同。上以星期去上海建築材料展訪問交談的客戶,都能夠明確幫我們明確承認一個事情的真實情況:行業特點標志對於SERP預設的差別化需要凸顯。——這個話題往後再說。

  Heidi想要表現的意思就是:依據你的網站的用戶需要和產品特點標志,你腦筋裡需求顯露出來這麼一個表格——裡邊的內部實質意義需求調試為最適應的優先級。

  假如預設師還是產品經理沒有奉達出信息優先級的概念,那末市場研討擔任職務的人很有可能供給出一個大雜燴,用戶關切啥子信息,產品圖片,描寫,證明,信譽,價錢,物流,供應商天資我曉得它們當然啥子都關切,不過——在啥子階段關切啥子是要區別的。

  2. 幫忙用戶更快完成擔任的工作

  當我們腦筋裡已經有了這張表,況且和項目組得到共識後——得到共識比較不由得易,不過我們可以靠用戶調查研究、訪問交談、行業研討供給足夠的proof來得出一個比較合理的信息優先級,那末餘下的擔任的工作就是怎麼樣更好表達這些個內部實質意義。

  一樣的扁食餡,不一樣的包法顯然能夠給用戶不一樣的感官感覺,包得非常不好,不惟有礙於觀瞻,也極可能破掉,毀傷了一鍋湯不說,還進了水,造成扁食沒有味道。

  既是用戶在SERP頁面的目的很清楚——找到它!

  用戶在SERP的擔任的工作又是可以被我們預先推測的——他有三個步驟需求完成(參看表格)

  每個擔任的工作的目的一樣也是相相比較較清楚的,那末我們預設的擔任的工作就是在每個階段讓他能夠更加管用率完成子擔任的工作目的。

  當然你可謂:那我們乾嘛要分成三步呢?既是要簡化辦公量,索性讓他一步完成不更好嗎?

  不過事情的真實情況上,用戶的這三步也是一個時間軸,不是在同時存在的需要,並且當我們把全部的信息都同時呈當前,反倒會莫大減低他完成第1步的速率。

  我覺得,SERP能夠滿意前兩個級別的需要就可以了,第三步可以放到詳細情形頁去完成。

  如google的搜索list:

  

  想一下子:假如題目文數非常多,還是沒有和下邊的描寫區別開來,沒有做網站關鍵詞的加粗,是不是會造成用戶第1步用篩子選速率減低?

  再相比較兩個網站的list items:

  去哪裡——酒店搜索列表頁:

  

  口碑網——飯館搜索列表頁:

  

  兩者相形,我私人覺得去哪裡的表達要優於口碑網。

  去哪裡信息層次十分明確——地段以及酒店品牌第1維度。

  價錢單獨成列——十分便於二級用篩子選。

  圖片相對不關緊,因為這個只給出數目和鏈接。

  給出了十分有利做挑選的催銷信息。

  而口碑網的表達:

  圖片十分不關緊,不過還是佔領了金子位置。

  因為題目位於圖片上部,用戶在縱向瀏覽時,常常被圖片因素乾擾,有弊於迅速瀏覽。

  地圖、周邊等信息,我覺得歸屬第三優先級,卻顯露出來在這處,造成每個item十分復雜。

  述評:口碑給出了單個用戶的述評,有失客觀和中允性,會誤導客戶。

  

  幾個值當試驗的舉動:

  1. 信息區塊區分清楚——遵循用戶習性和F型瀏覽,F型瀏覽反響了用戶的瀏覽習性,從上至下,從左至右。

  

  2. 加粗、顯化能幫忙用戶增長速率的網站關鍵詞還是信息

  例如SERP搜索網站關鍵詞的加粗,主要的目標就是讓用戶迅速捕獲字眼,而後判斷:這是不是我要找的產品。

  額外,減低噪音。上頭這張圖,私人覺得將那一個跳動的旺旺圖標轉移到右下角的位置能夠幫忙用戶提高對圖片和題目的瀏覽相比較。

  像價錢這麼的字段,普通來說比較關緊(第二優先級),那末處置形式有兩種:

  單獨成列——用戶很容易縱向相比較,這也是眾多網站的作法。

  

  單獨成列的時刻,我們可以錯誤價錢施行非常多視物感覺上的鞏固。

  不過若做成不僅獨的列,就需求著意加粗,以幫忙用戶縱向迅速跳躍式的相比較。

  ——不然,便會就是這樣:

  

  3. 條目預設的拓展性

  很可能你的三段論法會遭受產品團隊的贊揚,不過它們需求更多的信息體現。因為這個它們並不覺得只有前兩個優先級的信息能力夠被放到SERP頁面上,其它的只能到詳細情形頁檢查。

  並且,它們的觀點也很有sense:

  為何要用戶一個一個點開去判斷這到盡頭是不是他要找的物品呢?那不是失效的點擊嗎?

  那末,縱然已經有了優先級區分清楚,list items預設還要思索問題一定的拓展性——可以不展覽,在用戶有需要的時刻展開。

  

  還有更多舉動需求你參加:

  提出更多質疑,Heidi私人所得定然有一定的限制性。

  幫Heidi證驗論斷准確與否:供給實例還是反例。