国际看脸，网站看Banner，门面当然要美丽，不过许多同学以为做Banner是门技术活儿，自个学艺不精做不了。假如你看了今日这篇文，就会理解，技术于Banner，就像刀法于人，虽有招式，但无内功支持，久战必败。而这篇好文，即是Banner的内功修炼心法，按6个步骤来，速成可待。
@Heidixie(阿里巴巴资深交互规划师) ：团队小伙伴问到这个疑问，发了一封邮件共享自个的思路，趁便贴过来。
适用条件：
非专业视觉规划师 没太多闲暇时刻去做。 为何要做banner?banner是用来传达信息的。悉数不以传达有用信息、有用传达信息的banner都是yy. baner是用来促进用户举动的，也即Call To Action。无法让用户发生你所期望的banner都是无效的。
所以，先脱节一个过错的晓得：banner仅仅是用来装修用的，仅仅是为了招引人留意啥的主意。
所以，咱们已然是非专业规划师，就要回归到做banner的根源，为了到达以上作用，同时统筹漂亮、大方、美观。
大方和美观的banner未必需要深邃的视觉技巧，和繁琐的PS功用，可是要统筹视觉的几个准则，我稍后会列出。
第一步：界说要传达啥信息
这一步，和视觉、审美啥的都没联系。
比方，半月谈，咱们要传达的信息有：
品牌LOGO，让用户一眼就晓得哪里出品，下次构成条件反射，所谓的视觉认知是需要必定的重复的，只要不断重复才干加深用户形象。 子品牌LOGO，让用户晓得咱们出了啥东西，并且有系列感。
以上即是咱们要传达的中间信息了。你也能够认为这即是一个BANNER，仅仅——看起来没那么美观罢了。
可是，咱们发现信息还不行，咱们还想要传达：
咱们的内容大概是啥，然后让用户构成等待 已然是系列，咱们期望用户能够晓得这是第几期，然后当他们想要从某一期有爱好时点击到悉数，也有当地去。
所以，咱们把信息又放出来。如今咱们有4类信息。
第二步：界说信息的优先级
尽管咱们有4类信息，可是优先级必定不一样的，所以对应到规划上，咱们给它放的版块的巨细、色彩的杰出是不一样的。
第三步：思考用户视觉途径
也即你想引导用户先看哪里，再看哪里，然后再做啥。
一般，用户的阅览从上到下，从左到右边，所以一般重要的内容会放到左上角。
不过这个规则能够用夺目的图像、扎眼的色彩简单打破，可是我主张你不要简单这么做，一切的图像和色彩都要有意义，为何要用这个图像为何要用这个色彩。
保证用户一开始有视觉中间，假如用户一眼不晓得先看啥，那么这个banner即是失利的。
有了视觉焦点后，你能够从视觉焦点引申开来，运用视觉里的亲密性准则(把内容附近的地理位置接近一些、比照准则等等)，引导用户从视觉焦点进而关注到其他细节、或许促进举动的东西。
第四步：思考标准辨认色彩
已然咱们要传达品牌形象，请保证用色从咱们的标准VI色盘中挑选，而不要随意用。
我是配色弱怎么办?有这3个板斧打遍天下：《秒变配色高手!怎么都不会错的6条网页规划配色准则》
记住，品牌传达，重复性很重要。就像咱们看到红、黄、白配色会想到麦当劳，看到绿和黑就想到星巴克一样。
第五步：做视觉的排版
(不要思考太多规划技术，不然就堕入到：我不是专业的，所以我不会做规划上)
排版上，信息现已完好，优先级现已出来，无非即是把它变得美观一些罢了。
让banner美观的几个要诀：
1. 对齐
很好办吧，让内容纵向、横向都有一条线，能够对齐。要么居中，要么底部。尽量保证页面上不要有一个元素，没有任何元素和它能够构成对齐的联系。
2. 亲密
不要让一切内容都没有聚集地堆在一起，让那些联系对比亲密的内容聚组成一个区域，不要让一个banner上的区域超越4个。
3. 简略质感：
千万不要加任何PS的滤镜、暗影、能不突变就不突变，由于现已不流行了，不要盲目运用各种款式。
4. 假如要用图标，尽量挑选款式一致，且能够保持你的优先级次第的图表。比方咱们引导用户先看左面，再看右边，成果你在右边的图标里挑选了一个血红的，可能用户的视野立马被招引过来了。
5. 不要让字体超越3种。尽量用宋体、黑体、方正黑体，不要用啥魏碑体、行楷等，一看就对比山寨。
第六步：做更多的美化
假如你不想做，本来上面也能够了。
想做的话，咱们能够：
比方花点时刻去做一个流行的扁平化背景装修——还是要强调一点，不要为了装修而装修，一切的装修都要有意义、让背景愈加有质感。比方加点磨砂感受。 比方，你还能够恰当变换下另外排版，比方：居中的排版，更简单引导用户从上到下的阅览视角，也是许多人偷闲对比喜爱的排版风格。
综上所述，做banner有一大半的精力是梳理信息、设定优先级、设定用户浏览次第，和PS的技术没有太多联系，所以，每个人都能够去测验做好一张看似很有规划感，可是实际上又没花啥精力的banner。
长沙网站建设推荐一下阅读内容韶山旅游
----责任编辑：长沙天二网络科技
版权所有 http://www.t2wl.com(长沙天二网络)转载请注明出处
