网站banner设计

1、如何为网站设计出色的横幅banner

有鉴于此，本文从颜色，字体，图片选用等几个方面来阐述在网站中设计横幅时应注意的相关事项。当访问者一打开你的网站，横幅应迅速吸引他们的视线。一个优秀的横幅不仅要抓住访问者的心，还要激起他们继续浏览的欲望。横幅或页眉在整个站点中起到桥梁的作用，除了向访问者传达网站内容之外，更重要的是，帮助他们建立起对你企业的第一印象。因此，要想设计出优秀，专业的横幅，关键在于要赋予它独特气质、富有冲击力的视觉效果并能有效地吸引访问者的注意。颜色-横幅的配色应与网站整体色调保持一致。根据运营的网站类型，选取适当的亮色可增加横幅的吸引力，此外，赏心悦目的浅色投影可令横幅的风格更清新。首次设计网络图片最佳，随后为网站构思配色，并添加上图片。通常，在颜色的选用上要达到反差效果，并且与背景和谐统一，这样可使得网站的标题和主题的显示更突出。字体-选用的字体应是目标用户群喜闻乐见的，同时还要与网站内容协调。横幅上的字体应清晰明了，方便阅读。字体类型的选用上，推荐这三款字体：Helvetica black，Impact和Arial，看起来美观又不失专业性。再者，横幅上的文字不宜过多，即使文字很大，也有足够的容纳空间，这样阅读起来也更合理。图片-任何成功的页眉设计都离不开简洁这一基本原则。访问网站时，图片不仅要快速向访问者传达出网站的基本主题，还要反映出网站的行业属性。此外，原创性在页眉设计中也是必不可少的一环。因此，从某种意义上来讲，选用的图片要独特，不要直接从其它网站复制。当然，你也可根据网站的主题自行设计图片。HTML标签-H1标签是每个网站不可分割的部分，因为它可起到强调网站标题的作用。同时，H1标签也是通过搜索引擎推动网站指数（网站评估）的手段之一，在网站设计时应注意这一点。另外，在对页眉的文本进行编码时应按照关联性由高到低进行排列。页眉应靠近内容区域-这是横幅设计应遵守的基本规则，这样放置横幅既能方便访问者，又能为他们节省大量搜索相关信息时间。合适的标签-如果你的网站页眉设计得光彩夺目，通常在其下方的内容中应放上合适的标签。此举不仅能消除访问者的疑惑，还可防止出现败兴而归的现象。网站横幅主要的职责是为来访者留下良好的第一印象。一个设计精美，引人注意的横幅胜过千言万语。

2、网页设计如何制作吸引人的banner?求解答

勾起你的好奇心
网站内容撰写者和网站设计者总是想方设法唤起浏览者的好奇心。作为网站banner设计者他们的目标就是吸引浏览者，通常情况下忽略对网站站主来说更重要的内容。尽管如此但是，因为“不要点击这里”什么也没有告诉我们只不过是另一个网页的内容而已。它唤起了浏览者的好奇心，让人们不得不点击这个banner去看看里面到底有什么。
简单且完整的设计当LarryPage和Sergey
Brin向潜在投资者介绍他们的产品——“Google”的时候，他们将Adwords作为后备选择——万一他们不能获取任何利润的话。最后他们采用了后备计划，同时我们也看到了他们的选择是多么明智。是什么让枯燥乏味的广告得这么成功？与其他广告不同的是，他们既没有唤起浏览者的好奇心也没有影响网页的主流思想。事实上，其相反面是正确的。Adwords看起来像搜索结果的一部分，让人们感觉这些广告是由需而生的。这个简单的设计不仅帮助Google提升了他们的搜索引擎同时也促进了Adwords广告的发展，对此我们毫无疑问。参与互动
Banner设计者会巧妙地运用一些类似Flash的工具设计一种可以邀请用于参与互动的banner。让用户参与互动的方法多种多样。一些网站设计者利用一种在以前很流行的游戏元素设计banner。我们都知道pacman（吃豆人）这个很流行的游戏。我以前见过一个我最喜欢的banner就是让pacman去“吃”美元。结果就是出现了一个很漂亮的标语要求你开储蓄帐号，帮助你用固定的利率存钱。这个互动banner后面的目的很简单就是让用户参与互动，然后当他们的意志不是很坚定的时候在恰当的时机向他们介绍销售信息。
经过实践证明这些互动banner是很有效果的。这样的banner的最大的缺点就是大部分网站管理者不允许在他们的网站上使用。因为他会影响网页内容。返归黑白色
网站设计者总是试图尝试不同的设计思路。最近流行的设计潮流是黑白色banner。虽然研究证明蓝色和黄色的banner颜色是最有效的，但是黑白的banner最近用的比较多。这个潮流流行一段时间后可能会消退，但是我们的设计原则就是追求与众不同，勾起用户的好奇心，超越常规
你听说过这个网站没有？这个网站的地址是：milliondollarhomepage.com。如果你没有听说过这个网站，那么，在继续阅读本文之前，请先浏览一下这个网站。这个网站证明，创造性思维不仅能够给你带来利润，同时也可以引领一个全新的潮流。在milliondollarhomepage.com得到了网络社区的注意力之后，很多设计者利用这个想法设计一个banner,
在这里他们可以出售一块10x10
pixel大小的空间。就如原来的设计思想一样，这个banner设计达到了原来的目的。

