網(wǎng)頁設(shè)計中標(biāo)記頁碼的再思考

這是一篇關(guān)于頁碼設(shè)計細(xì)節(jié)的文章。在頁面停留的時候，頁面的數(shù)字在下方全部羅列，這樣就可以看到頁數(shù)。這樣的UI要素被叫做頁碼。就像是這個博客文章的檢索目錄一樣，資料太多的話很難一次呈現(xiàn)，因此頁面單位的按照大板塊劃分，這是為了更加易于讀者閱讀，便于讀者在頁面間移動的UI模式。

這里有更多的一些在smashing magazine上的頁碼設(shè)計，整理得很完整。

這樣熟悉的UI也許是不夠好的

這樣的頁面數(shù)字和之前羅列出來的形態(tài)是被用得很多的的UI。僅僅是這樣的UI元素是不能從側(cè)面反映使用者使用形態(tài)的，因此個人覺得不能說是好的設(shè)計。

分頁使用形態(tài)

實際分頁的使用形態(tài)，使用者會優(yōu)先按照目錄順序頻繁瀏覽，跳到特定頁面的情況是相對來說比較少的。大部分情況下因為不能預(yù)想到什么項目里面會有什么樣的文章，會跟著目錄的順序一致瀏覽下去?；蚴菑哪夸涢_頭到目錄結(jié)尾移動，或是為了看新的文章直接到最后一頁，或是為了閱讀以前看過的文章，跳過不關(guān)心的文章，通過相關(guān)的日期快速瀏覽，還有只在某些預(yù)測到的可能境況里，跳轉(zhuǎn)到特定頁面。這樣就是產(chǎn)品的所有使用流程了嗎?

除了以上這樣的使用行為外，剩下的行為的使用頻度差異很大，這些情況里有一種叫做主要行為的使用模式。經(jīng)常使用的就被著重強調(diào)，不經(jīng)常使用的就弱化表示，這樣看著方便，操作也更加簡單。

上面提到被稱為強調(diào)的東西，相對來說，因為比起重要的東西重要度要小一點，注意也會小一點，干擾減少一點的話會更有效果。如果不能下決定選擇的話，用戶反應(yīng)時間(可參照Hick法則)會減慢。

頁碼真的有必要完全展現(xiàn)嗎?

如果考慮這樣的使用形態(tài)的話，取消頁碼羅列形式是比較好的。頁碼羅列出來的大部分情況，都帶來了不必要的干擾。因為檢索結(jié)果如果頻繁更新的話，就會成為像SNS時間線那樣，很難預(yù)測的頁面，因此在特定頁面的跳轉(zhuǎn)功能取消，使其功能更加單純，這樣UI的使用會更加提升。Naver博客和TSTORY博客移動端頁面都是使用了這樣的模式。但是同樣地，這樣也是有著不合適的地方。因為Naver檢索的時間線與前者特性不同，如果極端地移去分頁的話，可能會有更多的不便。因為搜索的結(jié)果是通過接近性羅列的，與目錄那種按時間的排序不一樣，如果搜素之后不能隨意移動到想要的搜索頁，便會令使用者覺得煩躁。

嘗試將理論聯(lián)系起來設(shè)計

另外一個羅列頁碼的缺點是，如果將大塊的頁碼區(qū)域以每十項來劃分，如果只想在鄰接領(lǐng)域移動的話，便有可能誤觸到下方按鈕，造成麻煩。向特定頁面移動的情況，不是要設(shè)計復(fù)雜的構(gòu)造，只要設(shè)計簡單的途徑，使得全體頁面的鏈接都可以展現(xiàn)就好了。用圖表形態(tài)(例如3/24表現(xiàn)第三頁)把全體頁面的現(xiàn)有位置表現(xiàn)出來，簡單而確切。當(dāng)然全體的頁面的鏈接如果經(jīng)常展現(xiàn)，會有點復(fù)雜，因此一開始就要考慮頁面隱藏與展開的情況。IOS列表里也有關(guān)于primary action的項目，通過點擊，隱藏在detail disclosure按鈕后面的secondary action便會被觸發(fā)展現(xiàn)，按下波浪箭頭，便可以看到詳情頁面。

下面一起來看看實際應(yīng)用，手機在以前的頁面下端繼續(xù)追加了“查看全部頁碼“的選項，使得使用更加便利。