您当前位置:图趣网(Tuquu) >> 网页设计教程 >> 视觉设计 >> 浏览设计教程

一款优秀的网页Banner该怎么设计

Banner广告在今天网络市场营销中是十分重要的一部分。大多公司会使用banner这种形式的有效且低成本的媒介来提高品牌知名度,这就有了很多banner的设计工作在那里他们。

   今天我们来分享一些banner设计规则和技巧。

1.Banner的标准尺寸

d10556e26e3b32f875520f5321c1.jpg

   以上是几个banner的最佳尺寸,理想情况下,你的客户会在网站上购买一个banner的广告位让你来设计。

2.维护等级制度

   首先,banner广告的目的是提高品牌知名度并且引流到你的网站上。它基本组成分为三个部分:

公司logo:公司logo是建立品牌知名度的主体,要确保它的视觉优势。

品牌价值:banner上除了体现品牌的服务性质,也要提供有吸引力的产品,比如产品的优惠信息(类似“5折优惠”“限时免费”),这应该是你的广告最吸引用户眼球的地方。

让用户采取行动:在banner上应该有类似“点击这里”“了解更多”“立即查看”“点此注册”类似的文字标语,这样能让用户更好的进一步操作。

3.让设计看的简单一些

cb1a56e26e8232f875520f4e6fb0.jpg

设计简单,内容直观明,因为用户可能只打算看你的banner一眼。一句话能表达清楚的不要增添文本复杂性,让用户看着很繁琐,设计底色单一化能更好识别。限时免费字样跟其他文本有区分,让用户能在短时间内关注到主要信息点。

4.使用适合的按钮

694456e26eb932f875520f99312f.jpg

   根据banner的类型设置按钮,这样能提高点击率。当你使用的时候,将他们放在你的副本上面或者在右下方,使用对比色让它们跟整组广告看起来一致

5.有明确的框架

501256e26ef832f875520f168388.jpg

   用户会被banner内的框架主题吸引,所以确保你banner广告边框中有明确的框架。

   如果你的banner整体是白色的,那么普遍的做法就是在banner内有1像素的灰色边框。如果不是白色,你仍可以像NETFLIX广告这样,在周围增加几丝淡淡的黑色。

6.让你的文字能快速可读

ee4756e26f2e32f875520fed2c45.jpg961956e26f306ac72531cb60cf49.jpg

Do:让标题和正文字体不同尺寸

Don’t:不要用草书字体或者是非常单薄的字体,不要全部大写或者字体小于10磅(除非是版权声明或免责说明)

7.确保设计和公司品牌一致性

9b7956e26f6832f875520fc66f02.jpg

   你的banner广告要连接到相关产品报价页中,确保它的设计跟公司品牌风格看起来一致,不要让用户有混淆。

8.用正确的图片格式

da5b56e26f8a6ac72531cbcb005d.jpg

   在你做完banner设计后,你会用AI、PS或Flash生成jpg、png、gif、flash格式图片。

   请记住,flash格式的banner广告不支持所有设备,如果不想让用户错过人能能点击的机会可以提供gif格式的banner图。

9.图片尺寸不要太大

   当用户滑动滚动条时需要及时看到你的banner广告,加载速度要很快,所以你的尺寸越小越好。

10.需要时,使用高质量图片

e76856e26fb432f875520fd3060e.jpg

   选择相关的图像、图形或直接关系到用户的产品图片,可以提高你banner的质量。

ef1f56e26fcf32f875520fda8074.jpg

   如果你买不起专业设备或者请不起名模,你可以在网上买图,现在的高质量图片很多。

   图片不是总在banner设计中使用的,因为文字广告会排版更好看更具杀伤力。

11.灌输紧迫感

2a1e56e26fef32f875520ff89e4c.jpg

颜色鲜艳或者对比度极强的视觉效果会赋予文本紧迫感。

12.选择适合的颜色

   在选择颜色的时候,要考虑到用户的情绪,这也是他的第一感官。

   颜色会有不同的文化体现,让人有不同而想法,在选择时要研究你的目标受众。

   下面是颜色的一个心理分析,大家可以参考一下:

红色:危险,激情,愤怒,兴奋,速度,和爱情有关。最强大的色彩和有吸引力的所有观众,也被称为刺激食欲。适度使用。 

橙色:活力,幸福有关。没有压倒红色,它充满活力,邀请和友好(它是行动按钮)

黄色:幽默,阳光,乐观,能量有关。的黄色触摸可以捕获观看者的注意力,它甚至比橙色和红色更有活力和应使用明智,但太多黄色会刺激用户的眼睛。

绿色:健康,新鲜,丰富,环境,发展,培育和新的开端有关。这是对眼睛最简单的颜色。 

蓝色:安全,信任,清晰度,平静,理智,形式,高雅,真理,茶点,发凉,阳刚之气有关。

紫色:与奢华,皇室成员,贵气,智慧,魔术,野心,女性气质和创造力有关。它有一个观众舒缓,镇定的作用。

粉色:有爱,甜蜜,女人味,和婴儿有关。最有女人味的颜色。

黑色:邪恶,神秘,权力,声望,悲伤和形式有关。它的传统,并在白色背景上的企业的黑色文字是最可读的颜色组合。

白色:纯度,清洁度,现代性,不育,简单,诚实,纯真,童贞,善良有关。

棕色:与自然,木材,皮革,和谦卑有关。平衡了更深的颜色,和好背景色和纹理。

灰色:中立性和实用性有关。当作为后台用它加剧了其他颜色。

最后,在广告设计时,请确定您是在RGB颜色模式设计。您的banner广告任何时候只屏幕上显示。

13.考虑使用动画


896e56e2704632f875520f9bcd67.jpg

   Banner中用动画是十分有效的,但你要确保它不会从广告信息中心脱离出来。

   如果是用动画,需要让它简单一些,不超过15秒,并且不要循环在3次以上。此外动画的最后一帧应该是个号召性质的。

14.脱颖而出的效果


   你的广告是个补充效果,但需要在整体页面中脱颖而出。

4e3b56e2706932f875520f15224f.jpg

   如果您的广告在视觉上跟网站整体融合的很好,这会是个很好的网站,而且能赢得用户的信任。但是不要让它融入太多,广告还是需要用户能看到或点击。

   Banner广告好不好主要看它的性能。也许它是世界上最丑陋的banner,但如果性能很好,那么它是一个成功的设计。

[教程作者:IDC创新设计中心]
免责声明:本站文章系图趣网整理发布,如需转载,请注明出处,素材资料仅供个人学习与参考,请勿用于商业用途!
本文地址:http://www.tuquu.com/tutorial/ui3217.html
最受欢迎扁平化UI设计配色方案集
网页设计如何快速打造场景氛围
图趣网微信
建议反馈
×