3、网站Banner怎样设计出高大上的感觉

素材积累。
找一些高质量的图片

个人认为字体/内容是一个BANNER的精华。背景和元素应该紧紧围绕内容来。既要好看，又要内容突出，能刺激用户去点击。

留白原则：不要把banner排得过满，要留出一定的“呼吸”空间，这样既减少了banner的压迫感，又可以引导读者视线，突出重点内容。

一致原则：排版时，要注意整个设计的一致性和连贯性，避免出现不同类型的视觉元素。

4、如何设计好Banner需要注意的几点

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 的显示尺寸非常有限，摆放太多产品，反而被淹没，视觉效果大打折扣。所以，产品图片不是越多越好，易于识别是关键。

5、怎么设计网页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。所以，apple的slogan简约而不简单。

6、网页设计中banner设计尺寸是多少

不同的环境下设置的尺寸都不一样

1、800*600下，网页宽度保持在778以内，就不会出现水平滚动条，高度则视版面和内容决定。

2、1024*768下，网页宽度保持在1002以内，就不会出现水平滚动条，高度则视版面和内决定。

3、在ps里面做网页可以在800*600状态下显示全屏，页面的下方又不会出现滑动条，尺寸为740*560左右。

4、1024*768 下网页的尺寸:width=955,height=600                                             

800*600 下网页的尺寸:width=760,height=420。

5、一般分辨率在800*600的情况下，页面的显示尺寸为：780*428px，

分辨率在640*480的情况下，页面的显示尺寸为:620*311px，

分辨率在1024*768的情况下，页面的显示尺寸为：1007*600px。

(6)网站banner设计扩展资料：

banner设计标准尺寸大全

Internet Advertising Bureau
(IAB，国际广告局)的"标准和管理委员会"联合Coalition for Advertising Supported Informatiln
and
Entertainment(CASIE，广告支持信息和娱乐联合会)联合推出了一系列网络广告宣传物的标准尺寸。

这些尺寸作为建议，提供给广告生产省和消费者，使大家都能接受。现在网站上的广告几乎都遵循IAC/CASIE标准。

1997年第一次标准公布

Num Size(pix) Name

1、468×60 全尺寸banner

2、392×72 全尺寸带导航条banner

3、234×60 半尺寸banner

4、125×125 方形按钮

5、120×90 按钮＃1或小图标

6、120×60 按钮＃2或小图标

7、88×31 小按钮或banner

8、120×240 垂直banner

2001年第二次标准公布

Num Size(pix) Name

1、120×600 "摩天大楼"形

2、160×600 宽"摩天大楼"形

3、180×150 长方形

4、300×250 中级长方形

6、240×400 竖长方形

7、250×250 "正方形弹出式"广告

IAB 将不再支持1997年第一次公布标准中的392×72形。

从banner自身的设计大小看

1、全尺寸banner横幅设计为468*60px，半尺寸banner为234*60px，小banner为88*31px，另外120*90，120*60也是小图标的标准尺寸。

2、页面长度原则上不超过3屏，宽度不超过1屏。

3、每个非首页静态页面含图片字节不超过60K，全尺寸banner不超过14K。

4、每个标准页面为A4幅面大小，即8.5*11英寸。

参考资料来源：网络-网页设计标准

7、官网banner的设计尺寸一般多少

官网Banner设计尺寸一般是468*60像素，大小如果gif格式是14K，如果是swf格式是16K。

全尺寸banner是468*60px，半尺寸banner是234*60px，小banner是88*31px，另外还有120*90，120*60也是小图标的标准尺寸。

336*280、300*250、以及160*600 这三种大小的Banner广告在宣传效果上较好。在高度一定的情况下，宽度越大，效果也会越好，因为这样广告会给用户带来了较好的阅读体验。Banner位置在网页的顶。

(7)网站banner设计扩展资料：

随着大屏幕的显示器出现,banner的表现尺寸越来越大,760X70;1000X70像素的大尺寸banner也有。

根据IAB国际广告局2001年第二次标准公布的尺寸有：

1、"摩天大楼"形尺寸：120×600 

2、 宽"摩天大楼"形尺寸：160×600

3、 长方形尺寸：180×150

4、中级长方形尺寸：300×250 

5、大长方形尺寸：336×280

6、 竖长方形尺寸：240×400

7、 "正方形弹出式"广告尺寸：250×250

8、网站设计 banner设计应遵循哪些原则

原则：你的老板或者你的主管说好就好。
设计这个行业，讲究的是遇到对的人。