PIECE2巨群
網頁設計 ‧ 平面設計 ‧ 虛擬主機 ‧ 網路行銷
最新消息
資訊分享
關於我們 服務項目 客戶案例 製作流程 虛擬主機 聯絡我們
網頁設計的版面佈置使用「瀑布流」比較好,還是「下一頁」比較好?

在設計資料量比較大的網站或是應用程式時,我們常常會遇到的問題是要採用分頁(Pagination),還是移動捲軸(Scrolling)便自動載入、呈現資料。

Facebook 和 Twitter 的頁面在載入新資訊的時候,都是採用移動捲軸自動載入的方式;Pinterest 開始流行之後,許多網頁設計都採用這種被暱稱為「瀑布流」的設計。但是我們依然可以看到許多網站,例如搜尋引擎巨擘 Google、和照片分享平台 Flickr,依舊還是使用分頁的方式呈現搜尋結果。


該選用分頁、還是捲軸?

到底這兩種呈現資料的方式有什麼差別?哪一個又比較好呢?

答案應該是:「It depends……」。

在設計社群類型的網站的時候,所需要呈現的資料是非常即時的,使用者第一個想看到的應該都是最新發生的消息、朋友最新的狀態,然後才是逐次的慢慢閱讀到他還沒看過的訊息。

這種依照時間排序、變動性質非常大的資料,如果採用分頁的方式呈現,每一個頁碼所代表的內容改變性很大,若採用分頁可能是比較不好的方法。想像一下,你每次打開一本書、翻到第 38 頁的時候,看到的都是不同的內容,應該是很困擾的一件事。

相對的,Google 和 Flickr 所呈現出來的資料是搜尋結果,和好友動態訊息比起來相對變化性低。

使用者在每次翻頁的時候都會留下使用印象。當使用者在第三頁找到資料,而下次又需要這筆資料的時候,他會透過頁碼大概記得這筆資料的正確位置,而不用使用滾輪來上下捲動來尋找他所需要的資料。


能把兩者結合嗎?

若資料的類型是可以被索引(index)的,例如導演的名單可以透過姓氏的字首索引、電影名稱可以透過字數索引,那麼把索引製作成分頁也是一種不錯的方法。使用者可以快速的從「J」這個分頁中快速的找到魔戒的導演 Peter Jackson。

也有許多應用程式更進一步的結合了兩種呈現方式,在 iOS 的「聯絡資訊」軟體上,所呈現的就是採用移動捲動的方式呈現你的通訊錄;但是在畫面的右手邊加上了筆劃與英文字母,除了可以快速的透過手指滑動手機螢幕尋找資料,也可以透過這種查找索引的方式快速找到需要的資料。

如果網站或應用程式所呈現出來的資料可以選擇或編輯,若採用分頁的方式,假設使用者在畫面上點選了三個選項,然後點選下一頁,這時候使用者可能會對於前一頁的三個選項是否還在勾選中感到有點困惑。此時採用捲軸呈現資料也許是比較方便的作法。


資料型態,才是設計呈現方式的本質

捲軸式的呈現時,使用者往往會多看個幾頁,得到的資訊相對比較多;但想想,若設計的是有一、兩萬筆資料的網站,要讓使用者在這一、兩萬筆資料中滾來滾去找到他想要的東西,可能就有點難度了。


其實資料才是呈現的本質,分頁和移動捲軸兩者的設計各有優點與缺點。當然,無論是採用哪種,都得根據資料的形態來呈現,才能找到最適合的方法。

 


轉貼來源:科技報橘 - Desiring Clicks專欄




參考文獻:

1.林隆儀、林岳民 (2005), 廣告比較策略與廣告訴求方式對購買意願的影響-產品涉入之干擾效果, 企業管理學報, 65(), 1-30.

2.林建煌 (2007), 消費者行為, 台北市: 智勝文化.

3.林永惟、宋同正 (2008), 商業平面設計之設計品質, 商業設計學報, 12(), 19-34.

 
返回列表
上一頁 下一頁


相關文章

從平面設計轉前網頁設計領域
如何為網站申請無障礙網頁設計
2013年,內容網站設計新趨勢:自適應網頁設計、HTML5,以及推薦閱讀機制
視覺及企劃也該知道的網頁設計概念
網頁設計技術探討-選單共用背景圖片


最新文章

HVACKer:入侵隔離網絡的新型攻擊技術
還有什麼不會被入侵?路由器 LED 燈已成為攻擊入口
美 5 家獨角獸同天申請 IPO 掛牌,最狂的是一家估值 124 億美的數據分析新創!
【台灣「智慧產業」開始佈局】緯創集團領投跨國 AI 新創 iKala,下一步拓展東南亞市場
快可以用手機遠端遙控你的所有家電了



 
PIECE2巨群 版權所有 © 2008 總公司:06-2895301 台北:02-82529838 台中:04-25152530 高雄:07-7931226
驗證 CSS 驗證 W3C
專精項目:網頁設計   網站設計   平面設計   包裝設計   關鍵字行銷   關鍵字排名   網路行銷   網站代管   虛擬主機   ERP系統