無限下拉滾動Vs分頁

一、無線下拉滾動

無限下拉加載技術(shù)使用戶在大量成塊的內(nèi)容面前一直滾動查看。這種方法是在你向下滾動的時候不斷加載新內(nèi)容。雖然聽起來比較誘人,但該技術(shù)并不是一個面向任何網(wǎng)站或應用程序的通用方案。

優(yōu)點1:用戶參與和內(nèi)容發(fā)現(xiàn)

當你使用滾動作為發(fā)現(xiàn)數(shù)據(jù)的主要方法時,它可能使你的用戶在網(wǎng)頁上停留更長時間并提升用戶參與度。隨著社交媒體的流行,大量的數(shù)據(jù)被用戶消費。無線滾動提供了一個高效的方法讓用戶瀏覽海量信息,而不必等待頁面的預加載。

無限滾動幾乎是一個發(fā)現(xiàn)界面的必備功能。當用戶并不特意尋找特定的內(nèi)容時,他們需要通過查看大量內(nèi)容找到自己中意的信息。

你可以通過Facebook信息流的例子來評估無線滾動的好處。用戶知道他們不可能看到信息流里面的所有內(nèi)容,因為內(nèi)容更新太頻繁了。通過無線滾動技術(shù),F(xiàn)acebook正竭盡所能促使更多的信息能呈獻給用戶面前,用戶則產(chǎn)生對信息的瀏覽和消費行為。

優(yōu)點2:滾動要比點擊好

用戶使用滾動能獲得比點擊/輕點更好的體驗。鼠標滾輪和觸控屏使?jié)L動行為要比點擊更快更容易。對于那些連續(xù)且冗長的內(nèi)容,比如一本說明書,滾動要比把這些信息分成幾個獨立的屏幕或頁面有更好的易用性。

優(yōu)點3:滾動對移動設(shè)備很友好

屏幕越小,滾動就越長。移動瀏覽的普及也促使了長滾動。移動設(shè)備的手勢控制使?jié)L動更直觀和易用。其結(jié)果就是,用戶享受響應式的體驗不論他們使用何種設(shè)備。

缺點1:頁面性能和設(shè)備資源

頁面加載速度是良好用戶體驗的一切。多項研究已經(jīng)表明緩慢的加載速度會造成用戶離開你的網(wǎng)站或者刪除你的應用程序從而降低轉(zhuǎn)換率。這對那些應用了無線滾動方案的開發(fā)者自然是壞消息。用戶在一個頁面越向下滾動,就會加載更多的內(nèi)容。結(jié)果就是頁面性能越來越低。

另一個問題是用戶設(shè)備資源的限制性。在很多應用無線滾動方案的網(wǎng)站上,尤其那些包含很多圖片的站點,那些受資源限制的設(shè)備,比如iPad會越來越慢因為其加載了大量外部資源。

缺點2:搜索和位置標記

無線滾動的另一個問題是當用戶到了當前信息流中的一個特定點,他們沒法標記當前位置且不能再隨后再回到這里。他們一旦離開,就會丟失當前的瀏覽記錄,以至于如果要回到上次的位置,他們必須得重新滾動去發(fā)現(xiàn)。這種做法的結(jié)果就是用戶產(chǎn)生困擾厭煩更影響了其全程的體驗。

在2012年,Esty花時間使用了無線滾動方案,最后發(fā)現(xiàn)該方案并沒有分頁方案表現(xiàn)的好。雖然兩種方案下的購買轉(zhuǎn)化率差不多,但是用戶的參與度降低了—用戶沒再過多的使用搜索功能。

就像Dmitry?Fadeev 指出:“人們會想要回到他們的搜索結(jié)果列表中檢查他們剛剛找到的東西,并跟列表之外他們發(fā)現(xiàn)的東西做對比。無線滾動不光打破了這種動態(tài),它也使得上下移動列表變得困難,尤其當你返回到列表頁卻發(fā)現(xiàn)自己又回到頂部,不得不重新滾動等待結(jié)果的加載。從這個角度來看,無線滾動確實要比分頁方案效率低。”

缺點3:無關(guān)緊要的滾動條

另一個討厭的問題是滾動條并沒有反映出實際的數(shù)據(jù)量。假設(shè)你快要接近底部了,你會很容易受滾動條的引誘再滾動一點點,但結(jié)果卻發(fā)現(xiàn)當你到那里的時候數(shù)據(jù)量又翻倍了。從一個可用性的角度來說,打破滾動條的正常使用規(guī)則對用戶來講是非常糟糕的。

缺點4:頁腳的缺失

頁腳的存在是有原因的:它們包含一些用戶可能會需要的信息—如果用戶找不到它們想找的東西或它們需要一些額外的信息的話,他們通常會到頁腳看看。但是因為這種信息流的無線滾動,用戶經(jīng)常一到底部就會有更多的數(shù)據(jù)加載出來從而將頁腳永遠的置于了視野之外。

