在設計資料量比較大的網站或是應用程式的時候,我們常常會遇到的問題是要考慮要採用分頁(Pagination)的方式、還是移動捲軸(Scrolling)便自動載入來呈現資料。Facebook 和 Twitter 的頁面在載入新資訊的時候,都是採用自動載入的方式。在 Pinterest 開始流行之後,許多網站都設計採用這種被匿稱為瀑布流的設計。但是我們依然可以看到許多網站,例如搜尋引擎巨擘 Google、和照片分享平台 Flickr,則依舊還是使用分頁的方式呈現搜尋結果。
分頁還是捲軸?
到底這兩種呈現資料的方式有什麼差別?哪一個又比較好呢?
答案應該是「It depend…」。在設計社群類型的網站的時候,所需要呈現的資料是非常即時的,使用者第一個想看到的應該都是最新發生的消息、朋友最新的狀態,然後才是逐次的慢慢閱讀到他還沒看過的訊息。這種依照時間排序,變動性質非常大的資料,如果採用分頁的方式呈現,每一個頁碼所代表的內容改變性很大,若採用分頁可能是比較不好的方法。想像一下你每次打開一本書翻到第 38 頁的時候看到的都是不同的內容,應該是很困擾的一件事。
相對的,Google 和 Flickr 所呈現出來的資料是搜尋結果,和好友動態訊息比起來相對變化性低。使用者在每次翻頁的時候都會留下使用印象。當使用者在第三頁找到資料,而下次又需要這筆資料的時候,他會透過頁碼大概記得這筆資料的正確位置,而不用使用滾輪來上下捲動來尋找他所需要的資料。
兩者結合?
若資料的類型是可以被索引(index)的,例如導演的名單可以透過姓氏的字首索引、電影名稱可以透過字數索引。那麼把索引製作成分頁也是一種不錯的方法。使用者可以快速的從 J 這個分頁中快速的找到魔戒的導演 Peter Jackson。
也有許多應用程式更進一步的結合了兩種呈現方式,在 iOS 的「聯絡資訊」軟體上,所呈現的就是採用捲動的方式呈現你的通訊錄。但是在畫面的右手邊加上了筆劃與英文字母,除了可以快速的透過手指滑動手機螢幕尋找資料,也可以透過這種查找索引的方式快速找到需要的資料。
如果網站或應用程式所呈現出來的資料可以選擇或編輯。若採用分頁的方式,假設使用者在畫面上點選了三個選項,然後點選下一頁,這時候使用者可能會對於前一頁的三個選項是否還在勾選中感到有點困惑。此時採用捲軸呈現資料也許是比較方便的作法。
資料才是本質
捲軸式的呈現時,使用者往往會多看個幾頁,得到的資訊相對比較多,但想想若設計的是有一兩萬筆資料的網站,要讓使用者在這一兩萬筆資料中滾來滾去找到他想要的東西就可能有點難度了。其實資料才是呈現的本質,兩者的設計各有優點與缺點。當然,無論是採用捲軸還是分頁,都是根據資料的形態來呈現才能找到最適合的方法。
延伸閱讀:
Image via Renaud Camus, CC License.