网页设计是网站建设的基础。任何一个外观优美、大方、稳定的网站，都必须有一个经验充足、技术能力强的前端设计师。虽然我们看一个网站，但是它是由三种基本样式组成的：文本、图片和连接。但是，在设计师眼里，网站的任何网页都是一张图片。网页由四个重要内容组成：页眉、徽标、横幅、内容和页脚。横幅设计的风格和风格决定了整个网站的色彩和情感，也是网站带给用户的第一感觉。

　　Banner的设计过程可以分为五个步骤：

　　首先，了解需求

　　第二，根据需求确定设计风格

　　第三，根据材料和文案确定版面

　　第四，构成横幅的元素设计(文案/背景/点缀/材质)

　　第五，调整配色方案

　　从整体的设计风格上，我们可以直观的看到设计风格的方向和特点，找到适合我们网页的风格和方向是最重要的，整体的搭配在网站建设的过程中永远不能走初始的趋势。

　　一.了解需求

　　任何设计的前提都是理解设计需求。只有了解需求方真正想要的是什么，才能少改几次稿。刚开始工作的时候，我没有遭受这种损失。当时刚进公司的时候，脸比较瘦。别人让我做什么，我立马挽起袖子，打开ps开始工作。不明白的地方不敢问太多，怕打扰别人工作。事实证明这种想法是多么错误。

　　需要了解的可以归纳为以下几个方面。

　　1.确定复印信息、材料、尺寸和交付平台

　　一般在收到设计要求时，由需方确定副本和资料。但是，有些需求者会说，你可以根据你的设计需要，稍微更改一下复制信息。我个人经验，这句话真的是火坑。文案的不确定性会严重影响设计过程。你改好了，他们就满意了。如果你不满意，你将不得不集中精力去做。另外，有时候可以从文案和素材中获得设计灵感，确定设计风格。

　　2.确定横幅的设计目的

　　比如需求方给出的文案信息是“金秋援助”，我们需要知道金秋援助的对象是谁，是大学生还是小学生，会影响款式的确定和设计元素的选择。还需要知道需求方希望这个横幅起到什么作用，是希望更多的人参与到这个活动中来，还是希望让更多的人知道某个企业热衷于慈善事业，提升其知名度和好感度。只有确认这些，才能确定你的设计风格。

　　3.求需求方建议在给我们这个需求之前，需求者可能有自己的想法。如果能在设计前了解，修改的次数会大大减少。而且，当我们主动询问他们的意见时，他们会觉得自己的想法得到了尊重，以后更乐于交流。但有时他们的想法无法用语言来描述。这时，我们可以使用“情绪板”的方法来快速获取视觉信息。

　　4.确定设计时间

　　时间短的话，尽量选择不容易出错的板子和款式。如果时间充裕，可以仔细打磨设计作品，尝试一些以前没有尝试过的表现方法。

　　2.根据需求确定设计风格

　　Banner的设计风格，比较人很容易理解。有的人外向，有的人内向。而这两种人的穿衣风格、行为举止、言行举止在生活中也是不同的。人难过的时候会哭，开心的时候会笑。不同的设计风格也对应着不同的表达方式。下面我们主要分析一下不同设计风格对应的表达方式，给大家一些安利的参考资料。觉得有用的同学不要忘记记笔记。

　　1.关键词：文艺，气质，雅与静

　　总结：

　　(1)最明显的特征是留白，大量的留白。

　　(2)字体多为宋体排字，除了一级标题略大，其他文案很小，给人一种精致的感觉。

　　(3)颜色以灰色和白色为主，其他颜色饱和度和纯度低，亮度高。

　　(4)这种横幅多用于茶叶、棉麻制品以及以简洁为特色的家居用品。

　　(5)装饰用细纹较多。

　　2.关键词：高冷时尚

　　总结：

　　(1)高冷大旗就像高冷大旗一样，它最大的特点就是字数少，通常只有几个字。

　　(2)大多数颜色是黑色、白色和灰色。

　　(3)素材图一般都很大，突出细节，大牌的东西对自己的质量还是很有信心的，所以会放大放大细节，免得你看不到。

　　(4)很少用点缀，直接放大一张产品细节图，放几句话，就是这么自信。

　　3.关键词：传统、中国风、意境

　　总结：

　　(1)字体采用书法，文案采用竖排、从右到左的顺序，因为古人是这样写的。

　　(2)可以选用的材料有印章、中国山水画、水墨、扇面、剪纸、园林方格、古代图案、祥云、京剧、卷轴等。

　　4.关键词：青春，活力，青春

　　总结：

　　(1)突出的一点是模特们都很年轻，很有活力。

　　(2)色饱和度和纯度比较高。

　　(3)可以随意玩排版。

　　5.关键词：可爱甜美总结：

　　(1)可爱风格横幅最突出的特点是他的字体，多采用少年字体、手写字体、漫画字体。

　　(2)装饰对象经常使用卡通小元素，主要是手绘和矢量图，如星星、云彩、短线等。

　　(3)用暖色营造出柔和可爱的感觉。

　　6.关键词：节日，促销，刺激

　　总结：

　　(1)色彩丰富，红、黄、紫较多，画面饱满，留白少。

　　(2)主标题很大，往往很硬，棱角分明，带有视觉冲击力的夸张。

　　(3)可以使用的饰品包括灯光效果、鞭炮、舞台、灯光、彩色渐变、冲击线、多边形等。

　　7.关键词：未来，科技

　　总结：

　　(1)科技大旗可以概括为两个要点：科技感的背景图，高级的也包括科技感的小点缀。

　　(2)颜色以蓝色、黑色、紫色等冷色为主。画面给人一种韧性、空间感、速度感、力量感。

　　(3)可以使用的饰品有光效、金属效、线条、光斑、宇宙等等。

　　8.关键词：严肃性，规则，党

　　总结：

　　(1)因为我们伟大的毛主席喜欢红色，党喜欢红色，所以大多数政府网站和条幅都会用红色，点缀的颜色多为蓝色和黄色，字体多为凝重而古典的带有浓厚中国气息的行间或毛笔字体。

　　(2)可用的背景和饰品包括红旗、城市背景、党徽、英雄雕塑、故宫、石狮等。

　　9.关键词：手绘风格

　　总结：

　　(1)把手绘风格单拿出来，因为真的很好用，经常用。

　　(2)文案可以采用手绘风格。产品本身也可以手绘，左边第一张图。只需简单的几笔，整个画面一目了然，充满乐趣。手绘风格用的最多的是饰品，不同的手绘点缀营造出不同的氛围。