無(wú)限滾動(dòng)與分頁(yè)設(shè)計(jì)

無(wú)限滾動(dòng)

無(wú)限滾動(dòng)技術(shù),簡(jiǎn)單地向下滾動(dòng)就可以不斷刷新頁(yè)面加載更多的內(nèi)容,現(xiàn)在很多移動(dòng)端使用的方式。

一、優(yōu)點(diǎn)

1. 用戶參與度和內(nèi)容發(fā)現(xiàn)

會(huì)讓用戶繼續(xù)留在你的web頁(yè)面中,因此增加了接觸的時(shí)間。特別是社交媒體類,大量的數(shù)據(jù)在實(shí)時(shí)更新,無(wú)限滾動(dòng)提供了一種有效的瀏覽海量信息的方法。
無(wú)限滾動(dòng)幾乎是每一個(gè)發(fā)現(xiàn)界面都必備的。當(dāng)用戶不是為了尋找某些特定的內(nèi)容時(shí),他們需要瀏覽大量的信息去發(fā)現(xiàn)他們喜歡的東西。由于內(nèi)容更新的太快,用戶很難看到所有的信息,無(wú)限滾動(dòng)是一種讓盡可能多的信息呈現(xiàn)在用戶信息流的有效方式。

2. 可用性優(yōu)勢(shì)

滾動(dòng)比點(diǎn)擊擁有更好的用戶體驗(yàn)

3. 滾動(dòng)很適合移動(dòng)設(shè)備

屏幕越小,滾動(dòng)的時(shí)間越長(zhǎng)。移動(dòng)瀏覽的普及是采用滾動(dòng)方式的另一個(gè)重要原因。移動(dòng)設(shè)備的手勢(shì)控制使?jié)L動(dòng)更加直觀和易用。無(wú)論用戶使用什么移動(dòng)設(shè)備,那種響應(yīng)式的體驗(yàn)比點(diǎn)擊好多了。

二、缺點(diǎn)

1. 頁(yè)面性能和設(shè)備優(yōu)勢(shì)

對(duì)于良好的用戶體驗(yàn)來(lái)說(shuō),頁(yè)面加載速度非常關(guān)鍵。緩慢的加載時(shí)間將導(dǎo)致用戶關(guān)閉網(wǎng)頁(yè)或退出應(yīng)用程序。用戶向下滾動(dòng)的越多,更多的內(nèi)容將被加載到頁(yè)面上,頁(yè)面性能也會(huì)慢慢下降。
另一個(gè)限制性因素是用戶的設(shè)備。特別是當(dāng)網(wǎng)站滾動(dòng)加載的是許多圖片時(shí),設(shè)備性能的限制會(huì)導(dǎo)致體驗(yàn)大打折扣。

2. 信息搜索和位置

當(dāng)用戶到達(dá)信息流的某個(gè)位置時(shí),他們不能標(biāo)記位置然后過(guò)會(huì)再返回到這個(gè)地方。如果他們離開(kāi)這個(gè)網(wǎng)站或應(yīng)用程序,再進(jìn)來(lái)時(shí)就要重新向下滾動(dòng)到原來(lái)那個(gè)地方。如果頁(yè)面很長(zhǎng),而自己要的信息又在比較下面的話,用戶體驗(yàn)肯定不會(huì)太好。(微信解決了這個(gè)問(wèn)題,哪怕后臺(tái)關(guān)閉了程序,重新進(jìn)入圖文時(shí)會(huì)直接到達(dá)原來(lái)的瀏覽位置)

3. 無(wú)關(guān)緊要的滾動(dòng)條

另一個(gè)煩人的事情是,滾動(dòng)條并不能真實(shí)地反映你所在的位置。從可訪問(wèn)性的角度來(lái)說(shuō),這里的滾動(dòng)條成了一種誤導(dǎo)。

4. 缺乏一個(gè)頁(yè)腳

頁(yè)腳的存在是有原因的:它們包含很多有用的內(nèi)容。網(wǎng)站使用無(wú)限滾動(dòng)時(shí)應(yīng)該使頁(yè)腳可訪問(wèn),可以把它放到頂部或側(cè)邊欄。
另一個(gè)解決方案是使用一個(gè)加載更多的按鈕。新的內(nèi)容不會(huì)自動(dòng)加載,直到用戶點(diǎn)擊加載更多按鈕。

