我最近在Twitter上閱讀了一項關(guān)于如何顯示使用數(shù)量過濾器更改過的分頁項目的調(diào)查（例如，每頁查看20、30、40個項目等），通過選擇更高或更低的數(shù)量，它會改變根本上是列表的初始用戶體驗。發(fā)生這種情況時，您已經(jīng)失去了方向感和位置感。這種行為幾乎是互聯(lián)網(wǎng)上的標準行為，令人驚訝的是，很少有網(wǎng)站在邏輯上對其進行修復(fù)。以下只是我的觀點和可能的解決方案（作為電子商務(wù)站點的常規(guī)客戶），因此，我尚未與實際客戶一起實施，也不知道設(shè)計解決方案是否是最佳方案，但其目的是制定邏輯規(guī)則，使設(shè)計系統(tǒng)有意義并可以在現(xiàn)場進行測試。

假設(shè)我們的客戶使用我們的電子商務(wù)網(wǎng)站并搜索可以返回許多結(jié)果的內(nèi)容。該列表在每500頁中每頁返回25個項目，客戶開始瀏覽它，共完成3頁（見圖1）。我們的客戶開始查看所有項目（圖1上的青色），然后開始移至以下頁面，然后在第3頁停止。這是當客戶認為每頁25個項目不足以瀏覽項目時，因此使用顯示內(nèi)容過濾器，然后將分頁更改為每頁100個項目。在下面的圖形中，您可以看到淺青色，客戶已經(jīng)看到的項目和深青色是客戶正在看到的當前項目，灰色項目是我們的客戶尚未審查的項目：

如果我們的客戶更改每頁項目選項會怎樣？通常的事情是對整個列表進行完全重新加載（圖2），這會使我們的客戶返回到第一頁，在那一刻，用戶再次觀看已經(jīng)看到的列表的前3到4個項目。一切都必須再次看到。太遺憾了。我過去也遇到過其他變種，它們甚至更痛苦：例如，將您留在同一頁面上（圖3），其中有100個項目，但是前一頁也有100個項目，因此最后一頁您現(xiàn)在看到的項目在前幾頁上，中間有大量未經(jīng)審核的項目。您會進入第3頁，但看不到任何項目。無論哪種情況，您都會迷路，必須再次瀏覽所有內(nèi)容，但是在最后一個示例中（圖3），

這種方法帶來了網(wǎng)頁列表中最流行的問題之一。這是一個不為人知的壞習(xí)慣，使我們的客戶感到沮喪，后者不得不浪費時間來回想一下清單上的所有項目，這也使客戶立即失去了瀏覽位置。例如，如果客戶正在查看第5頁上的項目223，那么現(xiàn)在該項目在第3頁上，因此，客戶必須瀏覽第2或3頁并搜索該項目以繼續(xù)檢查所有內(nèi)容。人們沒有時間進行數(shù)學(xué)運算以計算最后查看的項目在哪一頁上以及該項目當前的順序。

對于這些類型的案例，理想的行為應(yīng)該是什么呢？為此，我們必須分析客戶的最初意圖：在列表中或多或少地看到當前項目中的項目。如果我們仔細審查此前提，我們可以理解，理想的情況是，在[客戶]所在的點，我們必須顯示x項商品才能完成所需樣本的抽樣。換句話說：如果您每頁看到25個項目，現(xiàn)在說要100個項目，則應(yīng)在正在查看的當前頁面上再添加75個項目（圖4），以前的項目應(yīng)保持在25，而除非客戶再次改變主意，否則為100。

在此示例（圖4）中，我們可以看到可能的解決方案：您重新加載（或不加載）頁面結(jié)果，但是您只是將客戶留在了與以前相同的位置。客戶有很多有趣且顯而易見的選擇：可以回頭查看確切瀏覽的內(nèi)容，或者可以繼續(xù)瀏覽新添加的內(nèi)容并保持每頁瀏覽100個項目。因此，在理想情況下，客戶永遠不會看到完整的重新加載，但是對于這種情況，向頁面中注入更多項目正在瀏覽以完成100。即使客戶要刪除它，也應(yīng)這樣做，將100縮小為每頁25，以前的頁面完全不變。

這種交互有很多好處，原因有很多：客戶不會遇到任何“完全重置”現(xiàn)象。它將不會被帶到具有100個結(jié)果的頁面1，它將看到與第3頁相同的但具有100個項目的頁面?？蛻粼诓榭此袃?nèi)容時已經(jīng)記住了兩頁項目，我們對此沒有任何更改，因此可以自由返回并在頁面中查看相同的項目，每頁有25個項目，而前進則為每頁100個?？蛻艨梢噪S時更改過濾條件，例如加載100個項目，然后再次返回到25，我們應(yīng)該使用正確數(shù)量的項目重新加載該頁面。如果客戶在任何時候再次重新過濾列表，則該頁面和下一頁將顯示正確數(shù)量的項目。

要繼續(xù)學(xué)習(xí)如何創(chuàng)建良好的列表瀏覽體驗，請執(zhí)行以下操作：

永遠不要完全重置客戶的進度。

始終在當前頁面上注入或重置帶有選定數(shù)量的項目。

始終使用舊選項顯示以前的選項。

始終根據(jù)新的過濾器顯示下一頁。

對過濾器的任何更改將僅更新以下頁面。

當然，這些規(guī)則不適用于其余過濾器。我們將必須進行完全重置，這里沒有邏輯選項。如果您位于第3頁，則更改價格過濾器后就無法停留在該頁面上，您需要從0開始，因為您需要向后回顧任何新的更改。此邏輯規(guī)則集僅適用于每頁過濾器項。