推薦：建立用戶體驗(yàn)過(guò)程的實(shí)用指南
也許你剛剛來(lái)到一家公司，他們希望進(jìn)行一些“可用性”工作。你可能是一名UI設(shè)計(jì)師，業(yè)務(wù)分析師，或前端開(kāi)發(fā)人員，一名產(chǎn)品經(jīng)理，或者負(fù)責(zé)用戶體驗(yàn)部門的經(jīng)理或

作者：http://dancewithnet.com/

結(jié)構(gòu)和層次降低了復(fù)雜性并提高了可讀性。你的文章或站點(diǎn)組織的越深入，用戶就越輕易理解你觀點(diǎn)和得到你想傳達(dá)的信息。在網(wǎng)頁(yè)上，這點(diǎn)被通過(guò)多個(gè)方式做到。

在正文頭條和列舉被用做邏輯上獨(dú)立的數(shù)據(jù)塊來(lái)呈現(xiàn)信息。另一種解決方法是一種叫分頁(yè)的機(jī)制，它在給定文章的單一部分為用戶提供用于瀏覽的額外的導(dǎo)航選項(xiàng)。文章的這些地方除了“上一頁(yè)（previous）”和“下一頁(yè)（next）”按鈕外，還涉及到數(shù)字、提示和箭頭。

搜索引擎幾乎總是使用分頁(yè)，報(bào)紙往往利用它來(lái)導(dǎo)航有幾部分的大文章。還有一些情形，分頁(yè)也是博客（weblog）所需的。額外的導(dǎo)航能簡(jiǎn)化一些站點(diǎn)頁(yè)面的訪問(wèn)，例如讓用戶輕易的通過(guò)站點(diǎn)的存檔進(jìn)行瀏覽。

在大多數(shù)情況下，分頁(yè)優(yōu)于傳統(tǒng)的“上一頁(yè)、下一頁(yè)”導(dǎo)航方式，它通過(guò)站點(diǎn)給訪問(wèn)者提供更快更方便的導(dǎo)航。它不是必須的，但是一個(gè)有用的好特性。

讓我們來(lái)看一些好的分頁(yè)實(shí)踐，何時(shí)和如何執(zhí)行分頁(yè)的一些例子。

分頁(yè)設(shè)計(jì)的好實(shí)踐（來(lái)自Faruk Ates的7個(gè)方面）

1. 提供大面積的可點(diǎn)擊區(qū)域
2. 別使用下劃線
3. 標(biāo)明當(dāng)前頁(yè)面
4. 隔開(kāi)網(wǎng)頁(yè)鏈接
5. 提供上一頁(yè)和下一頁(yè)鏈接
6. 使用首頁(yè)和末頁(yè)鏈接（在能適用的地方）
7. 把首頁(yè)和末頁(yè)放在外面

相關(guān)參考資料

1. Pagination 101，F(xiàn)aruk Ates已經(jīng)完成關(guān)于分頁(yè)的終稿。
2. Some Styles For Your Pagination，可以隨意下載隨意適用的分頁(yè)樣式。
3. 假如你的博客是基于wordpress的，你可以安裝插件WP-PageNavi來(lái)產(chǎn)生分頁(yè)。它非常輕易安裝，但需要你修改一些你用主題的源碼。

錯(cuò)誤#1：分頁(yè)選項(xiàng)不可見(jiàn)

因?yàn)榉猪?yè)的是主要目的是充當(dāng)一個(gè)改進(jìn)后的導(dǎo)航，它必需讓訪問(wèn)者清楚他們?cè)谀膬�、他們已�?jīng)去了哪兒和他們下一步能去哪兒。這個(gè)三個(gè)事實(shí)讓用戶完整的理解這個(gè)系統(tǒng)如何的工作和這個(gè)導(dǎo)航應(yīng)該如何被使用。

但最重要的是，導(dǎo)航選項(xiàng)應(yīng)該是可見(jiàn)的。hugg.com不遵循這個(gè)方針。鏈接顏色和白色背景對(duì)比度非常低。沒(méi)有提供鼠標(biāo)懸停效果。

錯(cuò)誤#2：分頁(yè)不直觀

