控制注意力的5個網頁設計技巧
發(fā)布者:網上發(fā)布
??網站設計內容的某些部分比其他部分更重要,就比如“立即購買”按鈕幾乎肯定比整個“關于我們”頁面更為重要,如果你真的想要銷售,你需要相應地引導用戶的注意力。這就是此篇文章存在的原因:你可以把它稱之為網站設計新手的控制焦點指南。您將以這樣一種方式構建您的網站,即眼睛自然地從一個步驟吸引到下一個步驟。例如,對“購買”按鈕的調用需要看起來不錯。
??1、對比
??第*個也是*簡單的吸引眼球的方法是使用對比,通過“對比”,意思是一個設計的重要元素需要以一種有意義的方式從其他元素中脫穎而出,可以做些什么?
??現(xiàn)在,有幾種對比需要討論:
??光明/黑暗的對比
??顏色對比
??大小的對比
??對比鮮明的風格
??這些大部分都是不言自明的,但是我們來復習一下。
??光明/黑暗
??光明的東西比黑暗的東西突出,反之亦然,視情況而定。如果你的網站設計中大部分都很明亮,那么讓你的行動大而暗(或至少比其他任何東西都暗一點)是有意義的。然而,在很多網站設計中,高光/暗對比是整個網站布局的一個特點,而這種對比被用來給所有的東西一種結構感。在這種情況下,你需要使用另一種對比來引導人們的注意力。
??顏色
??這個是不言自明的,一抹顏色,甚至是一種不同的顏色,都足以讓你脫穎而出。在本例中,顏色用于消除大量的印刷干擾。
??大小
??讓重要的按鈕比其他按鈕大,讓你的標題文本比其他文本更大。大小對比不僅可以使事物突出,而且有助于在頁面中建立層次結構。
??風格
??網站設計的風格差異可以通過之前制作的粗體文字笑話這樣簡單的東西來說明。但是,為了看一個更注重UI的例子,我們來談談“Ghost按鈕”。 Ghost按鈕是帶有輪廓但沒有背景顏色的按鈕,它們經常與常規(guī)按鈕組合使用,例如IndieGoGo的主頁:你肯定能分辨出他們真正想讓你點擊哪個按鈕,因為風格上的對比說明了這一點。
??2、圖片
??無論我們談論的是攝影、插畫、繪畫還是3D圖形,圖像都會吸引眼球。你可以很容易地用一張圖片轉移任何人的注意力,**真正的例外是被其他圖片包圍的圖片。當然,您可以使用圖像作為焦點對象,但是您也可以使用它們來將眼睛吸引到其他事物上,比如文本或放置在它們上面的按鈕。你不認為那些只是漂亮的背景,是嗎?事情可能就是這樣開始的,但現(xiàn)在一切都是經過精心計算的。如果你真的想全力以赴,那么就把你的行動號召放在這樣一種方式,它看起來就像圖片指向它一樣。這就是你的經理所說的“協(xié)同作用”,盡管聽起來非常合群,但它往往會奏效。
??3、動畫
??如果你認為我們喜歡圖片,讓我來告訴你關于會動的圖片。如果房間里沒有什么更有趣的事情發(fā)生,我的眼睛就會無情地被任何一直開著的電視吸引,不管正在播放什么。可能是體育節(jié)目,日間脫口秀,甚至肥皂劇,我很難把視線移開,我想大多數(shù)人都會。
??動作就是這樣吸引眼球的,一開始只是一種生存的本能反應,現(xiàn)在我們只需要知道布萊恩是否會重獲記憶并與帕特麗夏結婚,或者帕特麗夏是否會永遠被他邪惡的雙胞胎德雷克所困。通過在按鈕、有用的工具提示和任何你想讓人們先閱讀的文本中加入一些輕松的動畫,充分利用這種反射。
??4、公約
??最后,利用用戶的默認行為模式,作為web用戶,我們大多數(shù)人都接受過這樣的訓練,即在頂部附近尋找導航,在底部尋找更多的cta。把重要的信息和功能放在人們希望找到它們的地方是一個非常有效的策略。
??同時也要記住你是為那些從右向左閱讀的人設計網站,還是為那些從左向右閱讀的人設計網站。例如,說英語的人在大多數(shù)情況下會先看屏幕的左側。雖然打破常規(guī)是有道理的,但永遠不要低估簡單但根深蒂固的習慣的力量。
??5、謹慎使用重點
??當所有網站設計的內容都使用粗體時,粗體文本往往會模糊在一起,而不是將重要信息輸入用戶的大腦。當頁面上有許多圖片,而您沒有運行一個攝影作品集時,用戶可能會分心,所以說也不要過度使用動畫。當所有的東西都在動的時候,你怎么能指望他們讀你的任何超過一句話的文字呢?
??為了真正吸引并將用戶的注意力集中在一到兩件事情上,您需要消除或至少減少那些可能爭奪用戶注意力的事情,與其他網站設計競爭,而不是你自己的內容。