你的產品正在無限滾動Infinite scrolling嗎？
『此篇文章會著重於無限滾動 (Infinite scrolling) 的體驗，用一句話說明無限滾動現在遇到的狀況：The content is endless, but user patience is not. ( 你的內容是無盡的，但使用者的耐心卻不是 )。』
當用戶向下滾動頁面時，無限滾動體驗會不斷加載內容給用戶，從而提供不斷增長且看似永無止境的資料，所以又稱：惰性滾動、懶載入(lazy loading)、瀑布流等名稱。
無限滾動也因 Twitter、Facebook、Pinterest 等社交媒體平台上的成功而廣受歡迎，但此體驗並不適用於所有類型的內容， 如果你的產品是結構相對扁平的內容來說是很適合的，而無限滾動在設計上要注意的：
01.道德設計( Ethical Design )
2019年美國參議Josh Hawley提到社交成癮減少技術(Social Media Addiction Reduction Technology，SMARTA) ， 許多大型公司的商業模式都依靠著用戶的成癮性，除了許多知名社交平台上的無限滾動外還有像是Youtube 的自動播放以及Snapchat要求用戶在每天都要上傳一張照片帶來的用戶無意識上癮行為。
Josh Hawley：「許多產品的“創新”不是為了創造更好的產品，而是利用讓人難以 移開視線的心理技巧和設計來吸引更多的注意力。」
社交媒體成癮的普遍性和道德影響問題到現在仍有辯論的空間，需要更多的研究來得出關於更有說服力的設計，例如無限滾動，如何做出明確的貢獻以及結論。
02.無障礙規範( Accessibility Guidelines )
無限滾動是不符合無障礙設計規範的，也對殘障者是不友善的，像是常常依靠輔助科技來進入下一頁的用戶。無限滾動導致網站上的側邊欄和其他相關頁面可能會在不斷加載內容的界面上受到阻礙，此過程違反了Web 內容可訪問性指南 ( Web Content Accessibility Guidelines )， 也會影響到這些使用者：
- Web/ 本機移動可用性
- 有認知障礙的用戶
- 低視力用戶
- 不使用開關設備的運動障礙用戶
- 使用開關設備的用戶（行動不便的人）
- 螢幕閱讀器用戶
- 語音識別
- 只用鍵盤的用戶
03.無限滾動與CLS( Cumulative Layout Shift )
Google評分當中的網站使用體驗核心指標報告指出 LCP、FID、CLS 這三大指標，而其中的累計版面配置轉移CLS(Cumulative Layout Shift) 是三項核心指標裡的「頁面穩定性」代表，當中又分為可預期和不可預期的位移。計算方式為元件移位分數 (layout shift score)=影響範圍 (impact fraction) *移動距離(distance fraction)。
可預期的版面配置轉移( Expected layout shifts )
不會影響到分數，這時候頁面因為有明顯的收合/展開按鈕，而導致的版面配置轉移是可以預期的。因此，Google 不會將此判定為是頁面的不穩定性。
不可預期的版面配置轉移( Unexpected layout shifts )
會影響到分數，不可預期的版面配置轉移通常是因為網頁內的元素載入順序不同而造成的。你是不是曾有過某一個網站版面會不斷的跳來跳去，導致你按下去之後導到錯誤的頁面當中，評分範圍從 0 到正數，其中 0 表示沒有任何位移，而數字越大表示網頁上發生的位移越多，如上圖。這項指標的重要性在於如果網頁元素在使用者嘗試與網頁互動時移動了位置，會對使用者體驗造成負面影響。
04.無限滾動返回 上一頁的位置偏移或錯誤
你是否曾經有過使用無限滾動的產品上，點了某樣產品進到下一個分頁，但是返回上一頁的時候，卻不是你當初點擊前離開的位置，而是回到最上方或者是錯誤位移的情況發生，如右圖，導致你必須重新向下滾動到原始位置去繼續瀏覽。
平常也使用了許多無限滾動設計的產品，像是Dribbble、behance，他們都是點擊之後會在視窗內彈出一個較小一點的視窗，而不是切換整個頁面。我想這是採用Modal的形式，在返回互動上與無限滾動當中取一個平衡的設計手法。
不過這邊也要注意到產品的性質來決定你的設計模式，一種模式沒辦法套用到所有的產品上，當你希望使用者專注在這頁的時候，你可能就會採用切換整個頁面的設計模式。
05.無限滾動 不適合目標導向用戶
記憶點
由於無限瀏覽的產品通常數據量很大，因此用戶是以目標導向 ( Drive-goal user ) 搜尋某種訊息，無限滾動的形式對他們來說是沒有幫助的，也相對Pagination的設計來說，沒有頁數概念的記憶點去更有效率地找到他們的資料，離開之後下次要找到相同產品時，有頁數的記憶點遠勝過無限滾動。
人們要將返回搜索結果列表，以查看他們剛剛看到的項目，並將其與列表中的其他地方發現的其他項目進行比較。具有分頁的介面使用戶可以保持商品的心理位置。他們可能不一定知道確切的頁碼，但是他們會大致記住那是什麼，而分頁的形式使他們更容易到達位置。
Dmitry Fadeyev 在著作「當無限滾動不起作用時」提到，無限滾動不僅破壞了這種形式，而且還使列表上移和下移變得困難，尤其是當您在另一時間返回頁面並回到頂部時，使用者被迫再次向下滾動，並花更多時間等待內容加載。這樣對於用戶體驗來說，無限滾動設計實際上比分頁的介面來的還要慢。
使用者控制權
當使用者搜索時，有頁碼的設計( Pagination) 讓他們知道搜索結果的確切數量，如上圖。使用者可以明智的決定在哪裏停止或細讀多少結果，因為他們看得到終點，也根據人機交互領域進行的研究，達到終點提供的一種控制感， 使用者知道所有相關結果，並看到尋找該結果的框架，有助於用戶做出更明智的決定，而不任使用者去無限滾動這些內容。
最後說說無限滾動的替代方案：
Pagination 分頁
分頁可能是組織 Web 內容最明顯的方法。它涉及將內容架構分成不同的頁面，每個頁面都限定住數量的項目。顯而易見搜尋的結果，並帶給使用者他們所期望的，缺點應該就是沒有任何驚喜。
分頁為用戶清楚的提供了物品所在位置。例如，一個電子商務網站上購買帽子的用戶可能會看到第四頁，並意識到挑選的東西越來越少，回想一下他們最喜歡的帽子可能在第二頁上面或附近， 返回到第二頁對於使用者來說是一個很簡單的任務。
Load more button 加載更多按鈕
加載更多按鈕通常放置於內容下方，明確的指引用戶是否想要查看更多結果。與無限滾動不同，他不假設使用者行為，給了用戶一個自然的停止點，給了用戶更多的控制權，也讓使用者在這時候可以訪問頁腳內容或是加載更多。
與分頁不同地方是，加載更多按鈕不會將內容架構分成不同的頁面呈現，加載更多的設計體驗與無限滾動是略有相似的，當使用者多次按下加載更多後，也有可能會遇到無限滾動的一些缺點或是使用者找不到目標的情況發生。