視差特效是目前最流行的網頁設計趨勢之一(yī)。在這個滾動動畫特效支撐之下(xià)，前景的元素和背景會在滾動浏覽時以不同的速度運動，營造出動感又(yòu)獨特的視覺體(tǐ)驗。

視差動效可以運用在絕大(dà)多數類型的網站當中，它是增強用戶參與度、提升用戶體(tǐ)驗的有效手段之一(yī)。視差特效的好處在于，它并不需要硬性的運用到每一(yī)個頁面當中，但(dàn)是，它還能促使用戶更加專注于網頁内容，提升整體(tǐ)的參與度。

視差特效讓網頁中的元素，相(xiàng)互之間有了距離(lí)和深度，換句話(huà)說，它讓網頁擁有了接近三維的視覺體(tǐ)驗，這也使得網頁有了接近沉浸式的體(tǐ)驗。

不過，視差特效的缺陷也很明顯，它在移動端上并不一(yī)定總是那麽好用。在視差特效的具體(tǐ)運用過程中， 有一(yī)些技巧和注意事(shì)項是不容錯過的，今天就爲大(dà)總結一(yī)下(xià)視差特效的 5 種運用技巧。

1,用動效來展示變化

設計師能夠使用視差動效來展示頁面中的變化。這些随着滾動而不斷運動的元素能夠傳達出時間、空間和位置上的關系。

視差特效和網站内容一(yī)起工作的時候，最能展現其中的變化。

在上面 Porsche Evolution 這個網站當中，不同時代的保時捷車型随着時間的變化而展現，背景的圖片場景也随之變化，如果你仔細聽(tīng)會發現音樂也會随着年代的變化而演變。

這種設計技巧會驅使着用戶滾動浏覽，因爲大(dà)家想看接下(xià)來會有什麽樣的變化。在這種視差滾動+時間軸的搭配之下(xià)，用戶可以從上到下(xià)浏覽，反過來看也很有意思。

Sonance 這個網頁當中的視差則呈現出另外(wài)一(yī)種變化，元素在頁面中的位置變化。視差特效成爲了網站導航模式中的一(yī)部分(fēn)，當用戶在浏覽的過程中，視差特效會告知(zhī)用戶他們所處的位置。

2,鼓勵用戶滾動浏覽

視差特效有利于交互，很大(dà)程度上是因爲它會鼓勵用戶持續不斷滾動浏覽頁面，讓用戶持續地參與到互動當中。

許多采用視差滾動的網頁會在首頁上就直接言明“Scroll”或者通過閃動的光标等方式，吸引用戶注意并鼓勵用戶滾動浏覽。

和其他的視差滾動的網頁設計不同，The Walking Dead Zombiefied 的頁面布局是橫向的，當用戶滾動頁面的時候，角色會随着滾動，穿過不同的場景，劇情也随之發展，頗爲有趣。

3,運動與色彩

視差特效的應用方式有很多種，其中最有趣的應用方式之一(yī)，是讓色彩和不同的内容結合到一(yī)起，用來展示不同的項目和元素。顔色的變化和動畫組合到一(yī)起，用交互來觸發，産生(shēng)全新的體(tǐ)驗。

色彩是最爲引人注意的設計工具，它在吸引用戶注意力上，效果非常明顯。

上面 Werkstatt 這個網頁就使用了白(bái)底和灰色的輪廓來勾勒出不同的項目闆塊，當光标懸停在不同的項目上的時候，這個區塊的項目圖片會出現色彩，這種組合效果并不複雜(zá)，卻非常有效，鼓勵用戶和單個項目進行交互。

Lois Jeans 則采用了另外(wài)一(yī)種搭配方式，設計師用不同的色彩來凸顯不同的活動和不同的主題，随着頁面滾動，背景的顔色随之變化，和前景滾動變化的圖片相(xiàng)搭配。

4,讓信息更容易被消化

視差特效還能幫助設計師将更複雜(zá)的信息或者大(dà)塊的信息，分(fēn)割成小(xiǎo)份，讓它更加易讀，也更加容易被消化。當你設計随着頁面運動的文本元素的時候，視差特效的這個特征會非常有用。不過在實際操作的時候，需要仔細斟酌内容的載體(tǐ)。

上面兩個網頁就采用了這一(yī)設計概念，不過在運用方式上略有不同。

Melanie 的個人頁面采用了單頁設計，她将頁面的一(yī)半用作導航，當你滾動的時候，頁面的一(yī)側不動，另一(yī)側會正常滾動，當你完成閱讀之後，會自(zì)然切換到下(xià)一(yī)個内容區塊。

Le Duc 餐廳的網頁當中，設計師按照(zhào)你的閱讀習慣和訂餐的方式，将菜單劃分(fēn)爲單獨的區塊。動畫很簡單，背景的魚起到了很好的裝飾性作用，用戶在浏覽的時候，能夠更好地了解訂餐的信息。

5,營造視覺奇觀

視差特效最重要的用途之一(yī)，是營造獨特的、拟真的視覺奇觀。設計師通過合理的素材搭配，借助動效和不同的設計技巧，來創造逼真、有趣的視覺體(tǐ)驗。

随着越來越成熟的3D設計讓卡通和接近現實的設計元素的設計成本變得低廉，像上面這個網頁，這些風格接近卡通，但(dàn)是視覺效果和形式感都極爲突出的元素，在視差動效下(xià)産生(shēng)了類似VR的視覺體(tǐ)驗。

而下(xià)面網頁的視差特效則采用的是更爲經典的設計，當用戶在浏覽的時候會因爲元素間不同的運動速度而産生(shēng)拟真的浏覽體(tǐ)驗。不過，這個網站的獨特之處在于，它是從下(xià)往上浏覽的，非常有意思。當用戶通過網站的不同區塊到達頂端的餐廳區域的時候，會感受到這個餐廳所處的位置之高，城市的天際線和CTA元素結合到一(yī)起，讓你不會錯過關鍵的信息。這樣的設計是教育性的，也是冒險的，但(dàn)是它确實創造了前所未有的體(tǐ)驗，令人難忘。