網(wǎng)頁(yè)設(shè)計(jì)中吸引用戶(hù)注意力的5個(gè)技巧

2017-02-18    分類(lèi): 網(wǎng)站建設(shè)

網(wǎng)站內(nèi)容的某些部分比其他部分更重要,這是事實(shí),比如說(shuō),幾乎可以肯定,“立即購(gòu)買(mǎi)”按鈕比整個(gè)“關(guān)于我們”頁(yè)面更為重要,如果您確實(shí)希望進(jìn)行這種銷(xiāo)售,則需要相應(yīng)地確定用戶(hù)的關(guān)注重點(diǎn)。這就是成都網(wǎng)站建設(shè)公司的小編這篇文章的原因:您可以將其稱(chēng)為控制焦點(diǎn)的新手指南。

您將以一種自然的方式一步步構(gòu)建網(wǎng)站。

我的姐姐過(guò)去常常莊重而鎮(zhèn)定地控制我的注意力,不管在什么地方,一天要跟我說(shuō)15到40次:“回去寫(xiě)作業(yè)”。但是您的用戶(hù)不會(huì)像單曲循環(huán)那樣全神貫注地完成瀏覽您的網(wǎng)站,你需要做點(diǎn)什么來(lái)吸引他們。

號(hào)召性用語(yǔ)(例如“購(gòu)買(mǎi)”按鈕)需要看起來(lái)不錯(cuò)。

1.對(duì)比

吸引眼球的第一個(gè)也是最簡(jiǎn)單的方法是使用對(duì)比度?!皩?duì)比”是指設(shè)計(jì)的重要元素必須以有意義的方式與眾不同??纯次以谀抢镒鍪裁?

現(xiàn)在,討論幾種對(duì)比:

●亮/暗對(duì)比

●色彩對(duì)比

●尺寸對(duì)比

●風(fēng)格對(duì)比

其中大多數(shù)都是自我解釋?zhuān)屛覀冏屑?xì)研究一下。

光線(xiàn)暗

明亮的事物與黑暗的事物脫穎而出,反之亦然。很簡(jiǎn)單,對(duì)吧?好吧...這取決于,如果您的網(wǎng)站大部分內(nèi)容都很明亮,那么將號(hào)召性用語(yǔ)設(shè)置得又大又暗(或者至少比其他所有內(nèi)容都暗些)。

光線(xiàn)暗的網(wǎng)頁(yè)

但是,有很多設(shè)計(jì)都具有高明暗對(duì)比,這是整個(gè)布局的特征,并且這種對(duì)比可以使所有東西都具有結(jié)構(gòu)感。在這種情況下,您將需要使用另一種對(duì)比來(lái)引導(dǎo)人們的注意力。

顏色

這是不言自明的。光彩奪目的顏色,甚至只是不同的顏色,足以使事物脫穎而出。在此示例中,顏色用于消除大量排版干擾。

網(wǎng)頁(yè)上的顏色

尺寸

使重要按鈕大于其他按鈕;使標(biāo)題文字大于其他文字。大小對(duì)比不僅可以使事物脫穎而出,而且還有助于在頁(yè)面中建立層次結(jié)構(gòu)。

突出網(wǎng)頁(yè)中重要按鈕

樣式

風(fēng)格上的差異可以用我之前做過(guò)的粗體文字笑話(huà)來(lái)說(shuō)明。但是,要看一個(gè)更注重UI的示例,我們來(lái)談?wù)劇癎host按鈕”。Ghost按鈕是帶有輪廓但沒(méi)有背景色的按鈕,通常與常規(guī)按鈕結(jié)合使用,例如IndieGoGo的主頁(yè)上:

網(wǎng)頁(yè)樣式

我敢打賭,您可以說(shuō)出他們真正要您單擊哪個(gè)按鈕。風(fēng)格上的對(duì)比使這一點(diǎn)很清楚。

2.圖片

無(wú)論我們是在談?wù)摂z影,插圖,繪畫(huà)或3D圖形,圖像都能吸引眼球。您可以輕松地通過(guò)圖片重定向任何人的注意力。唯一真正的例外是被其他圖片包圍的圖片。

