在設計banner之前,我們需要先明白banner的定位與針對人群特征。通常,banner用來完成以下目標中的一個或多個:擴大品牌宣傳度,擴大產品宣傳度,為網站引流,達成銷售,或者進行注冊等等。
當明白了banner的定位與針對用戶群體,就有了一個大致的設計思路與框架,剩下的就是往上填充要素。那么banner應該包含什么樣的要素?
1.個性化或地域化
一個個性化的banner才能在網站上眾多的banner與其他要素中脫穎而出,而地域化的信息多數時候正是用戶需要的。banner上的內容大多都來自于其定位與用戶群體。來看一下下面的例子:
這兩個banner都來自“southwest”,其業務定位人群為德克薩斯州的奧斯丁的消費者群體。在左邊的banner的內容里,多次提到了德克薩斯州,甚至還采用了“角”這一容易讓人聯想到德州的詞匯來吸引瀏覽者的目光。而右邊的banner中,更是借中國的新年來進行促銷活動,贈與所有參與者中的4人獲得免費機票的機會。當有新年出行的計劃的國人看到這個banner時,想不被其抓住目光都難了。根據banner的針對用戶群體及其地理位置,在相關的季節性節日或流行文化潮流中產出對應的banner,獲得個性化差異,效果會非常好。
2.banner的色彩
在banner上的色彩要注意兩點,其一是banner本身的色彩構成,根據定位,選擇情緒化色彩或者品牌本身的代表色都是可行的。另外一點就是注意與頁面主體色之間的對比度,banner要足夠出眾抓住目光很大程度依賴于其與其他元素之間的對比。
3.詞匯與配圖的相輔相成
在banner上的配圖與文字,不應該分開來考慮。一個好的banner,需要做到的是圖片與文字的相輔相成,互相配合,起到相乘大于相加的效果。我們來看一下下面的實例:
左側的圖片是一款尼康相機的宣傳banner,借用了“鷹眼”這一圖像來凸顯其專業性。購買相機的用戶群體雖然關注相機本身的參數,但是要抓住他們的第一視覺,就決不能用參數來作為banner的主體內容。這一則banner成功的運用紅色的鮮明色彩與鷹眼要素抓住了網站用戶的目光,并且借用鷹眼成功的給用戶施加了第一印象,再在下方用小范圍的參數與相機圖片作詮釋補充。
右側的圖片同樣借用紅色抓住用戶視覺,借用濺射的圖形與突出的“big shop”結合,給用戶“血拼”的類似印象,調動用戶的購買情緒與積極性。
4.CTA按鈕
絕大多數的banner的點擊鏈接都是為了最終的轉化收益,因此CTA按鈕必不可少。在設計CTA按鈕時,注意內容與其鏈接頁面必須對應起來。比如一個免費注冊的CTA按鈕,連接到的頁面如果是網站主頁而不是注冊頁面,那么當用戶點擊后發現頁面內容與banner中的CTA無法對應時,他們只會迅速關閉頁面而不是重新尋找注冊頁面在哪里。
同時,在CTA按鈕顏色的選擇上,首先確保與banner的背景色保持高對比度。來看一下下面這兩個例子:
明顯看出,在CTA的設計上,右側圖片清晰明了,而左側的acer的banner如果不注意閱讀內容,根本不會注意“shop now”這一CTA元素的存在。
5.動效設計的注意事項
毫無疑問動效可以讓banner成功的吸引用戶的注意力。在許多的調查中,結果都顯示動效banner往往比靜態的banner做得更好。然而在設計banner的動效時,要注意一個度,設計不當的動效反而會起到反效果,讓用戶感到反感。
在動效的設計中,確保一個原則,背景顏色不要變動,僅僅更改banner上的文字與圖形效果。永遠不要使用閃爍的字體和令人眼花的特效,這只會起到抓住用戶眼球的效果卻不會吸引他們點擊,本末倒置。
總結
在做banner設計時,排在第一位的永遠都是對用戶群體以及產品的了解。沒有充足調查與準備下做出的banner,設計效果再好也不會提升轉化與收益。