關(guān)于分頁的設(shè)計(jì)
作用:跳轉(zhuǎn)到上一個(gè)頁面或下一個(gè)頁面。
元素:分頁的基本元素有:上頁+頁碼+下頁(如標(biāo)注1);總頁碼(如標(biāo)注2);跳轉(zhuǎn)頁(如標(biāo)注3);確認(rèn)”按鈕(如標(biāo)注4);
場(chǎng)景:根據(jù)以上這些基本元素在不同的場(chǎng)景會(huì)有不同的組合
(場(chǎng)景1)19樓論壇:
論壇頁面數(shù)量多的時(shí)候會(huì)達(dá)到上千頁;分頁的內(nèi)容多數(shù)是頂貼或者是原創(chuàng)陸續(xù)更新帖子所以一般用戶都會(huì)查看首頁原創(chuàng)帖,然后又選擇性地查看些留言頁面。手動(dòng)全部翻一遍的幾率幾乎為0;所以論壇性的分頁會(huì)又以下特點(diǎn):
1.多數(shù)用戶會(huì)在看了原創(chuàng)帖后直接翻頁或選擇回到貼子列表所以除底部還在頂部添加翻頁并設(shè)置了”返回列表”的快捷操作
2.所以第”1″頁是home的作用,始終有第”1″頁,中間用”…”表示未顯示的頁碼;
3.只提供”首頁1+5個(gè)連續(xù)頁碼+最后一頁”頁碼;開發(fā)者應(yīng)該是考慮一般用戶最多連續(xù)查看5頁的內(nèi)容。或者就直接跳至最后一頁查看所以顯示最后一頁頁碼和直接跳至最后一頁的快捷按鈕;
(場(chǎng)景2)微博:
用戶瀏覽的信息是關(guān)注的信息,會(huì)像讀報(bào)紙一樣逐頁的瀏覽下去,因此”上一頁””下一頁”用的次數(shù)最多;其次是跳轉(zhuǎn)翻頁,為體現(xiàn)輕量微博的概念,將傳統(tǒng)翻頁的中間頁碼部分簡(jiǎn)化成下拉菜單,既能標(biāo)識(shí)當(dāng)前頁位置又能翻頁切換跳轉(zhuǎn);
新浪weibo:一頁45條微薄,更多則翻頁,上一頁、下一頁及第幾頁,默認(rèn)推送10頁
(場(chǎng)景3)百度搜索頁面:
1.搜索結(jié)果首次只提供10個(gè)頁碼;一般用戶在這10頁內(nèi)還沒找到想要的內(nèi)容應(yīng)該會(huì)更換搜索內(nèi)容。腳印圖形和下面頁碼對(duì)應(yīng)都可點(diǎn)擊翻頁,增加了頁面趣味性
2.因?yàn)樗阉黜撁嬗脩粢话悴粫?huì)回到首頁所以頁面只有上一頁和下一頁的快捷按鈕
3.點(diǎn)擊任何一頁碼繼續(xù)瀏覽,發(fā)現(xiàn)后續(xù)提供的頁碼是:當(dāng)前頁+9;便于用戶擴(kuò)大搜索范圍放大。
4.最多提供20個(gè)頁碼;比較適于頁面寬度
(場(chǎng)景4)信息滾動(dòng)翻頁:
1.騰訊weibo:一頁45條微薄,更多默認(rèn)顯示更多按鈕,點(diǎn)擊后下面又多顯示45條,以此類推;同時(shí)騰訊還推出頁碼翻頁模式供用戶選擇
更人性化了
2.花瓣”無限滾動(dòng)翻頁”,當(dāng)用戶瀏覽到頁面底部,自動(dòng)刷新頁面展示新的信息;連續(xù)翻過很多頁后,當(dāng)再無內(nèi)容可以展示時(shí),自動(dòng)出現(xiàn)關(guān)聯(lián)信息按鈕”查看更多信息”,引導(dǎo)用戶去瀏覽其他相關(guān)信息;頁面過長(zhǎng)時(shí)提供”回到頂部”按鈕;
拓展:以下為其他不同的分頁形式
以上是交互團(tuán)隊(duì)對(duì)分頁的小小分享。
文章來源:良無限-UED
擴(kuò)展閱讀:淺談分頁和加載分頁
- 目前還沒評(píng)論,等你發(fā)揮!