世界看臉，網站看Banner，門面當然要漂亮，不過很(hěn)多(duō)同學(xué)以為(wèi)做Banner是門技(jì )術活兒，自己學(xué)藝不精(jīng)做不了。如果你看了今天這篇文(wén)，就會明白，技(jì )術于Banner，就像刀(dāo)法于人，雖有招式，但無内功支撐，久戰必敗。而這篇好文(wén)，就是Banner的内功修煉心法，按6個步驟來，速成可(kě)待。
　　第一步：定義要傳達什麽信息
　　這一步，和視覺、審美什麽的都沒關系。
　　比如，半月談，我們要傳達的信息有：
　　品牌LOGO，讓用(yòng)戶一眼就知道哪裏出品，下次形成條件反射，所謂的視覺認知是需要一定的重複的，隻有不斷重複才能(néng)加深用(yòng)戶印象。子品牌LOGO，讓用(yòng)戶知道我們出了什麽東西，并且有系列感。
　　以上就是我們要傳達的核心信息了。你也可(kě)以認為(wèi)這就是一個BANNER，隻是——看起來沒那麽好看而已。
　　但是，我們發現信息還不夠，我們還想要傳達：
　　我們的内容大概是什麽，從而讓用(yòng)戶形成期待 既然是系列，我們希望用(yòng)戶能(néng)夠知道這是第幾期，從而當他(tā)們想要從某一期有興趣時點擊到全部，也有地方去。
　　所以，我們把信息又放出來。現在我們有4類信息。
　　第二步：定義信息的優先級
　　雖然我們有4類信息，但是優先級肯定不一樣的，所以對應到設計上，我們給它放的版塊的大小(xiǎo)、顔色的突出是不一樣的。
　　第三步：考慮用(yòng)戶視覺路徑
　　也即你想引導用(yòng)戶先看哪裏，再看哪裏，然後再做什麽。
　　通常，用(yòng)戶的閱讀從上到下，從左到右邊，所以一般重要的内容會放到左上角。
　　不過這個規則可(kě)以用(yòng)醒目的圖片、刺眼的顔色輕易打破，但是我建議你不要輕易這麽做，所有的圖片和顔色都要有意義，為(wèi)什麽要用(yòng)這個圖片為(wèi)什麽要用(yòng)這個顔色。
　　确保用(yòng)戶一開始有視覺中心，如果用(yòng)戶一眼不知道先看什麽，那麽這個banner就是失敗的。
　　有了視覺焦點後，你可(kě)以從視覺焦點引申開來，使用(yòng)視覺裏的親密性原則（把内容相近的地理(lǐ)位置靠近一些、對比原則等等），引導用(yòng)戶從視覺焦點進而關注到其他(tā)細節、或者促使行動的東西。

　　第四步：考慮标準識别顔色
　　既然我們要傳達品牌形象，請确保用(yòng)色從我們的标準VI色盤中選擇，而不要随便用(yòng)。
　　我是配色弱怎麽辦？有這3個闆斧打遍天下，記住，品牌傳達，重複性很(hěn)重要。就像我們看到紅、黃、白配色會想到麥當勞，看到綠和黑就想到星巴克一樣。
　　第五步：做視覺的排版
　　（不要考慮太多(duō)設計技(jì )能(néng)，否則就陷入到：我不是專業的，所以我不會做設計上）
　　排版上，信息已經完整，優先級已經出來，無非就是把它變得好看一些而已。
　　讓banner好看的幾個要訣：
　　1. 對齊
　　很(hěn)好辦吧，讓内容縱向、橫向都有一條線(xiàn)，可(kě)以對齊。要麽居中，要麽底部。盡量确保頁面上不要有一個元素，沒有任何元素和它能(néng)夠形成對齊的關系。
　　2. 親密
　　不要讓所有内容都沒有聚集地堆在一起，讓那些關系比較親密的内容聚合成一個區(qū)域，不要讓一個banner上的區(qū)域超過4個。
　　3. 簡單質(zhì)感：
　　千萬不要加任何PS的濾鏡、陰影、能(néng)不漸變就不漸變，因為(wèi)已經不流行了，不要盲目使用(yòng)各種樣式。
　　4. 如果要用(yòng)圖标，盡量選擇樣式統一，且能(néng)夠保持你的優先級次序的圖表。比如我們引導用(yòng)戶先看左邊，再看右邊，結果你在右邊的圖标裏選擇了一個血紅的，可(kě)能(néng)用(yòng)戶的視線(xiàn)立馬被吸引過來了。
　　5. 不要讓字體(tǐ)超過3種。盡量用(yòng)宋體(tǐ)、黑體(tǐ)、方正黑體(tǐ)，不要用(yòng)什麽魏碑體(tǐ)、行楷等，一看就比較山寨。
　　第六步：做更多(duō)的美化
　　如果你不想做，其實上面也可(kě)以了。
　　想做的話，我們可(kě)以：
　　比如花(huā)點時間去做一個流行的扁平化背景裝(zhuāng)飾——還是要強調一點，不要為(wèi)了裝(zhuāng)飾而裝(zhuāng)飾，所有的裝(zhuāng)飾都要有意義、讓背景更加有質(zhì)感。比如加點磨砂感覺。 比如，你還可(kě)以适當變換下别的排版，比如：居中的排版，更容易引導用(yòng)戶從上到下的閱讀視角，也是很(hěn)多(duō)人偷懶比較喜歡的排版風格。
　　綜上所述，做banner有一大半的精(jīng)力是梳理(lǐ)信息、設定優先級、設定用(yòng)戶浏覽次序，和PS的技(jì )能(néng)沒有太多(duō)關系，所以，每個人都可(kě)以去嘗試做好一張看似很(hěn)有設計感，但是實際上又沒花(huā)什麽精(jīng)力的banner。