网站banner图设计策略
这次要讲的是如何设计网站轮播图，昨天大梦已经给大家分析过网站轮播图的风格与样式，这次我们来开启下一步，实操。为方便大家阅读和理解，这次我根据网站轮播图的整个设计过程来进行讲解。
整个设计过程：明确需求→确定尺寸→确定设计风格和版式→构成元素（字体∕图片∕背景色∕点缀）→调整配色
上海聚搜信息技术有限公司是阿里云的代理商网址:可以直接在网站上联系阿里云代理商客服进行咨询服务器架构和配置以及优惠价格！是一家致力于搜索引聚搜营销及全网营销，致力于为客户提供搜索营销领域的服务，帮助广告客户在搜索引聚搜获取的投资回报，包括搜索引聚搜竞价服务()，搜索引聚搜优化服务（）和搜索营销代运营服务，能够有效为广告主带来高效的投放回报，我们的理念一直是：让搜索营销营销具有价值。金推网：www.jintui.cn
一、确定尺寸
根据放置的位置不同，轮播图的尺寸也有区别。
根据谷歌统计，最有效、标准的轮播图尺寸是:
导航栏轮播图：728×90
半屏轮播图：300×600
中等矩形轮播图：300×250
长矩形轮播图：336×280
二、文案
1、字体选择
轮播图中常用的字体主要有衬线体、非衬线体、书法体。
衬线体是模仿中国古代字体和古代碑文上的字体，笔画有粗细之分，简单易变形，修饰性强。推荐使用字体：宋体、方正俊黑、华文细黑等。
非衬线体笔画粗细相同，简洁有力，容易吸引用户目光。推荐使用字体黑体、方正兰亭粗黑、汉仪润圆等。
书法体源于中国古代，适合中国风、传统文化和国人豪迈气质的主题。推荐使用字体汉仪尚巍手书、李旭科书法等。
小tips：
商用字体要注意版权问题。
同一画面中使用的字体最好不要超过三种，太多会显得画面杂乱无章。
2、文案内容
在轮播图的设计中，文案内容不需要长篇大论，页面上的文字最好不要超过4行，只要能高效的吸引用户的注意力，准确传达信息就可以。文字篇幅过多会消耗用户的耐心，也会导致排版布局不美观。
小tips：
同等级的文案内容尽量保持字体、字号、颜色上的一致性，不然页面会显得太杂乱。
如果字体颜色相同，可以根据字号的大小来区分信息层级。
三、背景选择
轮播图的结构包括文案层、背景层、装饰层，背景层又包括图片背景和背景色。
图片背景：
图片元素是轮播图背景层的重要部分，既包括整个页面的背景图片，也有产品图。尤其是精修过后的产品图，显得更加精美、有品质，提高用户的信任感。
背景色选择：
一般色彩的选择与行业性质相关。不同的颜色、不同的色调能够引起人们不同的情感反应，这就是所谓的色彩联想作用。
以下是不同的颜色所产生的的感受一览表。
红色：是一种激奋的色彩，传达了兴奋、激情、奔放和欢乐的情感，能使人产生冲动、愤怒、热情、活力的感觉，对眼睛刺激较大，容易产生视觉疲劳，使用时需要慎重考虑。
黄色：代表阳光、年轻、活力满满。一般适用于用户偏年轻的产品上，或者食物上，黄色也能让人产生食欲。
蓝色：具有沉稳的特性，是最具凉爽、清新、专业特点的色彩，传递出冷静、智慧、自信的情感。常用与强调科技和效率的商品或企业中，大多数男性产品也常使用蓝色。
绿色：代表健康、安全、新生和睦的情感，能够创造出平衡和稳定的页面氛围。常用于健康、生态、医疗领域的产品网站上。
黑色：代表权力、高贵、稳重、现代感、科技、庄严的感觉。一般适用于汽车产品、智能科技产品和高端奢侈品上。
白色：代表科技、简单、纯洁、素雅、高端、明快、和平的感觉。一般用在家居、化妆品、高端产品上。
橙色：是充满活力的颜色，可以让人联想到金色的秋天、丰硕的果实、跳动的火苗，是一个欢乐而幸福的颜色。
紫色：代表了神秘、高贵、优雅、浪漫的感受，如紫色的薰衣草被认为是浪漫的。但眼睛对于紫色细微变化的分辨力很弱，容易引起疲劳。
小tips：
颜色的选择需要考虑到企业的VI 色；
颜色的饱和度不宜过高，背景就是背景，不能喧宾夺主；
如果想要丰富画面的层次感可以考虑采用渐变效果。
四、点缀元素选择
点缀元素在轮播图中可有可无，但是使用了就会让整个画面看上去精致很多。
一般来说，点缀元素数量越多，形式越多样；色彩越多，明度越高，越不规则，画面越活泼，反之，越高冷大牌，有逼格。
点缀元素分为光效、几何元素、线条、实物等。
几何元素，一般都会比背景深一些，有时也会采用渐变，可以更好的融入背景中。采用几何点缀可以使画面更加活泼。
实物点缀是很多图片常用的手段。常出现在画布边缘且不显示全貌，既能保证画面不空洞，也不会喧宾夺主，这种手法需要注意虚实变化，多用高斯模糊做一些虚化，效果会更明显。
最后，只有达到点缀元素与画面的和谐统一，才能让网站轮播图看起来更有质感，更吸引人。
五、配色网站推荐
在轮播图设计的最后一步，需要调整整体的配色，使画面看起来更加和谐。
上文也提到了不同颜色所表达的情感，但是要灵活运用，合理搭配也需要多看多练培养审美。
下面大梦就推荐大家一些好用的配色网站。
一个非常好用的配色网站，网站提供了非常多的配色方案，对比色、邻近色、相对色都有。点击色彩就会出现色值，如果你喜欢某套配色，直接拿走就行。
点击颜色就会出现以这个颜色为主的案例设计。不仅对于色彩搭配的学习，对于设计审美的提高也有很大帮助。
页:
[1]