Banner图,是一个网站设计的重中之重,是整个网站的第一个传达重要信息的窗口。好的banner设计,会迅速抓住浏览者的眼球,让浏览者迅速了解网站的业务范围。让浏览者停留网站变长,让浏览者有兴趣去点击其他的页面,达到网站传播信息的目的。

如何设计一个好的网站banner呢?一个好的banner离不开构图,文字,色彩,产品元素,模特,排版等等因素。所以,做banner的时候先要想好如何组合好这些元素,达到最高的视觉冲击,让浏览者深刻的记住。
- 构图
构图是banner的基础部分,一般先确定好构图,再写上相对的广告语丰富banner内容。常用的构图不外乎左图右文,左文右图,两边文字,中间图片等。

采取左文右图,描述产品的特性

采取左文右图,配上吸引人的广告语,引导浏览者点击

采取两边产品和模特,中间搭配文字,让banner更饱满
2. 文字
文字设计排版在banner设计中,也显得尤为重要。好的文案,会让banner想表达的东西一目了然,快速定位。字体的气质和画面的气质统一,这样画面看起来才不会有违和感。通过艺术字体的搭配,文字大小,主标题副标题的表现形式,让banner的可读性,趣味性马上提高。

采用刚性的字体,描述特性,再搭配常规字体,让产品的特性更生动的呈现

通过中英文字体组合,简单明了的特出商品特性
- 色彩
Banner色彩一般会采用跟网站的主色调能形成强烈对比的色彩,特出banner的冲击力,让浏览者的注意力一下子被吸引进来。产品,文字跟banner的背景色也要形成强烈的对比,让产品和文案更加突出。

网站是黑白色调为主,搭配暗红的背景色、白色的字体、高亮的模特,突出了产品特性

浅色的背景,搭配深色的字体和模特,让产品更为立体
总的来说,通过文字,构图,色彩等搭配,可以让banner生动起来。只有不断的练习摸索,不断的去组合形式,才能让banner发挥它的特性,发挥它在网站设计中不可获取的作用。