在長網頁設計中，怎樣讓用戶情不自禁地向下滾動？

+ 查看更多

 

最近這段時間，長滾動網頁和無限制滾動的設計越發受到用戶的歡迎。它的興起有兩個原因，一是長滾動設計貼合了用戶下意識滾動瀏覽的習慣，二是使用移動設備瀏覽網頁的用戶越來越多，用戶在移動設備上更習慣于不停的向下滾動頁面。而對于設計師來說，長滾動設計給他們打開了一扇新的大門；于站長們而言，長滾動設計也更加符合更多內容被用戶看到的訴求。當然，這種設計手法也有自己的弊端，由于用戶需要不斷向下滾動，這對網站內容的質量、導航和輔助元素的可用性都作出了一定的要求，甚至有時還要求使用動效等元素吸引用戶繼續滾動瀏覽。下面就是小飛整理的讓長滾動設計更符合用戶預期的5個方法。

 

 

 

盡管用戶幾乎從登入網頁的那一刻起就開始進行頁面滾動，網站首屏的內容也是十分重要的。因為它們往往直接決定著網站留給用戶的第一印象，影響著用戶對于后續內容的期待感。換言之，用戶是否會滾動頁面，直接取決于網站的首屏內容是否有趣。所以，為了讓用戶主動向下滾動，你需要提供足夠引起他們興趣的內容，將網站中最引人注意的部分置于首屏：

1. 有趣的事實（一定是可以吸引訪客、抓住他們注意力的內容、信息）

2. 引人入勝的視覺信息（訪客更易對包含信息的圖片等產生興趣）

 

 

 

有時候，讓訪客用戶進行頁面滾動最好的方法就是直接告訴他們。簡單來說，就是在頁面中提供視覺線索，比如下拉的箭頭或“向下滾動”的圖標文字，讓訪客知道點擊滾動即可獲取更多內容。下圖就使用了下拉箭頭來進行提示（不仔細看可能難以發現）：

 

 

 

 

導航菜單一直是網站的重要組成部分，它既能成就一個網站，也可能成為一個網站的敗筆。在長滾動設計的網頁中，可用性強的導航菜單就愈發重要了。不少用戶常在不斷向下滾動的過程中暈頭轉向，找不到回去或跳轉其他頁面的途徑，這不可避免地會帶來挫敗感。這時，我們不妨在網站中使用懸浮置頂或固定式的導航菜單，這一方面可以讓用戶始終掌握自己所處的位置，另一方面也方便用戶及時跳轉到其他頁面。

 

 

而在移動端網頁的設計中，導航菜單的布置還要多花心思。這是因為移動端屏幕比PC端的要小得多，讓導航菜單一直保持可見會占據不少空間。這時，最佳的解決方案就是讓導航菜單在用戶滾動時隱藏，而在用戶停止時顯現，方便用戶進行跳轉。

 

 

 

 

在長滾動頁面中，我們還可以使用一些創造性的效果，比如視差滾動、動畫效果等。這些有趣的網頁設計往往可以讓用戶的參與感更強，更想探索“接下來會發生什么？”。

比如在下圖中，將網頁分成幾個可滾動的區塊，每個區塊中使用不同的動效介紹網站內容。讓用戶在不斷的滾動當中，沿著我們設計好的路徑進行瀏覽。

 

 

視差滾動是另一個可以有效提升滾動體驗的流行動畫效果。視差效果是指在背景圖片和前景圖片創造一個移動的速度差，從而給網頁帶來更多深度和沉浸感。如果，你想要在網站中使用平整、線性的長滾動設計手法，不妨搭配視差效果，它能讓用戶更有身臨其境的瀏覽體驗。