分頁(yè)

分頁(yè)是一個(gè)將內(nèi)容分為單獨(dú)頁(yè)面的用戶界面模式,如果你滾動(dòng)到頁(yè)面底部看到數(shù)字行或有個(gè)“下一頁(yè)”按鈕,那就是網(wǎng)站或應(yīng)用程序的分頁(yè)。

一、優(yōu)點(diǎn)

1. 用戶參與度和內(nèi)容發(fā)現(xiàn)

當(dāng)用戶要找的信息在結(jié)果列表中時(shí),分頁(yè)是一種不錯(cuò)的方式,它不需要用戶去瀏覽整個(gè)信息流。谷歌搜索結(jié)果例子。

2. 控制的感覺(jué)

無(wú)限滾動(dòng)就像一個(gè)沒(méi)有盡頭的游戲——無(wú)論你滾動(dòng)多少次,好像永遠(yuǎn)不會(huì)結(jié)束。
當(dāng)用戶看到的結(jié)果總數(shù)(當(dāng)然不是無(wú)限)時(shí),他們會(huì)估計(jì)找到他們需要的信息大概需要多少時(shí)間。

3. 信息的位置

分頁(yè)界面可以讓用戶有一個(gè)大概的位置信息。他們未必知道確切的頁(yè)碼,但他們會(huì)記得大概是多少頁(yè),分頁(yè)的鏈接可以讓他們更容易到達(dá)那里。

二、缺點(diǎn)

1. 多余的操作

要進(jìn)入下一個(gè)分頁(yè)面,用戶必須找到鏈接目標(biāo)(例如“下一頁(yè)”或數(shù)字),單擊它然后等待新頁(yè)面加載。

什么情況下使用無(wú)限滾動(dòng)/分頁(yè)?

只有少數(shù)情況下采用無(wú)限滾動(dòng)是合適的。最適合的是擁有用戶生成內(nèi)容(微博、Twitter、Facebook)或視覺(jué)內(nèi)容(Pinterest、花瓣、 Instagram)的那些網(wǎng)站和應(yīng)用程序。分頁(yè)相對(duì)來(lái)說(shuō)是一個(gè)安全的選擇。

谷歌就很好的說(shuō)明了這一點(diǎn)。谷歌圖片使用無(wú)限滾動(dòng),因?yàn)樘幚韴D像信息比處理文字信息更容易。但搜索仍然使用傳統(tǒng)分頁(yè)技術(shù),因?yàn)闉g覽搜索結(jié)果需要更長(zhǎng)的時(shí)間。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問(wèn)答題47 /72 常見(jiàn)瀏覽器兼容性問(wèn)題與解決方案? 參考答案 (1)瀏覽器兼容問(wèn)題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,154評(píng)論 1 92
  • 無(wú)限滾動(dòng)技術(shù):簡(jiǎn)單地向下滾動(dòng)就可以不斷刷新頁(yè)面,加載更多的內(nèi)容。分頁(yè):將內(nèi)容分為單獨(dú)頁(yè)面,滾動(dòng)到頁(yè)面底部看到數(shù)字行...
    FlaminEcho閱讀 267評(píng)論 0 0
  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,057評(píng)論 25 709
  • -好多以前沒(méi)見(jiàn)過(guò)的術(shù)語(yǔ)。果然還是翻譯渣-看到出錯(cuò)的地方,請(qǐng)簡(jiǎn)信我。這個(gè)應(yīng)該可以使用吧……(猜想 無(wú)限滾動(dòng) (Inf...
    lyzhie閱讀 7,073評(píng)論 12 21
  • 昨日去北山拎水,小區(qū)西門拐角處,偶遇到她,有點(diǎn)普通,但綻放的張揚(yáng)讓她閃閃發(fā)光~我想她get到我的心里了~ ...
    無(wú)憂俠閱讀 300評(píng)論 0 1

友情鏈接更多精彩內(nèi)容