十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
创新互联建站专注为客户提供全方位的互联网综合服务,包含不限于成都做网站、成都网站建设、鄂城网络推广、小程序定制开发、鄂城网络营销、鄂城企业策划、鄂城品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;创新互联建站为所有大学生创业者提供鄂城建站搭建服务,24小时服务热线:18980820575,官方网址:www.cdcxhl.com
1、了解banner图的组成要素以及风格。这一方面要是根据企业的整体特点来进行定位,为的就是能够设计出更加符合企业形象以及企业理念的banner图。
2、banner图的排版。这一点个人觉得不光是banner图在设计时才注意,在网站排版、网页排版时都应该注意。
3、banner图的切片。这一点必须注意,因为图片没有处理好,在一定程度上会影响网站的访问速度,网站的访问速度如果不是很好,就会影响网站的浏览量以及点击率。还有就是图片的显示大小以及兼容性,使图片能在大部分的浏览器以及设备上展示出来,这样就不会影响网站的整体美感,方便用户的查看。
4、banner图的字体可以混搭。字体混搭能够更好的展示相关信息以及更加吸引用户的注意力。
当今各大网站流行及交换的banner分为两种。
一种是banner广告条,即468x60像素的动画, 主要是为网站或企业的广告宣传。另一种是作为交换连接的logo,即88x31像素的动画或者图片。通常要求banner广告条的文件大小为20k以下, 而logo的大小为6k以下。ogo=logotype
当下的banner图大概有两大类,一类高饱和高亮度的卡通矢量风格,另一类比较品质感的路线,没复杂的合成,没灵活的字体设计,却用有非常舒服的视觉效果。对比现在大部分综合电商的争芬斗艳风格,我个人更喜欢后者这种“简单”的banner类型。今天总结出7大banner基本手法,希望和小伙伴们一起设计更得心应手。
一、杂志风格商品/人物放在非常显眼的位置,背景是非常平面的纯色,文案“形乱神不乱”地灵活围绕在主角周围,因为是杂志风格,所以和杂志一样有经久不衰的时尚感。更多平面UI设计知识,请咨询华南电脑学校。
二、文案做主角一半以上的篇幅放置巨大的文案,商品和配图围绕摆放,特别适合平台电商商品品类很多的的活动广告。这时文案的排版就非常重要了,通过文字粗细,大小来排成一个图形。迎合市场都觉得用点英文瞬间高大上起来的癖好,中英结合呗,再加点阿拉伯数字,就VERY GOOD了。
三、文案和图片有明显的分区虽然有点死板,可人家成熟稳重呢!文案更加清晰显眼,适合商品图形象图整张展示更好看的时候,当然你如果没时间抠图的话……或者抠图技术太差,抠出来很多锯齿瞬间拉低品牌档次的时候,就用这种排版手法吧。这类也分两种形式,明显的分区和羽化色块分区。
四、我又来说几何边框了,说多了不好意思了的确用上就高大上起来了嘛,和网页排版一样,banner图也很爱用,框起来就是焦点,无论文案/商品,另一类是在大图上加个透明的几何图形,让文案更加清晰。说了很多次,几何图形是永恒的装饰品哦。
五、文案融合进摄影大图摄影图一用立刻就高大上了…不用设计不用排版就已经吸引眼球了,当然是说好看的大图。这种手法文字要看清楚就需要很注意了,以及大图的选用也要非常认真,还要加上色调调整,意境要靠色调和明暗调出来,靠感觉和经验了。当然,最简单是选用比较干净不杂乱的底图。
六、构造故事性的场景我一直很欣赏这种电商banner图,设计师的脑袋儿灵气棒棒哒!特别是专题页就很有必要这样做,故事性的场景图,除了有效牵动顾客情感,还让品牌在顾客脑袋瓜里深深扎根了,品牌和销售就哗啦啦地上升啦!不过这种风格需要手绘能力较强的设计师才能完美表达。
七、色块背景上文案&商品左右摆放很容易产生单调的感觉,所以背景添加图案图形,渐变色,商品阴影等,再为商品加点相关的小配物,让画面充实起来吧。
1、切勿随意添加栏目:作为美工,这一行为是要避免的,如果随意给界面添加表单、链接、“更多”等需要后台开发才能支持的功能,这样随意添加,就无形的更改了网站最初的需求,增加了项目的工作量,会影响网站的整体功能,同时也增加了后期测试的工作量,另一种可能就是不符合用户的需求,导致后期还需要重新修改。
2、切勿随意篡改设计:没有按照栏目的逻辑来设计页面,也没能为网站的内容进行良好的呈现。这种行为只是单纯的为了自己能在网页设计时方便,从而随意的消减了很多网站的内容。
3、随意切图,不考虑页面动态扩展:这个一般是美工技术含量不够导致的。切出的图片只能用在一个界面尺寸里,换个页面,就需要重新切图,没有任何扩展性,要结合响应式网页设计的原理,进行合理切图。
4、图片好看,但是没有实在的意义:给一个美工一个新闻主题,让他给做一个Banner,但是做出来之后,和新闻主题没有任何的关系,仅仅是好看。还有一些美工,更加对工作不负责任,只是把一个图片做了一下PS,这样对网站的整体效果都是有害的。
5、整站界面风格:在后期维护网站的阶段,美工们在制作图片时,没有考虑当前网站的风格,随意变换图片基本色调,在网页色彩搭配设计时,不合理配合网站整体风格,会影响网站后期的优化工作。
如果这个岗位即是美工,又是设计师,那就说明这家公司不是特别大的公司,一般大的公司网页设计师和前端工程师是分开的,但是一些小的公司会把这两个职位合并到一起。具体需要注意的情节:
1、对这个岗位要有自己的理解,你要让领导知道你心目中的这个岗位是什么样子的,你对网页美工/网页设计师是怎么理解的;
2、表现出对企业的忠诚,比如问你一个为什么不在上一家企业工作了?你应该尽量避免说是自己浮躁,如果真是自己的原因,那也尽量表现出你会在这个企业长期待下去,没有公司愿意用三心二意的员工,有些时候忠诚比技能要重要;
3、尽量多带一些成熟的作品,企业用你当然和你的技能分不开,从你的作品中企业可以看出你的真是水平。
4、如果有别的公共活动的证书什么的尽量一并带上,这样可以给你加分;
5、尽量衣着得体,如果有条件尽量整装,这样可以显得你对这次面试的重视;
6、如果能留面试官的电话尽量留面试官的电话,如果面试官不打算用你,你可以多打几次电话争取一下这个岗位,让面试官看到你对这个岗位的渴望,不怕你不会,就怕你不做,一个很优秀但是不努力的人和一个很差劲但是很努力的人比,有些人还是比较喜欢后者的。
7、做足前期功课,要在去企业之前,对这个企业有了解,避免面试官问你关于这个行业的时候一问三不知的局面。
Banner制作 你一定见过网页中会动的广告Banner。变换的图片很能吸引浏览者的注意。它实际上是一个动态的GIF图形文件,也就是一个包含两张以上独立GIF图形文件或Frame(帧)的文件。每一帧均设定了画面播放时间与重播次数。可以在GIF制作软件中指定每一个轮回的动画播放时间与回放次数。目前市场上制作GIF动画的软件相当多,友立公司的Ulead Gif Animator以其简单易用,功能强大而受到良好的评价,是一款值得推荐的Gif动画制作软件。下面我们用它来制作一个468X60像素大小的广告Banner。
1.在PhotoShop中制作四张468X60像素的图片,并将其导出为Gif格式。
2.运行Ulead Gif Animator,此时会出现一个“开始向导”面板,注意到“开始向导”面板上的Animation Wizard项,通过它可以决定置入哪些画面,每个画面播放多少时间等控制信息。
3.单击Animation Wizard项前的茶杯图标,在弹出的选择文件面板中单击“增加图像”按钮,在随后弹出的打开菜单中,选择要置入的图片,我们选择前面在PhotoShop中制作的四幅图片,选好之后单击下一步按钮。
4.在图像类型菜单中选择以文字为导向的图像Text-oriented,单击下一步按钮。注意:若是以文字为导向的图像,文字图像的颜色比较少,可以不进行递色处理,这样可减小文件的大小,但如果是较复杂的相片图像,则需进行递色处理以求得较好的影像品质。
5.在帧延续时间面板上设置每帧延续的时间和帧速率。注意:GIF89a的动画图像结合了多张的个别图像,它们都是独立的Frame(帧或影格)文件,每一影格均须设置画面的播放时间及重播次数。
6.在完成菜单中点击Finish按钮,完成动画的基本制作。单击编辑区中的Preview按钮,预览动画的效果。
7.打开File菜单,选择Optimization Wizard(或按下F11键),启动最佳化向导。
8.在弹出菜单中选择Yes,使用预设的项目以控制调色板的颜色数目,然后单击下一步按钮。
9.在弹出的菜单中勾选No,然后在图片颜色数项中设置其值为32色。注意:视图像情况以决定颜色数目方框中的数值,若以文字为导向的图像,最好勾选“No”项目。
10.在弹出菜单中均选择Yes,移除多余的像素,移除注解区块,移除层标志,这样可以减小文件尺寸。
11.在最后弹出的菜单中列出了刚才的设定,单击Finish按钮完成优化。
12.随后弹出Gif Optimization菜单,显示了优化前后的文件尺寸大小对比,单击Save as按钮,如图6,将其保存。注意:一般情况下,Banner的大小不要超过30KB,否则会增加网络负担,在本例中,这个Banner优化之后只有18.4 KB。
17. 图标制作器 v1.0 好易用图标制作器:是功能强大的集图标管理、搜索、处理、共享等于一体的专业图标工具软件。它可以为你的图标制作提供全套方案:图标设计、图标编辑、图标搜索、图标替换、 www.skycn.com/soft/1342.html 18. 图标更换器(executable file ico... www.skycn.com/soft/6372.html 19. 图标小精灵 v4.2 www.skycn.com/soft/8717.html 20. 图标小精灵 4.1 www.onlinedown.net/soft/7250.htm
banner设计的四大注意事项:· 如何使banner设计具有创意· 从banner设计的角度谈如何· 网站banner设计的常用尺寸· 什么是banner设计?一般来说,网站制作一个banner分为两个部分,文字和辅助图。虽然辅助图站的面积比较大,但如果不加入文字说明的话,客户就会看不懂你做的banner要表现什么、要说明什么,所以文字是整个banner的主角,我们在制作banner的时候特别要注意对文字的处理和摆放。banner的设计质量严重影响着整个网站页面的质量,一个好的页面、好的banner能够吸引浏览者的眼球。虽然banner只是网页页面中一个小元素,但是这个小元素往往能够起到关键性的作用。所以在进行banner设计时需要引起足够的重视。下边是在banner设计中容易出现的一些小问题,请引起重视。
1、banner设计中的文字注意事项一般来说,网站制作一个banner分为两个部分,文字和辅助图。虽然辅助图站的面积比较大,但如果不加入文字说明的话,客户就会看不懂你做的banner要表现什么、要说明什么,所以文字是整个banner的主角,我们在制作banner的时候特别要注意对文字的处理和摆放。①分清主标和副标,从主次上来说,主标为主,字体要大颜色要醒目。副标起到从内容上和形式上都辅助主标的作用。
一个好的banner标题文字处理都比较饱满,比较集中。②如果主标太长,需求方不舍得删文字的情况下,对主标中重要关键字进行权重,突出主要的信息,弱化的、之、和年第X届这种信息量不大的词。③如果需求方整体文字太短,画面太空,可以用一些加入一些辅助信息丰富画面。如加点英文,域名,频道名等。
2、Banner有动态和静态两种。在浏览网页的过程中,虽然闪烁的图案会产生瞬间记忆刺激,引起注意,但这种记忆往往为压迫性的,久之易产生负面效应,从而模糊记忆。而稳定的画面不易引发特殊的关注,但如果有良好的界面引导和内容,可产生良性的记忆,持久而牢固。根据粗略统计,100个Banner里面有1/3是静态的。
3、Banner的“重量”要轻。以468×60的Banner为例,最好是15K左右,不要超过22K。而88×31的Banner最好在5K左右,不要超过7K太大的会引起网页打开速度,导致浏览下降,这里面也有个量的问题,太多的广告而影响浏览者浏览网页,导致反感这也是一个问题。所以放广告条的时候要考虑到广告的大小和多少,还有就是搭配问题。
4、从banner设计上来看,需要注意:①Banner的文字不能太多,用一两句话来表达即可。②广告语要朗朗上口,可以第一时间的让人捕获表达的重点。③图形无须太繁杂,文字尽量使用黑体等粗壮的字体,否则在视觉上很容易被网页其他内容淹没。④图形尽量选择颜色数少,能够说明问题的事物。⑤如果选择颜色很复杂的物体,要考虑一下在低颜色数情况下,是否会有明显的色斑。⑥尽量不要使用彩虹色、晕边等复杂的特技图形效果,这样做会大大增加图形所占据的颜色数,增大体积。⑦产品数量不宜过多。很多广告主总是想展示更多产品,少则4-5个,多则8-10个,结果使得整个Banner 变成产品的堆砌。Banner 的显示尺寸非常有限,摆放太多产品,反而被淹没,视觉效果大打折扣。所以,产品图片不是越多越好,易于识别是关键。
接下来,智网互联为大家总结累一些,如有鄙陋,请指正,万分感谢。当今,无论任何一款互联网产品,都需要搭载PC平台进行推广,Banner更是推广的一大利器,怎么将Banner设计好就成为一个需要探讨研究的课题。Banner规格尺寸大小不一,文件大小也有一定的限制,这就使得在设计上增加了许多障碍,颜色不能太丰富,否则会在文件大小的限制下失真,软文不能太多,否则会没有重点,得不偿失,怎么在方寸间把握平衡,变得十分重要。接下来,我为大家总结累一些,如有鄙陋,请指正,万分感谢。第一部分:颜色1.Banner与环境对比试想如果在一个以浅色调为基准的网站上投放Banner,是不是从明度上拉开对比会很好的提高用户的注意力呢(相反亦然)。以此也可推想出,如果在一个有颜色基调的网站上投放补色或者对比色的Banner,效果就会变得更瞩目(补色和对比色案例)。
2.Banner颜色简单至上
(1)试想一个Banner五颜六色,是不是就能够吸引眼球了呢?首先,先对比一下哪个更吸引你的注意力呢?大多数人肯定会觉得后者给用户带来的视觉传达力更强,简洁明确、朴素有力的效果,给人一种重量感和力量感。前者颜色虽多,却没有带来更好的视觉传达效果,为什么呢?颜色过度使用会打乱色彩节奏,并且,减弱了颜色间的对比,使整体效果变弱。
(2)其次, 使用颜色越多,最后保存时文件体积越大,加载起来越慢,让用户等待就意味着和用户说再见了,如果靠降低品质来达到Banner的上传要求,那展现给用户的是低质量的banner,也一样会丢失一些用户。所以,颜色简单有力,加载清晰快速,对于banner的视觉传达很重要,只要让用户产生点击欲望,我们推广的目的就达到了。第二部分:构图1.构图的定义及规则构图其实说白了就是经营画面,进行布局,如何在你构图的引导下吸引用户点击,产生欲望,了解内容,如果都能达到,那说明你的构图成功了。构图的基本规则是:均衡、对比和视点。均衡:均衡不是对称,是一种力量上的平衡感,使画面具有稳定性。均衡不是对称对比:在构图上来说就是大小对比,粗细对比,方圆对比,曲线与直线对比等等。白色线条的对比产生了空间感视点:就是如何将用户的目光集中在画面的中心点上,我们可以用构图去引导用户的视点将视点集中引导到slogan上介绍完构图的基本规则,举例子检视下:一张X-MEN的宣传banner,这张banner人物排布既平衡又不对称,人物大小不一,产生出对比,突出了部分剧中人物。Banner正中一个大大的X,把视点集中到了画面的最中心,很好的利用基本构图规则进行banner设计。
2.构图的样式构图大概分以下几种:
(1)。垂直水平式构图
(2)。
三角形构图(正三角和倒三角)
(3)渐次式构图
(4)。辐射式构图
(5)。框架式构图
(6)对角线构图
(1)垂直水平式构图:平行排列每一个产品,每个产品展示效果都很好,各个产品所占比重相同,秩序感强,此类构图给用户心情:产品规矩正式、高大、安全感强。
(2)正三角形和倒三角构图:多个产品进行正三角构图,产品立体感强,各个产品所占比重有轻有重,构图稳定自然,空间感强。此类构图给用户心情:安全感极强、稳定可靠。多个产品进行倒三角构图,产品立体感极强,各个产品所占比重有轻有重,构图动感活泼失衡,运动感空间感强。此类构图给用户心情:不稳定感激发用户心情,给用户运动的感觉。
(3)对角线构图:一个产品或两个产品进行组合对角线构图,产品的空间感强,各个产品所占比重相对平衡,构图动感活泼稳定,运动感空间感强。此类构图给用户心情:动感十足且稳定。
(4)渐次式构图:多个产品进行渐次式排列,产品展示空间感强,各个产品所占比重不同,由大及小,构图稳定,次序感强,利用透视引导指向slogan。此类构图给用户心情:稳定自然,产品丰富可靠。
(5)辐射式构图:多个产品进行辐射式构图,产品空间感强,各个产品所占比重不同,由大及小。构图动感活泼,次序感强,利用透视指向slogan,此类构图给用户心情:活泼动感,产品丰富可靠。
(6)框架式构图:单个或多个产品框架式构图,产品展示效果好,有画中画的感觉。构图规整平衡,稳定坚固。此类构图给用户心情:稳定可信赖,产品可靠。
3.软文(Slogan)
(1)俗话说得好“话不在多,精辟就行”当今炙手火热的微博就是一个例子“140字概括你要说的”,Slogan也是一样。
(2)要言之有物,第一要抓住用户的心里,了解用户的想法很重要。第二我们要推给用户什么,用户对什么感兴趣。下面举个例子:Slogan只有四个字,终于来了,白色iphone4吊足了apple迷门近两年的胃口,这四个字恐怕是他们最想听到的。用户从不会质疑apple的性能,科技领先性及用户体验性,他们最想的恐怕就是拥有自己梦寐以求的白色iphone4。