“我到底要用分頁器呢紧显，還是不斷自動(dòng)加載來設(shè)計(jì)內(nèi)容呢？”
每個(gè)設(shè)計(jì)師都會(huì)遇到這個(gè)問題缕棵。當(dāng)然孵班，這兩種方式各有利弊涉兽，我們來看下這兩種方式分別適用于那些場(chǎng)景以及有什么利弊。
無限加載
無限加載是一種當(dāng)用戶在瀏覽大波信息的時(shí)候篙程，滾動(dòng)到內(nèi)容底部枷畏，可以不停地自動(dòng)加載內(nèi)容的技術(shù)。當(dāng)然它看起來好像挺好的虱饿，用戶不用點(diǎn)擊拥诡，系統(tǒng)自動(dòng)加載內(nèi)容。但是這種方式也不是一勞永逸的氮发。
優(yōu)勢(shì)1：用戶沉浸與內(nèi)容發(fā)現(xiàn)
當(dāng)你使用滾動(dòng)作為交互方式來讓用戶瀏覽信息渴肉，那么這可能會(huì)讓用戶花更多時(shí)間在你的產(chǎn)品上面，從而增加用戶的參與度爽冕。隨著很多社交媒體應(yīng)用的流行仇祭，這種一直滑動(dòng)/滾動(dòng)頁面自動(dòng)加載內(nèi)容的方式，讓你的用戶可以開心地瀏覽信息颈畸，不需要額外的點(diǎn)擊乌奇。
無限加載這種方式，在“發(fā)現(xiàn)內(nèi)容”這種場(chǎng)景下眯娱，幾乎是一個(gè)“必須有”的功能礁苗。這時(shí)候用戶并不需要搜尋指定或明確的內(nèi)容，而需要在海量量的信息中通過瀏覽尋找到他們合適的/喜歡的內(nèi)容徙缴。
舉個(gè)例子试伙，你會(huì)看到Pinterest上面，用戶并不需要把所有內(nèi)容一一看完娜搂，因?yàn)閮?nèi)容是實(shí)時(shí)更新的，并且更新很快吱抚。所以平臺(tái)盡可能地展示更多內(nèi)容給用戶百宇，通過滾動(dòng)無限加載的方式，讓用戶可以快速掃描并且消化這些內(nèi)容秘豹。
優(yōu)勢(shì)2: 滾動(dòng)比點(diǎn)擊方便
不管是在PC斷還是移動(dòng)端携御，一直滾動(dòng)都會(huì)比點(diǎn)擊/觸屏來得方便一些。舉個(gè)例子既绕，就像一些教學(xué)文案啄刹，長(zhǎng)篇的圖文，滾動(dòng)加載內(nèi)容的體驗(yàn)肯定會(huì)比點(diǎn)擊翻頁更好一些凄贩。
優(yōu)勢(shì)3: 滑動(dòng)在移動(dòng)端是很友好的交互方式
越小的屏幕誓军，內(nèi)容長(zhǎng)度會(huì)更長(zhǎng)，需要滾動(dòng)的距離就越長(zhǎng)疲扎。當(dāng)人們?cè)絹碓絻A向于在移動(dòng)端瀏覽內(nèi)容昵时，特別是社交媒體捷雕，這一趨勢(shì)使得越來越多人習(xí)慣于通過滾動(dòng)來加載內(nèi)容的方式。這種交互方式讓他們覺得不用思考壹甥，漸漸習(xí)慣救巷。所以就算是換了其他設(shè)備，他們有時(shí)候也會(huì)期望有這種交互方式句柠。
劣勢(shì)1: 需要考慮頁面性能和設(shè)備資源
頁面加載速度基本是好的用戶體驗(yàn)的必備條件浦译。越來越多研究發(fā)現(xiàn)，頁面加載速度越慢溯职，你的用戶離開這個(gè)頁面的頻率就越高精盅，或者直接刪除App。所以當(dāng)頁面加載出來的內(nèi)容越多缸榄，越考驗(yàn)當(dāng)前頁面的性能渤弛，很可能會(huì)導(dǎo)致這個(gè)頁面變卡，體驗(yàn)變差甚带。
另外一個(gè)要考慮的是設(shè)備的資源和性能了她肯。有些內(nèi)容涵蓋了大量圖片，設(shè)備的資源如果不夠鹰贵，可能也會(huì)讓加載速度變慢晴氨。
劣勢(shì)2: 搜索和頁面定位
當(dāng)用戶在大量的信息中瀏覽到某個(gè)地方的時(shí)候，他們沒辦法把這個(gè)地方定位住碉输，等下再回來這個(gè)地方籽前。或者當(dāng)用戶離開這個(gè)站點(diǎn)的時(shí)候敷钾，又回來枝哄，可能就找不回剛剛瀏覽的地方在哪里了，而且大部分時(shí)候頁面又重新回到了頂部了阻荒，然后可能又要一直一直往下滾動(dòng)挠锥，等待內(nèi)容加載出來。
劣勢(shì)3: 沒有明確意義的滾動(dòng)條
通過滾動(dòng)來加載內(nèi)通侨赡，不管在什么平臺(tái)上蓖租，都會(huì)附帶滾動(dòng)條。然后這個(gè)滾動(dòng)條并不能告訴你接下來還有多少內(nèi)容羊壹。每次你可能都會(huì)想蓖宦，快到底部了吧？怎么還沒有油猫？或者稠茂，如果已經(jīng)使用了滾動(dòng)條的話，可以優(yōu)化一下情妖，讓滾動(dòng)條可以體現(xiàn)出真實(shí)的頁面長(zhǎng)度主慰，讓用戶知道大概總體的頁面長(zhǎng)度/內(nèi)容長(zhǎng)度嚣州。
劣勢(shì)4: 跟頁面footer沖突
大部分站點(diǎn)都會(huì)在底部設(shè)置footer來展示網(wǎng)站或者公司的信息。如果采用無限滾動(dòng)這種方式共螺，那么footer就可能要想辦法挪到其他地方去了该肴。或者藐不，不自動(dòng)加載匀哄，內(nèi)容瀏覽到底部，加一個(gè)“手動(dòng)加載”的按鈕雏蛮，來避免這種沖突涎嚼。
分頁器
分頁器就是一個(gè)控件，可以把一大片內(nèi)容分成多個(gè)“頁面”挑秉。
優(yōu)勢(shì)1: 傳達(dá)明確的信息
當(dāng)用戶在一些結(jié)果列表里面搜尋一些特定信息法梯，而不是毫無目的地瀏覽時(shí)，分頁器會(huì)是一個(gè)很好的交互方式犀概。以google搜索結(jié)果頁為例子立哑， 用戶可以決定要看多少個(gè)結(jié)果頁。
優(yōu)勢(shì)2: 控制感
無限加載就像一個(gè)無終止的游戲姻灶，不管你滾動(dòng)到哪里铛绰，感覺永遠(yuǎn)都沒有盡頭。當(dāng)用戶通過分頁器知道結(jié)果總量有多少的時(shí)候产喉，對(duì)比無限加載的方式捂掰，用戶更加能夠從中作出更明智的決定。根據(jù)HCI心理學(xué)一個(gè)教授的說法曾沈，“能夠到達(dá)終點(diǎn)这嚣，會(huì)讓人覺得有控制感∪悖” 研究還表明姐帚，當(dāng)用戶看到有限的并且相關(guān)的信息在一起，他們更容易地知道敛腌，他們想要找的內(nèi)容到底是不是在這里卧土。
同時(shí)惫皱，一般用戶可以從分頁器看出來內(nèi)容有多少像樊，結(jié)果有多少頁（當(dāng)然前提是內(nèi)容是有限的），用戶就會(huì)對(duì)自己在這上面花費(fèi)多少時(shí)間旅敷，心里有數(shù)生棍。
優(yōu)勢(shì)3: 定位瀏覽位置
當(dāng)用戶看完大量信息之后，想要找到剛剛看到的一個(gè)條目時(shí)媳谁，分頁器就提供了讓用戶方便回退的方式涂滴。用戶可能不太記得具體那個(gè)條目在第幾頁友酱，但是能大概猜測(cè)出在哪里，通過點(diǎn)擊分頁器柔纵，就可以追溯到之前瀏覽過的位置缔杉。
對(duì)于商業(yè)性網(wǎng)站和應(yīng)用來說，分頁器提供了一個(gè)很好的體驗(yàn)搁料，那就是當(dāng)用戶想要回去剛剛離開的位置或详，或者把兩個(gè)距離比較遠(yuǎn)的物體進(jìn)行比較，就可以通過分頁器來定位到郭计。
劣勢(shì)：需要多一個(gè)點(diǎn)擊
很明顯的霸琴，當(dāng)用戶想要看下一頁的內(nèi)容，他必須要去點(diǎn)擊分頁器中的下一頁昭伸。最大的問題是梧乘，現(xiàn)在很多網(wǎng)站默認(rèn)每一頁會(huì)給用戶展示很少的條目（可能10-20條），如果頁面性能影響不大的話庐杨，可以一次過展示多些條目选调，這樣用戶就可以點(diǎn)擊少一點(diǎn)〖或者讓用戶自己選擇每頁可以展示多少（一般是展示更多学歧，比如100條），這種情況下各吨，他們大部分人可能習(xí)慣于通過頁面搜索字段（快捷鍵 Cmd+f）來更快找到他們想要的內(nèi)容枝笨。
什么時(shí)候用分頁器/無限加載？
其實(shí)只有少量的場(chǎng)景中揭蜒，無限加載的交互方式是更佳的横浑。最佳的場(chǎng)景是在當(dāng)用戶想要瀏覽/掃描海量的UGC（用戶生成的內(nèi)容）時(shí)（比如微博，F(xiàn)acebook屉更，推特徙融，抖音等），這時(shí)候用戶是沒有明確的意圖想要找到什么瑰谜。相反地欺冀，分頁器的最佳使用場(chǎng)合是，當(dāng)用戶是有目標(biāo)的萨脑，想要找到明確的條目或信息的時(shí)候隐轩。
還有就是，內(nèi)容形式也可以作為選擇這兩種交互方式的參考渤早。你的內(nèi)容是圖像多职车，還是文字多？哈，熟悉Google 的朋友可以發(fā)現(xiàn)悴灵，Google搜圖片用的是無限加載的方式扛芽，因?yàn)橛脩艨梢酝ㄟ^快速掃描圖片來尋找而不是通過讀文字。而正常的Google搜索結(jié)果頁中积瞒，會(huì)有一個(gè)典型的分頁器在底部川尖。那是因?yàn)?b>用戶需要更多時(shí)間來瀏覽文字。
結(jié)論
總之茫孔，設(shè)計(jì)師們應(yīng)該權(quán)衡利弊來選擇合適的交互方式空厌，這也取決于你的產(chǎn)品類型和你想用什么方式來呈現(xiàn)內(nèi)容。
