讓一個(gè)網(wǎng)站看起來酷炫,豐富,具有吸引力。你可以添加多種多樣的網(wǎng)頁設(shè)計(jì)效果和技巧。而視差滾動(dòng)效果則是其中一個(gè)很不錯(cuò)的選擇。雖然現(xiàn)在長滾動(dòng)頁面的設(shè)計(jì)運(yùn)營的很廣泛,但是也不能為了做長滾動(dòng)頁面而去做,作為企業(yè)來說應(yīng)該充分考慮到行業(yè)、產(chǎn)品特征,而作為網(wǎng)站設(shè)計(jì)公司的設(shè)計(jì)師來說的話應(yīng)該充分考慮到用戶的特性以及瀏覽需求。那么如果在考慮好前提條件的情況下,長滾動(dòng)頁面應(yīng)該如何去設(shè)計(jì)?下面小編就為大家分享解決這個(gè)問題的技巧和方法。
1、充分運(yùn)用滾動(dòng)特效和技術(shù)
長滾動(dòng)頁面在移動(dòng)端和桌面端都能夠良好的運(yùn)作,很大程度上這是設(shè)計(jì)師喜愛它的原因之一。
許多用戶其實(shí)更加喜歡滾動(dòng)而不是點(diǎn)擊,而在移動(dòng)端上,這種交互上的傾向表現(xiàn)得更加明顯。使用長滾動(dòng)頁面,瀏覽獲取信息的體驗(yàn)更順滑。
使用各種滾動(dòng)特效和技術(shù)比如視差特效,色塊遮蓋和混搭式排版(比如讓文本、視頻、圖片等內(nèi)容塊混搭,降低用戶瀏覽負(fù)荷)來保持整個(gè)設(shè)計(jì)順暢。搭配滾動(dòng)觸發(fā)式的視差特效和滾動(dòng)動(dòng)畫,保持用戶的參與性和趣味性,鼓勵(lì)用戶繼續(xù)滾動(dòng)瀏覽。
2、讓長滾動(dòng)內(nèi)容和短滾動(dòng)內(nèi)容交替出現(xiàn)
在長滾動(dòng)頁面當(dāng)中,有些內(nèi)容需要快速滾動(dòng)瀏覽,而有的內(nèi)容則需要用戶仔細(xì)閱讀,逐步查看,這些長滾動(dòng)和短滾動(dòng)的內(nèi)容應(yīng)該交替出現(xiàn),分段搭配。
比如大片的圖片就是易于消化的內(nèi)容,用戶會(huì)快速滾動(dòng)查看,而包含文本的內(nèi)容,則常常需要用戶停下來,逐行滾動(dòng)查看,你需要讓這些不同的內(nèi)容長短搭配起來,這樣不僅讓交互更加富有韻律,而且讓頁面更加從容地加載。
3、為用戶提供路線圖
長滾動(dòng)頁面所需要面臨一個(gè)非常實(shí)際的問題,就是導(dǎo)航和視覺線索,用戶需要知道他們?yōu)g覽到了什么位置,以及他們距離頁面的首位有多遠(yuǎn)。
路線圖和導(dǎo)航是非常重要的。目前常見的模式有以下幾種:
懸浮導(dǎo)航
使用小點(diǎn)或者其他替代元素來告知用戶進(jìn)度
使用箭頭和符號(hào)來告訴用戶接下來的操作
提供快速跳轉(zhuǎn)到開頭和結(jié)尾的按鈕
雖然長滾動(dòng)頁面已經(jīng)不再是什么新鮮的東西,但是它的UI設(shè)計(jì)和交互模式依然還在不斷成長,逐漸成熟。針對(duì)長滾動(dòng)頁面設(shè)計(jì)需要分享的還有很多,歡迎大家與小編一同交流,相互探討,一起進(jìn)步。
Copyright 2016 重慶逍俠網(wǎng)絡(luò)科技有限公司 www.a5ww.com
all rights reserved. 渝ICP備17000924號(hào)
地址:重慶市萬州區(qū)金泉路1號(hào)匯杰人才市場(chǎng)內(nèi)