在網(wǎng)站中使用動畫效果并不是什么新鮮事兒。建站早期，不少設(shè)計師經(jīng)常在自己的網(wǎng)站中放置gif動畫，但由于許多設(shè)計逐漸不能兼?zhèn)鋵嵱眯?，動畫效果慢慢成為糟糕的用戶體驗的代名詞。不過，近些日子隨著Html5技術(shù)的發(fā)展，依靠CSS3做出的動畫比Javascript的操作更簡單、瀏覽更順暢，因此動畫效果在歷經(jīng)起起落落之后再次回歸到大眾的懷抱，很多網(wǎng)站開發(fā)者開始重新思考怎樣將它更好地應(yīng)用到網(wǎng)站中。其實，適當(dāng)?shù)膭赢嬓Ч梢越o枯燥無味的用戶界面增加趣味，增添網(wǎng)站的個性化色彩，引起用戶的情感共鳴，提升用戶體驗，提高用戶轉(zhuǎn)化率。今天就帶大家一起看看H5動畫有哪些好處，以及在網(wǎng)站中可以怎樣使用。

在網(wǎng)站中使用H5動畫效果的好處：

1.增加趣味性

設(shè)計巧妙的動畫常常會給用戶帶來意想不到的驚喜，給網(wǎng)站增加一定的趣味性。Deal in就是一個很好的栗子，這個界面的底部有一個牛皮紙袋，看上去并沒有什么特別，但當(dāng)我們挑選好自己心儀的商品將它們添加到袋子中時，某一行的商品像是從紙上被撕下一樣。這種意料不到的操作雖然只是一個小細(xì)節(jié)，但卻能讓用戶產(chǎn)生興趣，激發(fā)他們的探索欲望。我們在自己網(wǎng)站的產(chǎn)品等頁面也可以使用恰當(dāng)?shù)膭赢嬓Ч?，給用戶提供預(yù)期之外的效果，讓他們更愉悅，更愿意在網(wǎng)站停駐瀏覽。

2.增添個性化色彩

動畫效果能夠給網(wǎng)站增添個性化色彩。在網(wǎng)站導(dǎo)航菜單處使用淡入的動畫效果，能給網(wǎng)站營造一種優(yōu)雅大方的感覺;在網(wǎng)站中使用滑出和傾倒讓屏幕上出現(xiàn)天女散花般的絢麗效果，這會樹立生動活潑的網(wǎng)站形象。不同形式的動畫效果會給用戶留下不一樣的印象，這種個性化色彩是網(wǎng)站的特色所在，能將其與對手網(wǎng)站區(qū)別開來。

Optimo's hats 這個網(wǎng)站就使用懸浮的動畫效果做出了很好的效果。當(dāng)你將鼠標(biāo)放在每個帽子的圖像上時，它們會微微翹起，下方就會出現(xiàn)每個帽子的名稱，移開時文本就會消失。這種動畫讓整個網(wǎng)站更顯典雅別致，也讓用戶在瀏覽上更加輕松。

3.引起訪客情感共鳴

在第二點中，小飛談到了動畫效果給網(wǎng)站帶來的個性化特征。其實網(wǎng)站的個性化特征從某種程度上彰顯著站長的性格偏好，如果某個網(wǎng)站上使用的動畫效果比較活潑，不難判斷出這個站長平時可能比較外向。對于網(wǎng)站訪客來說，他們能因此更直觀的認(rèn)識電腦或屏幕背后的那個人。而站長在通過訪客們表達(dá)對某種特效的好惡也能對用戶們有一定的了解。這樣一來，我們就能與用戶建立情感上的紐帶，更易引起用戶與網(wǎng)站的互動。而且，如果一些訪客比較欣賞網(wǎng)站上的某個動效，他們可能還會與朋友進(jìn)行分享，這有利于網(wǎng)站知名度的擴(kuò)大。