淺談分頁(yè)和加載分頁(yè)
![](http://image.woshipm.com/wp-files/img/41.jpg)
無(wú)論是在web頁(yè)面還是手機(jī)應(yīng)用,信息往往無(wú)法在一個(gè)頁(yè)面全部展示,這就需要用到一些可以擴(kuò)展頁(yè)面信息的交互模式:分頁(yè)(Pagination)和加載(Continuous Scrolling)。分頁(yè)和加載都是非常常見的交互模式,我們每天都會(huì)遇到,也正是因?yàn)樘R姡覀兩踔粮杏X(jué)不到它們的存在,瀏覽到頁(yè)面的底部時(shí),看到分頁(yè)就順手點(diǎn)一下,自動(dòng)加載了就繼續(xù)閱讀。但正是這小小的一點(diǎn),也會(huì)帶給用戶很不同的微妙感受。下面就來(lái)聊聊這些小差異帶來(lái)的大不同。
分頁(yè)
分頁(yè)可以將大篇幅的內(nèi)容分成小塊,顯示在單獨(dú)的連續(xù)頁(yè)面上,便于用戶理解和查找。可以讓用戶清楚的知道,自己所要瀏覽的內(nèi)容到底有多少、已經(jīng)瀏覽到哪個(gè)部分、還剩余多少。分頁(yè)可以使用戶對(duì)所瀏覽的內(nèi)容有清楚的預(yù)期。
篇幅較長(zhǎng)的文章是一定會(huì)用到分頁(yè)的。一是給用戶內(nèi)容多少的預(yù)期,二是可以給瀏覽者提供一個(gè)停頓。如果用戶看一篇文章已經(jīng)翻了十幾屏,滾動(dòng)條還是停留在瀏覽器中間靠上的位置,那該多絕望。
![120913164220-6333-1 120913164220-6333-1](https://image.woshipm.com/wp-files/2012/09/120913164220-6333-1.png)
分頁(yè)控件實(shí)際上是給網(wǎng)站的內(nèi)容創(chuàng)造了一個(gè)自然的停頓,這個(gè)停頓運(yùn)用得好的話,可以讓產(chǎn)品更有節(jié)奏感。但是當(dāng)用戶瀏覽完一頁(yè)的內(nèi)容時(shí),就必須停下正在進(jìn)行的閱讀,通過(guò)點(diǎn)擊進(jìn)行跳轉(zhuǎn)來(lái)獲取更多內(nèi)容。不可否認(rèn),這個(gè)停頓會(huì)在一定程度上打斷用戶的思路。在遇到分頁(yè)時(shí),用戶很有可能會(huì)去思考,是繼續(xù)瀏覽呢?還是離開網(wǎng)站呢?所以遇到分頁(yè)時(shí),往往會(huì)流失一部分用戶。
連續(xù)加載
連續(xù)加載是一個(gè)與分頁(yè)相反的交互模式,信息之間沒(méi)有明顯的界限或是停頓。當(dāng)頁(yè)面滾動(dòng)到底部,新的信息就會(huì)被自動(dòng)加載進(jìn)來(lái)。
各種社交網(wǎng)絡(luò)就特別喜歡用這種控件,用戶不會(huì)被打斷,可以順暢的一直瀏覽下去,沉浸其中。
![120913164220-1141-2 120913164220-1141-2](https://image.woshipm.com/wp-files/2012/09/120913164220-1141-2.png)
使用分頁(yè)控件時(shí),用戶必須通過(guò)點(diǎn)擊才能查看到更多的內(nèi)容,所以說(shuō),信息獲取是用戶主動(dòng)請(qǐng)求的。而使用連續(xù)加載時(shí),新的信息是被自動(dòng)加載進(jìn)來(lái),用戶是被動(dòng)的接受。
折中的方式
分頁(yè)和加載各有利弊,如今的很多網(wǎng)站也會(huì)采取一些折中的方式:分頁(yè)加載一起用。
如Quora,會(huì)在自動(dòng)加載4次后出現(xiàn)一個(gè)“More”按鈕,在連續(xù)的信息流之后,給用戶一個(gè)停頓,讓他們?nèi)ブ鲃?dòng)的獲取更多信息。
![120913164220-3421-3 120913164220-3421-3](https://image.woshipm.com/wp-files/2012/09/120913164220-3421-3.png)
![120913164220-1P0-4 120913164220-1P0-4](https://image.woshipm.com/wp-files/2012/09/120913164220-1P0-4.png)
![120913164220-6152-5 120913164220-6152-5](https://image.woshipm.com/wp-files/2012/09/120913164220-6152-5.png)
在屏幕更小、使用場(chǎng)景更多變的手機(jī)端,滑動(dòng)顯然比精確點(diǎn)擊更簡(jiǎn)單更不容易誤操作。手機(jī)端產(chǎn)品信息架構(gòu)相對(duì)簡(jiǎn)單,用戶瀏覽時(shí)長(zhǎng)相對(duì)較短,使用時(shí)注意力也相對(duì)分散。所以大多數(shù)app都會(huì)使用連續(xù)加載的方式。而且加載也比分頁(yè)控件更省空間。
![120913164220-13b-6 120913164220-13b-6](https://image.woshipm.com/wp-files/2012/09/120913164220-13b-6.png)
![120913164220-4332-7 120913164220-4332-7](https://image.woshipm.com/wp-files/2012/09/120913164220-4332-7.png)
- 目前還沒(méi)評(píng)論,等你發(fā)揮!