那些應用無線滾動方案的站點應該讓頁腳或者固定或者將其遷移至頂部或側(cè)邊欄顯示。

另一個解決方案是出發(fā)加載更多的按鈕的時候再去加載信息。新的內(nèi)容不會自動加載直到用戶點擊了加載按鈕。通過這種方法,用戶能很容易地到達頁腳而不要一直追趕它。

二、分頁

分頁技術(shù)是指將內(nèi)容信息劃分成獨立的頁面來顯示。如果你滾到一個頁面的底部看到一行數(shù)字,這些數(shù)字就是當前站點或者應用程序里面的分頁。

優(yōu)點1:良好的轉(zhuǎn)換

當用戶是在結(jié)果列表查找特定的信息而不是僅僅瀏覽信息流時,分頁就是好的選擇。

你可以用谷歌搜索的例子來評估分頁的好處。查找最好的搜索結(jié)果可能需要花費1分鐘或者1個小時,這取決于你的搜索。但是放你在谷歌現(xiàn)有的搜索格式下停止搜尋時,你會知道搜索結(jié)果的準確數(shù)量。你能夠決定在哪里停下或者精讀哪些結(jié)果。

優(yōu)點2:掌控感

無限滾動就像個無止境的游戲—

無論你滾動多久,你會感覺永遠結(jié)束不了。當用戶知道可用結(jié)果的數(shù)量時,他們能夠做出更知情的決定而不是被動的無限滾動列表。按照David Kieras 在他的研究Psychology in Human-Computer Interaction中提出:“能夠到達結(jié)束點提供了一種掌控感”。該研究同時揭示了當用戶有有限且相關(guān)的結(jié)果時,他們更容易決定他們在尋找的究竟在不在里面。

同樣的,當用戶能夠看到結(jié)果的數(shù)量時,他們將能夠預估他們找到想找的東西大概要花費多長時間。

優(yōu)點3:位置標記

分頁方案讓我們能夠大概定向搜索的目標位置。用戶可能難以記錄頁面的精確數(shù)字,但至少能夠記錄大概位置,而且頁碼鏈接能讓他們更容易到達那里。

分頁方案對電子商務(wù)網(wǎng)站或應用程序來說很好。用戶在線購物的時候,他們希望能夠回到他們之前離開的地方繼續(xù)購物。

缺點1:額外的動作

在分頁方案中,用戶要到達下一張頁面,就必須找到頁碼鏈接,移動鼠標置于其上,點擊然后等待新頁面的加載。

這種方案的主要的問題是大多數(shù)網(wǎng)站中,每一頁只向用戶戰(zhàn)象相當有限的信息。在不影響加載速度的情況下,加長你的頁面,用戶就能在每一頁獲取到更多的內(nèi)容,他們就不必太頻繁的點擊那些頁碼鏈接。

三、什么時候使用無限滾動/分頁方案?

實際上,應用無限滾動方案的實例只有很少部分。它最適合于那些靠用戶生產(chǎn)內(nèi)容(Twitter,F(xiàn)acebook)或表現(xiàn)視覺內(nèi)容(Printerest,Instagram)的站點/應用程序。而分頁方案對那些希望滿足用戶目標導向的站點/應用程序來說則是一個安全、友好的解決方案。

谷歌的經(jīng)驗就很好的說明了這一點。谷歌圖片使用無限滾動是為了保證用戶能夠比文本更快的瀏覽處理圖片。閱讀一個搜索結(jié)果列表往往花費一些時間。

這就是為什么谷歌索索仍舊使用傳統(tǒng)的分頁方案。

四、結(jié)論

設(shè)計者在選擇解決方案前應該權(quán)衡無限滾動/分頁方案的優(yōu)缺點。這個選擇取決于你設(shè)計中的上下午和內(nèi)容的呈現(xiàn)方式。一般來說,無限滾動適用于向Twitter等那些用戶重在消費無限的信息流而并不常搜尋特定的信息的應用。分頁則適用于那些用戶在尋找特定信息的搜索結(jié)果列表頁以及那些用戶的瀏覽記錄比較重要的場合。

譯自:https://uxplanet.org/ux-infinite-scrolling-vs-pagination-1030d29376f1#.3oje53veo

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 227,837評論 6 531
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 98,196評論 3 414
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 175,688評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,654評論 1 309
  • 正文 為了忘掉前任,我火速辦了婚禮,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,456評論 6 406
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 54,955評論 1 321
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,044評論 3 440
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 42,195評論 0 287
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 48,725評論 1 333
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 40,608評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,802評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,318評論 5 358
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 44,048評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,422評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,673評論 1 281
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,424評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,762評論 2 372

推薦閱讀更多精彩內(nèi)容