1、創造真正擁有高參與度的內容
不論如何設計,網頁核心的內容質量首先得過硬。再好的設計也無法掩蓋內容的空洞和素質,所以首先要有高質量的內容。同時,內容還要和整體設計有效得搭配起來。想要創造優質的內容,有幾個方法能夠幫到你:
- 將你的內容轉化為引人入勝的故事。
- 借助高分辨率、高素質的視覺內容,比如高清圖片、視頻和精緻的插畫。
- 給用戶一個滾動的理由(比如讓故事在關鍵的位置“未完待續”)。
- 控制選項數量。讓用戶面對的選擇數量盡可能少,不要讓太多的選擇給用戶造成壓力,每個部分盡量只使用一個號召性的文案或者按鈕。
- 採用讓人好奇的文案。視覺效果可以給人良好的第一印象,但是好的內容,勾人的文案就更好了。盡量使用動詞,並且搭配讓人原因沉浸的故事。
2、構建視覺主題
風格明顯,鮮明的主題能夠幫助用戶更好地了解故事或者頁面的內容,擁有沉浸式的體驗。主題中可以搭配一些視覺線索,比如箭頭,分割線,或者其他的指引性視覺元素,幫助用戶更為清晰地明白內容之間的關係,在瀏覽過程中,更好地穿梭於內容之間。視覺化的主題設計和合理的視覺引導機制,能夠讓長滾動網頁這種設計更好地服務於你的網站和內容。同時,你還需要注意數據上的變化。在採用長滾動頁面之前,用戶的留存率是否更高?用戶主要的互動內容是否有所變化?預期的轉化率是否達到了?等等等等。如果視覺化的設計並沒有有利於整個長滾動頁面,你需要考慮主題是否影響了內容的展示,或者是否同用戶群相匹配。
3、令人愉悅的交互
長滾動頁面在移動端和桌面端都能夠良好的運作,很大程度上這是設計師喜愛它的原因之一。許多用戶其實更加喜歡滾動而不是點擊,而在移動端上,這種交互上的傾向表現得更加明顯。使用長滾動頁面,瀏覽獲取信息的體驗更順滑。使用各種滾動特效和技術比如視差特效,色塊遮蓋和混搭式排版(比如讓文本、視頻、圖片等內容塊混搭,降低用戶瀏覽負荷)來保持整個設計順暢。搭配滾動觸發式的視差特效和滾動動畫,保持用戶的參與性和趣味性,鼓勵用戶繼續滾動瀏覽。
5、讓長滾動內容和短滾動內容交替出現
在長滾動頁面當中,有些內容需要快速滾動瀏覽,而有的內容則需要用戶仔細閱讀,逐步查看,這些長滾動和短滾動的內容應該交替出現,分段搭配。比如大片的圖片就是易於消化的內容,用戶會快速滾動查看,而包含文本的內容,則常常需要用戶停下來,逐行滾動查看,你需要讓這些不同的內容長短搭配起來,這樣不僅讓交互更加富有韻律,而且讓頁面更加從容地加載。
6、為用戶提供路線圖
長滾動頁面所需要面臨一個非常實際的問題,就是導航和視覺線索,用戶需要知道他們瀏覽到了什麼位置,以及他們距離頁面的首位有多遠。路線圖和導航是非常重要的。目前常見的模式有以下幾種:
- 懸浮導航
- 使用小點或者其他替代元素來告知用戶進度
- 使用箭頭和符號來告訴用戶接下來的操作
- 提供快速跳轉到開頭和結尾的按鈕
7、設計出清晰的目標
長滾動頁面不應該是無限的。設計的時候,應該能夠讓用戶明白從哪裡開始,以及最終的結束會在什麼地方。無論整個頁面的設計有多酷,總需要讓用戶明確目標和結果。在你明確整個設計之前,你應該勾畫出最終的目標。確保整個長滾動頁面的每個部分都是為了呈現最終的結果而存在。看看上面的案例,頁面的每個部分都包含一個明確的CTA按鈕,並且帶有明顯的指引性語言,它位於中心的位置,易於查看和點擊。你必須承認,並不是每個用戶都能夠堅持滾動到整個頁面的界面的結尾。你需要在頁面中插入一些CTA按鈕,讓用戶可以在不同的位置參與交互,達到他們想要的結果。
結語
雖然長滾動頁面已經不再是什麼新鮮的東西,但是它的UX設計和交互模式依然還在不斷成長,逐漸成熟。現如今,設計師和網頁設計相關的社區依然在探討它的利弊,作為設計師,你應該仔細衡量你的目標,再選擇是否使用長滾動網頁設計。