网页banner设计套路干货 学好这5个重点

2020-08-07 17:38:09 1351

banner有没有什么能在设计它的过程中遵循或是检视的规则,让今后设计Banner的时候更加的有效?MAKA小编告诉你:有的!这篇,我们就来聊聊网页banner设计中的5个套路。

网页banner设计套路干货 学好这5个重点

1.场景优先

这里的“场景优先”指的是要十分明确未来这个Banner的使用场景具体是在哪里。这也是我在指导或是检查设计师做Banner的时候第一个要问对方的问题。而恰恰当我问对方用在哪里的时候,很多设计师甚至做完了也不清楚具体的使用场景,只知道需求方提供的尺寸和他要求的K数。

为什么场景优先这么重要?因为场景决定了Banner设计的重要层级。是移动端还是PC端?是头部Banner还是底部Banner?在整个画面中的比重是大的还是小的?是促销活动还是日常信息露出?等等… …任何重要程度,都是权衡和比较出来的结果。也许需要设计的Banner尺寸不大,但在有限的画幅里面,它的占比很大,那它承担的“传达责任”就会大一些。一级页面里的Banner就比三四级页面里的要重要一些。做普通信息展示的Banner也许没有活动关键信息曝光的Banner重要等等。

网页banner设计套路干货 学好这5个重点

位置决定了其重要程度和信息承载量。所以,当你拿到一个Banner设计需求的时候,别着急找素材或是想画面,先问下需求方,这个Banner在哪里使用,最好找到那个投放页面截个屏,当你设计完Banner的时候贴个效果图,把它还原在真实场景下。如果是移动端就要在手机上观看整体效果。做什么Banner就要在它投放的最终场景下观看和挖掘问题。切忌,因为麻烦而忽略这一步。

2.对比

这里的对比不单单是设计手法中图形元素的对比,还包括“画面”和“文案”的画幅比,Banner与投放场景的视觉色差比等等...

网页banner设计套路干货 学好这5个重点

首先,“画面”和“文案”的画幅比指的是在整个Banner中,文案与画面的所占整个Banner面积的比重。这不是说要固定某个最优比例,而是说这个你将要设定的比重决定了Banner“信息的传达优先级”,是文案优先画面辅助还是画面视觉优先文案解释说明等等。通过对比,能够影响浏览者有先后顺序的获取你想传达给对方的信息,从而激发其点击或是转化。

3.细节优先还是整体优先

细节重要还是整体重要?其实两个都重要(这真不是一句废话)。如果这个Banner的作用是展示商品、活动奖品或是企图用画面吸引用户阅读的话,那就漂漂亮亮的把产品或是画面图片展示出来,当然在有限的空间里把细节展示的越多、越完美越好。因为具有“打动力”的细节更有机会让用户视线“驻停”。停留越久就越有机会点击。

网页banner设计套路干货 学好这5个重点

网页banner设计套路干货 学好这5个重点

如果这个Banner的作用是强调文字信息,比如活动时间、产品卖点等等,这时的设计如果过度强调或是放大细节反而会消耗文字信息的的传播能量。

网页banner设计套路干货 学好这5个重点

4.简化!简化!说清1点!

有时候我们可以通过一张海报、一个活动页甚至一个易拉宝把大量信息罗列其中,甚至被领导或是客户强迫加内容而且要放大!放大!放大!

网页banner设计套路干货 学好这5个重点

受限于尺寸,Banner天然不具备承载大量信息的能力。所以能在有限的空间里通过图文的合理设计说清1点即可!任何繁杂的信息和装饰都需要在设计之初坚决杜绝!

网页banner设计套路干货 学好这5个重点

简化!简化!简化!重要的事情说三遍。简化不代表简单或是简陋,而是要让信息和画面合力聚焦在一个核心利益点上。一个Banner说清一件事!

5.统一性与可延展性

如果上面四点说的是检视一个独立Banner设计好坏的方法的话,那么统一性与可延展性就是检视一套Banner设计系统的重要规则。

网页banner设计套路干货 学好这5个重点

统一性指的是某套传播系列的风格统一,包含元素的统一,文字、LOGO、行动按钮的使用规则统一。尽量统一字体、版式,甚至有可能的话,统一画面区域,这样容易让Banner的体系感更强。

网页banner设计套路干货 学好这5个重点

可延展性指的是在不同场景和平台下的可扩展性。画面在不同的比例下能否协调,大尺寸下图片能否足够延展等等。

网页banner设计套路干货 学好这5个重点

最后,总结一下:

相比于教你如何快速做出某个主题的Banner,我写的这篇文章更希望教会你如何在做完一个Banner之后,检视其中是否存在的隐患与问题。

通过自问或是向需求方确认Banner的使用场景,用“多属性的对比”来引导浏览者获取Banner信息的优先级。你要记得:小Banner无法承载老板们什么都想展示或是突出的想法,一个Banner说清1件事!最后有系统性思维建立Banner的设计规则,让其更加的统一,画面可延续。

普通设计师用美丑判断一个Banner设计的好坏。而你,看完这篇文章之后要学会用“逻辑”来检视设计的正确性。这就是你与他们最大的差别。希望今天给大家分享的内容可以帮助到大家。更多banner设计模板素材,尽在MAKA在线制作平台(https://maka.im)。

标签: 网页banner设计 banner设计 banner 除非特别注明,所有报道中出现的商标及图像版权属于其合法持有人所有,本站仅供传递信息之用,非商务用途。如有侵犯到您的权益请及时告知,本站将及时删除。详情请参考本站免责声明,转载本文请保留本站的完整链接。

文章排行本月排行

邀请函海报怎么做 快速get入门必备知识 邀请函海报怎么做 快速get入门必备知识 邀请函海报怎么做 快速get入门必备知识
短视频设计方法分享 这样做的视频更吸引人 短视频设计方法分享 这样做的视频更吸引人 短视频设计方法分享 这样做的视频更吸引人
招聘H5怎么做更有趣 企业招聘H5优秀案例分享 招聘H5怎么做更有趣 企业招聘H5优秀案例分享 招聘H5怎么做更有趣 企业招聘H5优秀案例分享
创意社交名片设计分享 你知道半色调名片吗 创意社交名片设计分享 你知道半色调名片吗
招聘H5怎么做更能戳中求职者 设计师必须掌握的H5制作方法 招聘H5怎么做更能戳中求职者 设计师必须掌握的H5制作方法
展架设计尺寸知识科普 海报设计尺寸都有哪些 展架设计尺寸知识科普 海报设计尺寸都有哪些
营销活动海报设计教程指南 让你的转化率飞涨 营销活动海报设计教程指南 让你的转化率飞涨
广告海报设计作品分享 温暖的广告才能打动人心 广告海报设计作品分享 温暖的广告才能打动人心
社交名片设计干货分享 名片的印刷色彩有哪些 社交名片设计干货分享 名片的印刷色彩有哪些
海报设计排版妙招分享 海报这样排人见人爱 海报设计排版妙招分享 海报这样排人见人爱
更多设计百科文章>>