網站交互設計:分頁淺談 案例分析不同分頁形式

來源:互聯網
上載者:User

仲介交易 HTTP://www.aliyun.com/zixun/aggregation/6858.html">SEO診斷 淘寶客 雲主機 技術大廳

  

作用:跳轉到上一個頁面或下一個頁面。

元素:分類的基本元素有:上頁+頁碼+下頁(如標注1);總頁碼(如標注2);跳越網頁(如標注3);確認」按鈕(如標注4);

  

場景:根據以上這些基本元素在不同的場景會有不同的組合

(場景1)19樓論壇:

論壇頁面數量多的時候會達到上千頁;分頁的內容多數是頂貼或者是原創陸續更新帖子所以一般使用者都會查看首頁原創帖,然後又選擇性地查看些留言頁面。 手動全部翻一遍的幾率幾乎為0;所以論壇性的分頁會又以下特點:

1.多數使用者會在看了原創帖後直接翻頁或選擇回到貼子清單所以除底部還在頂部添加翻頁並設置了「返回清單」的快捷操作

2.所以第「1」頁是home的作用,始終有第」1「頁,中間用」...「表示未顯示的頁碼;

3.只提供"首頁1+5個連續頁碼+最後一頁"頁碼;開發者應該是考慮一般使用者最多連續查看5頁的內容。 或者就直接跳至最後一頁查看所以顯示最後一頁頁碼和直接跳至最後一頁的快捷按鈕;

  

(場景2)微博:

使用者流覽的資訊是關注的資訊,會像讀報紙一樣逐頁的流覽下去,因此「上一頁」「下一頁」用的次數最多;其次是跳轉翻頁,為體現輕量微博的概念,將傳統翻頁的中間頁碼部分簡化成下拉式功能表,既能標識當前頁位置又能翻頁切換跳轉;

新浪weibo:一頁45條微薄,更多則翻頁,上一頁、下一頁及第幾頁,預設推送10頁

  

(場景3)百度搜尋網頁面:

1.搜尋結果首次只提供10個頁碼;一般使用者在這10頁內還沒找到想要的內容應該會更換搜索內容。 腳印圖形和下面頁碼對應都可點擊翻頁,增加了頁面趣味性

2.因為搜尋網頁面使用者一般不會回到首頁所以頁面只有上一頁和下一頁的快捷按鈕

3.點擊任何一頁碼繼續流覽,發現後續提供的頁碼是:當前頁+9;便於使用者擴大搜尋範圍放大。

4.最多提供20個頁碼;比較適於頁面寬度

  

(場景4)資訊滾動翻頁:

1.騰訊weibo:一頁45條微薄,更多預設顯示更多按鈕,點擊後下面又多顯示45條,以此類推;同時騰訊還推出頁碼翻頁模式供使用者選擇

更人性化了

  

2.花瓣 「無限滾動翻頁」,當使用者流覽到頁面底部,自動刷新頁面展示新的資訊;連續翻過很多頁後,當再無內容可以展示時,自動出現關聯資訊按鈕「查看更多資訊」,引導使用者去流覽其他相關資訊;頁面過長時提供「回到頂部」按鈕;

  

拓展:以下為其他不同的分頁形式

  

以上是交互團隊對分頁的小小分享。

原文:HTTP://www.lpued.com/?p=1447

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.