當(dāng)然,您可以將圖像用作它們自己的焦點(diǎn)對(duì)象,但也可以使用它們來(lái)吸引其他事物,例如文本或放置在其上方的按鈕。您不認(rèn)為這些只是漂亮的背景,對(duì)嗎?那可能是事情開(kāi)始的方式,但是如今,一切都經(jīng)過(guò)了更多的計(jì)算。

如果您真的想全力以赴,請(qǐng)以圖片指向的方式發(fā)出號(hào)召。這就是所謂的“協(xié)同作用”,盡管聽(tīng)起來(lái)聽(tīng)起來(lái)很有合作精神,但它往往會(huì)起作用。

網(wǎng)頁(yè)上的背景圖

3.動(dòng)畫(huà)

如果您認(rèn)為我們喜歡圖片,那么讓我告訴您有關(guān)動(dòng)態(tài)圖片的信息。沒(méi)錯(cuò),但是,如果房間中沒(méi)有其他有趣的事情發(fā)生,那么無(wú)論播放什么,我的眼睛都會(huì)無(wú)情地吸引著剩下的電視??赡苁求w育比賽,白天脫口秀,甚至是肥皂劇,我都很難將視線(xiàn)移開(kāi)。我們大多數(shù)人都會(huì)。

運(yùn)動(dòng)就是那樣吸引眼球。它最初是作為生存反射,現(xiàn)在我們只需要知道Brian是否會(huì)重拾記憶并與Patricia結(jié)婚,或者她是否會(huì)永遠(yuǎn)被邪惡的雙胞胎Drake困住。通過(guò)將一些動(dòng)畫(huà)效果融入按鈕,有用的工具提示以及您真正希望人們首先閱讀的任何文本等內(nèi)容中,從而利用反射效果來(lái)發(fā)揮自己的優(yōu)勢(shì)。

動(dòng)圖網(wǎng)頁(yè)示例

4.慣例

最后,利用用戶(hù)的默認(rèn)行為模式。作為網(wǎng)絡(luò)用戶(hù),我們大多數(shù)人都受過(guò)訓(xùn)練,可以在頂部搜索導(dǎo)航,在其下方搜索號(hào)召性用語(yǔ),在底部搜索更多的CTA。將重要的信息和功能放在人們期望找到的地方是一種完全有效的策略。

還請(qǐng)記住,您是為從右到左還是從左到右閱讀的人設(shè)計(jì)的。例如,說(shuō)英語(yǔ)的人通常會(huì)首先看著屏幕的左側(cè)。雖然有話(huà)要說(shuō)打破常規(guī),但不要低估簡(jiǎn)單卻根深蒂固的習(xí)慣的力量。

利用用戶(hù)習(xí)慣設(shè)計(jì)的網(wǎng)頁(yè)

5.少用重點(diǎn)

當(dāng)所有內(nèi)容都是粗體時(shí),粗體文本往往會(huì)模糊在一起,而不是將重要信息消耗到用戶(hù)的大腦中。如果頁(yè)面上有很多圖片,并且您沒(méi)有運(yùn)行攝影作品集,則用戶(hù)可能會(huì)分心。而且不要讓我開(kāi)始過(guò)度使用動(dòng)畫(huà)。當(dāng)一切進(jìn)展順利時(shí),您如何期望他們閱讀長(zhǎng)于一句話(huà)的任何文本?

要將用戶(hù)的注意力真正吸引并集中在一兩件事上,您需要消除或至少不加強(qiáng)調(diào)可能吸引他們注意力的事物。與其他網(wǎng)站競(jìng)爭(zhēng),而不是與您自己的內(nèi)容競(jìng)爭(zhēng)。

名稱(chēng)欄目:網(wǎng)頁(yè)設(shè)計(jì)中吸引用戶(hù)注意力的5個(gè)技巧
文章路徑:http://muchs.cn/news31/74081.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站設(shè)計(jì)網(wǎng)站導(dǎo)航、軟件開(kāi)發(fā)、App設(shè)計(jì)、動(dòng)態(tài)網(wǎng)站面包屑導(dǎo)航

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀(guān)點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話(huà):028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

成都app開(kāi)發(fā)公司