當(dāng)前位置:首頁(yè) > 新聞中心 > 解決方案
如何提高網(wǎng)站landing page的轉(zhuǎn)化率責(zé)任編輯 :李飛    文章來(lái)源 :星翼創(chuàng)想(16qt59sf.cn)    發(fā)布時(shí)間 :2015-10-15    閱讀次數(shù):4272

有許多的網(wǎng)站設(shè)計(jì)師,在設(shè)計(jì)網(wǎng)站登陸頁(yè)(Landing Page)時(shí),為了達(dá)到吸引用戶眼球的目的,往往以霸占全屏的輪播大圖來(lái)吸引用戶,設(shè)計(jì)師的做法焦點(diǎn)都集中在讓大圖本身足夠震撼和吸引,以便使首頁(yè)能鎖住用戶的眼球。這是在設(shè)計(jì)網(wǎng)站登錄頁(yè)面時(shí)最常見的手法之一,通過(guò)大圖片的設(shè)計(jì),能迅速有效地傳播網(wǎng)站的價(jià)值和理念。但是除了簡(jiǎn)單讓全屏大圖左右滑動(dòng)以外,我們其實(shí)還能有其他更新鮮的表達(dá)方式,或者說(shuō),在用戶的期望之外,我們還能給到他們其他什么更加奇妙又更加人性化的體驗(yàn)?zāi)??帶著這些問(wèn)題,我們一起來(lái)跟深圳市星翼創(chuàng)想網(wǎng)絡(luò)科技有限公司來(lái)閱讀以下文章,學(xué)習(xí)一下其他優(yōu)秀的網(wǎng)站是怎樣設(shè)計(jì)landing page,提高landing page的轉(zhuǎn)化率的吧!


Nightowlinteractive

一組能切實(shí)提高轉(zhuǎn)化率的網(wǎng)站著陸頁(yè)設(shè)計(jì)

以紋理為背景,根據(jù)不同的文字滾動(dòng),深沉而富有一種復(fù)古和原始的基調(diào),如果你的表達(dá)內(nèi)容是以文字為主,可以考慮試試這類輪播方式。

Oficialanima

()

利用留白作為滾動(dòng)圖片的一個(gè)吸引的要素,奢華而充滿了空間的張力,頁(yè)碼的表現(xiàn)形態(tài)也與整體的視覺保持和諧。周圍配以相應(yīng)的文字,予以部分重疊,凸顯層次感和空間感。

thehugo

()

打開頁(yè)面也許除了圖案本身以外,幾乎無(wú)其他任何元素,只有當(dāng)鼠標(biāo)滾動(dòng)到下方時(shí),首屏的圖案瞬間轉(zhuǎn)變?yōu)閮?nèi)容背景。而在屏幕的左邊,有一個(gè)動(dòng)態(tài)的標(biāo)志,把背景和內(nèi)容做了更有趣的連接。這種新穎別致的方式,用在品牌介紹甚至是內(nèi)容詳細(xì)頁(yè)面都非常適宜。

Josephaavoue

http://www.josephaavoue.com/

也許這里的大圖不算大,但也在整個(gè)登陸頁(yè)占據(jù)了重要的焦點(diǎn)位置。設(shè)計(jì)師為了凸顯焦點(diǎn)也運(yùn)用了線條和圖形來(lái)引導(dǎo)用戶的視線。左邊文字右邊圖片,能夠把內(nèi)容表達(dá)得更為清晰,但整個(gè)頁(yè)面元素比較累贅,所幸線條的排版和色彩運(yùn)用得恰到好處。

Thebarkas

http://thebarkas.com/

可以看到從一個(gè)圓形到變作條紋再渾然一片整屏漸變,視覺既簡(jiǎn)單,又充滿了動(dòng)感,鼠標(biāo)根據(jù)不同的角度而讓背景色發(fā)生變化。不過(guò)這樣做的前提是選擇一個(gè)足夠沖擊力和字體和標(biāo)志。讓它成為視覺焦點(diǎn)。

Special.bose

http://special.bose.eu/fr/

豎型展示也許已經(jīng)足夠新穎了,但在這個(gè)網(wǎng)站設(shè)計(jì)中還略微傾斜的展示方式,讓頁(yè)面更加具有新鮮和沖擊力。鮮艷的色彩搭配更強(qiáng)調(diào)了這一效果。

Fixedgroup

8

把圖片一割上下兩部分,然后用陰影創(chuàng)建圖片的層次,讓畫面顯得更縱深,某種程度上體現(xiàn)了優(yōu)雅氛圍。但需要注意的是,必須是圖片本身是有分割的潛力的情況下。有的圖片分割后也許會(huì)顯得非常錯(cuò)愕。

Ginventory

http://www.ginventory.co/

這是一個(gè)介紹APP的網(wǎng)站,可以看到手繪的固定背景之上不斷變幻的應(yīng)用界面演示效果,動(dòng)態(tài)效果非常炫酷。讓人過(guò)目不忘。這種單一的背景讓人鎖定了品牌的內(nèi)涵氣質(zhì)。

Thisisarc

http://thisisarc.com/

多以大圖來(lái)吸引用戶的策略也可以被文字所取代,這時(shí),文字搭配一些出乎意料的動(dòng)態(tài)效果和簡(jiǎn)單的弧形線條,發(fā)揮了圖片所不能抵達(dá)的目的,精準(zhǔn)地表達(dá)代替了圖片的模擬兩可。

Cafefrida

http://cafefrida.ca/

咖啡館的格調(diào)自然是優(yōu)雅的,那就用一張插圖作為登陸頁(yè)背景吧。但是僅僅是花朵插畫嗎?把你的鼠標(biāo)往下拖動(dòng),你會(huì)發(fā)現(xiàn),邊緣的部分花朵疊加于內(nèi)容之上,看上去就像從花叢中觀看過(guò)去,十分精致美好。這種獨(dú)具匠心的網(wǎng)頁(yè)設(shè)計(jì)技巧,設(shè)計(jì)師們,學(xué)起來(lái)吧!



文章轉(zhuǎn)載請(qǐng)保留網(wǎng)址:http://16qt59sf.cn/news/solutions/1513.html

掃碼添加微信
159 8667 8737
24小時(shí)電話

返回頂部