网页背景设计的最佳做法

在网页设计演化的漫长路程中,网页风格的变化尤其明显。比较一下10年前的网页与现在的网页,差异是相当显着的。最容易注意到的一个主要变化,就是背景。今天,背景已经成为决定网站的视觉效果如何的核心特征之一。背景决定了网站的主题,网站背景的设计,有着无尽的可能。本文将总结一些现阶段创意网页设计中网页背景的最佳做法与趋势。
基本背景结构
在讨论如何设计出好的背景之前,我们要首先回顾一些基本的背景方案。背景的基本结构不止一种,其中有3种比较常用。
主背景
主背景是最为底层的背景,经常是图片、图案、材质或者其他图形元素。
内容背景
结构中的另一层是内容背景。这是文本、图案以及其它基本数据或信息的背景。
方案1:内容与主背景分层
第一种结构是多层背景。在最底部是主背景,内容背景在最上层。
方案2:内容与主背景的图案或纹理直接结合
另外一种结构是直接把内容放在背景上。当主背景由图案、材质和图片构成时,通常采用这种方式。这种技巧的运用很棘手,特别是采用图片作为背景的时候。但只要注意颜色的平衡,还是能够取得很好的效果的。要保证背景与文字之间的对比度,才能获得较好的可读性。
方案3:内容与主体共用背景
最简单最基础的结构,便是主背景同时也是内容的背景。通常采用单色或者少数几种颜色,不会太复杂。
下面的网站是这种结构的单色方案。
包装/头部背景
网站中有太多的地方可以用于实现好的背景设计,其中有两个地方就是头部以及包装的顶部的后面。以下就如何处理两个部分给出了几点提示。
标准头部背景
图案、图片、材质以及颜色都适用于头部背景。可以通过简单的方法使得网站富有生机,同时不会对整体效果造成影响。
提供流畅的分割
当需要头部与布局中的其他部分分割开的时候,你需要提供一个良好的过渡。有时候头部与正文背景之间颜色或风格的适当对比便可以达成目的,其他情况下,应该尽量使者两者达成和谐,不能格格不入。
流畅的包装图案
使用图案或者其它合适的图形元素,是提升网站个性与感官感受的一个很好的技巧。除此之外,它能使设计深入人心,并在网站主题中起到重要作用。在标准布局的包装背景中使用图案,并使其流畅的过渡,是一种很美好的技巧。
使图片与主题颜色一致
包装图案与主背景之间的过渡相当的重要,使图案的背景与主背景一致是至关重要的。
保证风格与设计的其余部分一致
网页设计中经常提到一致性,因为它是网页设计具有的重要特征之一。在为一个网站设计包装图案时,应该传达出与网站设计中其余部分一致的风格,调色板也应该相似。
例如,如果你在排版、边框这样的元素中采用了手绘风格,那么图案也应该采用相同的手绘风格。
允许一些图案融入内容区域
要创建一个平滑的布局,你应该允许一些图案流入内容容器。
将图案拓展到整个布局中
仅仅采用包装背景也许已经足够了,有的时候也需要考虑将图案延续到背景的其余部分。
使用低对比度的花样或材质
细微到需要近距离观察才能注意到的纹理,可以为设计增添更多细节。低对比度的花样,即颜色范围很小的花样,就可以获得这种效果。其视觉效果很好,并且不会分散用户对其他元素的注意力。
结合材质与图案
一些网站仅仅采用某种技巧,其实多种技巧的组合使用又何尝不可?这样可以产生更加吸引人更加独特的视觉体验。下面的网站,将图案与木质纹理混合,尽管图案并不明显。
增加维度
还有另一种很赞的方法,可以使网页设计跟更进一步,这种方法便是通过光照与图案来增加维度。维度可以提高视觉体验,并且展示真正的技巧。
这个采用3D光照效果的网站看起来很漂亮,维度在背景与元素中的出色运用,能够真正的吸引用户的眼球。这种等级的维度运用,显然能够留下一个良好的印象,并让网站深入人心。
整体图片
使用固定的图片与内容背景使用图片背景要小心,因为设计不可重复。因此,你必须找到另外的方法,将图片引入布局中。
运用少量虚光效果
另外一个很好的技巧,就是虚光效果。它有助于将焦点集中到中心,用于大幅面的图片背景时尤为有效。很重要的一点,是只适用很少的虚光效果。一个采用了些许虚光效果背景的网站,更能吸引起你的注意。
找到对比度的平衡点
使用图片是很好,但是当图片比内容及内容背景更深的时候就会出现问题。用户的眼球将会被背景吸引,显然会引起可读性问题。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值