假如你不得不在一個(gè)相當(dāng)復(fù)雜（但漂亮）的導(dǎo)航和一個(gè)簡(jiǎn)單但包含必要功能的導(dǎo)航間選擇，一直傾向簡(jiǎn)單的方法。假如用戶不理解分頁(yè)背后的機(jī)制，他們將不能使用它，因此他們也不會(huì)使用你的網(wǎng)站。

Helium.com是這個(gè)錯(cuò)誤的很好例子�？匆幌孪旅娼貓D：這些箭頭代表什么？代表你訪問(wèn)過(guò)的那頁(yè)或代表你正在訪問(wèn)的那頁(yè)？為什么這個(gè)鏈接到第二頁(yè)有一個(gè)白色背景？為什么箭頭有不同的顏色？這是不直觀的。

不直觀的設(shè)計(jì)源于結(jié)構(gòu)、層次和深思熟慮后的設(shè)計(jì)決定的缺乏。空白導(dǎo)航像過(guò)度擁擠方案一樣不直觀。

沒(méi)有間隔的網(wǎng)頁(yè)鏈接難以掃描和瀏覽。Make-Believe.org是個(gè)這樣的例子，其設(shè)計(jì)是不直觀的。

創(chuàng)造性的方案可能是用戶友好的

對(duì)于設(shè)計(jì)者來(lái)說(shuō)，一個(gè)元素被使用的越頻繁，想在沒(méi)有使設(shè)計(jì)不直觀的冒險(xiǎn)下去介紹一些創(chuàng)新方法越難。因此，分頁(yè)設(shè)計(jì)有各種不同的模式，但使用革命性的方法很少見(jiàn)。

然后，創(chuàng)造性的方法可以是用戶有好的。例如：Dirty.ru使用了一個(gè)滑塊分頁(yè)菜單，用戶能拖動(dòng)滑塊去獲得更多的可利用的選項(xiàng)，那意思是鏈接到這個(gè)站點(diǎn)的的更舊頁(yè)面。

Erweiterungen.de，德文版的官方火狐擴(kuò)展網(wǎng)站，一旦用戶點(diǎn)擊“…”按鈕就提供更多的導(dǎo)航選項(xiàng)。

圖庫(kù)

雖然“標(biāo)準(zhǔn)”分頁(yè)——彼此相連被鏈接的藍(lán)色數(shù)字——對(duì)于大部分的網(wǎng)頁(yè)界面是非常普通的，設(shè)計(jì)往往通過(guò)色彩、形式、背景和外形進(jìn)行實(shí)驗(yàn)。

分頁(yè)看起來(lái)很好不需要以迷惑用戶注重為目標(biāo)，作為站點(diǎn)導(dǎo)航的一部分，它提供給用戶一個(gè)重要的功能，因而需要有效的使用。盡管如此，視覺(jué)線索是有幫助的。在大多數(shù)設(shè)計(jì)中，傳統(tǒng)使用的顏色被藍(lán)色和灰色主宰。

簡(jiǎn)單列舉

使用色彩和外形

設(shè)計(jì)者通常用顏色高亮去顯示當(dāng)前頁(yè)，以區(qū)分它和其它頁(yè)。頁(yè)碼也被給于外形：長(zhǎng)方形、圓形或者按鈕。當(dāng)前頁(yè)通常是不被鏈接的。

帶手工頁(yè)碼輸入框的分頁(yè)

在一些情況下，用戶可以通過(guò)輸入框手工提供想瀏覽的頁(yè)碼。這對(duì)選項(xiàng)數(shù)目有限的分頁(yè)來(lái)說(shuō)是很常見(jiàn)的，例如在這些設(shè)計(jì)里你不能跳到你想去的上一頁(yè)。

與眾不同的方案

原文

Pagination Gallery: Examples And Good Practices

分享：網(wǎng)頁(yè)設(shè)計(jì)如何促進(jìn)內(nèi)衣品牌建設(shè)
內(nèi)衣，作為人體的貼身服飾，從羞于露面到大大方方展示出來(lái)，在一群營(yíng)銷高手的推波助瀾下，風(fēng)生水起，高速發(fā)展，催生了一個(gè)趨于成熟的熱點(diǎn)產(chǎn)業(yè)。在這個(gè)產(chǎn)業(yè)的營(yíng)