對于品牌網(wǎng)站建設(shè)來說宣傳是必不可少的，我們更多的選擇使用banner圖來傳遞我們網(wǎng)站上的主要信息，好的banner圖可以獲得訪客的關(guān)注，起到宣傳和銷售的效果。然而很多設(shè)計師在制作banner圖時，不知道該從哪作為突破口，今天我們來分享下網(wǎng)站banner圖如何設(shè)計以及需要注意哪些問題。

banner的設(shè)計如此重要，那優(yōu)秀的banner有哪些共性呢？

● 有強烈的視覺沖擊力，在第一時間抓住訪客的注意力

● 每張banner只傳達一個概念或觀點

● 色彩搭配與網(wǎng)站整理協(xié)調(diào)，符合自己品牌的形象和人群對品牌熟知的認同感

● 正確的對比度，與CTA元素相區(qū)別，襯托而不喧賓奪主

● 匹配頁面主題，幫助標(biāo)題直達瀏覽者最關(guān)注的問題

我們在設(shè)計banner時，經(jīng)常會發(fā)生因設(shè)計不當(dāng)導(dǎo)致banner被忽略的問題，直接影響點擊率，那體驗效果好的banner圖應(yīng)如何設(shè)計呢？

一、內(nèi)容為王，banner圖上的內(nèi)容，一定程度上決定了圖片的質(zhì)量，不相關(guān)的內(nèi)容會給客戶帶來不好的體驗，需要注意以下幾點：

1.文案內(nèi)容。獨特而有個性的文案內(nèi)容可以拉近我們的產(chǎn)品和訪客的距離，好的文案一般是直觀、簡短、可以引導(dǎo)用戶執(zhí)行某些操作。

1） 突出產(chǎn)品的主題，讓客戶一目了然，如下圖：網(wǎng)站上產(chǎn)品眾多，將主推廣的產(chǎn)品放置在banner圖上，文案內(nèi)容突出我們是專業(yè)的泵制造商，按鈕設(shè)計引導(dǎo)客戶繼續(xù)點擊查看產(chǎn)品詳情介紹。

2） 突出企業(yè)品牌和文化。在banner圖設(shè)計時注意與公司的企業(yè)文化、品牌定位及形象相結(jié)合，這些都可以通過banner的風(fēng)格、色彩、和文字直接體現(xiàn)。如下圖：根據(jù)產(chǎn)品的類型定位簡約的風(fēng)格，設(shè)計中融合了客戶的logo，注重客戶的品牌宣傳。

二、善用CTA按鈕。

CTA是常見的用戶交互元素，如：“閱讀更多 ”“立即注冊”等按鈕，好的CTA設(shè)計是轉(zhuǎn)化的重要步驟，可以引導(dǎo)客戶進行下一步的操作，那我們在設(shè)計banner圖上的CTA時要注意哪些方面呢？

1.放置位置。放置位置建議在文案信息后，引導(dǎo)客戶看完我們的營銷信息后進行下一步操作。

2.CTA的形狀建議使用按鈕形式，經(jīng)測試得出：使用按鈕形式的CTA點擊率會比其他的樣式更高。

3.顏色。一般來說紅色、綠色、黃色是轉(zhuǎn)化率較高的顏色，但我們在制作banner圖時也要結(jié)合網(wǎng)站的整體風(fēng)格及l(fā)ogo色調(diào)來設(shè)計。

4.大小。按鈕的尺寸建議略短于上方文案內(nèi)容，這樣會給訪客以緊張感，增強訪客行動力。

5.按鈕上的文案我們要體現(xiàn)價值，讓訪客有所期待。如“留言免費領(lǐng)取樣品”、“免費領(lǐng)取課程”等，增強客戶的轉(zhuǎn)化，但注意文字不可過長。

6.注意在移動端的展示效果。在手機端要著重注意按鈕的大小，要有足夠的留白效果能讓訪客輕松點擊。

三、banner風(fēng)格和整體網(wǎng)站風(fēng)格要統(tǒng)一。

做banner圖，簡潔的設(shè)計比一個復(fù)雜的元素多的圖效果會更好。主色調(diào)建議不要超過三種，在設(shè)計中為了突出主題，也會運用一些視覺表現(xiàn)手法： 如：民族風(fēng)－會用古典的、復(fù)古的、文化底蘊的效果； 扁平風(fēng)－使用活潑的、簡單的背景； 工業(yè)風(fēng)－再現(xiàn)應(yīng)用場景，增加真實感。

四、打造故事情節(jié)的視覺效果

通過展示banner圖向訪客講述一個故事，無形中向客戶灌輸我們的應(yīng)用場景、產(chǎn)品特征等，但切記不宜放太多信息，能讓訪客第一眼抓住重點和核心信息。

五、優(yōu)化網(wǎng)站banner的大小。

1.尺寸大小

我們在設(shè)計時要注意使用最優(yōu)的尺寸，banner圖分為窄屏Banner和全屏Banner，在早期建站時考慮到網(wǎng)站打開速度的問題，通常使用窄屏尺寸，但這種尺寸無法適應(yīng)不同的屏幕大小，所以依據(jù)屏幕大小平鋪的banner設(shè)計就應(yīng)用而生，這種尺寸的banner圖視覺效果更好，使網(wǎng)站顯得更加大氣。

2.占內(nèi)存大小

由于圖片加載需要時間，在Banner圖做好后，我們要在不損害圖片質(zhì)量的情況下對圖片的大小進行優(yōu)化，減少頁面加載速度對轉(zhuǎn)化率的影響,一般建議banner圖的文件小于200K。