聊聊那些大背景图片的网页设计

2015-11-26 22:48:16智导互联

句话总结:有图有真像。也许正因为这样,现在越来越多的网站使用引人注目的大图片来设计,在视觉上吸引人的注意,同时也是一种传达信息的重要方式,对游客来说更是一种视觉体验。

如何合理的运用大图片来设计?

遵循以下的步骤,确保你正确地使用平衡元素:

1.先确定和优先考虑网站的目标。用户目标和商业目标(包括品牌目标)。页面是否是通过营销手段来建设你的网站?或者是否大部分的浏览者已经熟悉你的机构(或者是所属的行业)。并且确定现在是否需要一些特殊的信息和功能?

2.确定你所设计的每一个元素是否与网站的建设相符合。图片一般是起到装饰和支撑品牌效应的作用。导航栏和结构化搜索一般与特定的用户项目有关。

3.根据目标的重要性分配视觉的轻重级。如果一个所设计的元素是为了支撑一个高优先级的目标,那么这个元素在视觉设计上应该更强烈一点。相反,设计二级目标相关的元素尽可能地的平和一点,减少强调作用(这条规则听起来很容易,但在设计时往往会被忽视)

4.挑选的图片应该与品牌效应相结合。记住,你的网站不仅仅是展示图片,除非是Flickr。所选的图片应该能表明你建设网站的原因。

5.选择引人注目的图片是为了起到吸引的作用。如果网站的图片与其它元素是同等重要,你就得决定哪种类型的图片更适用,只有这样你才能找到更有吸引力的图片。

6.在更新你的网站时要精心挑选设计模式。对于许多设计项目而言,建设一个看起来更“现代化”的网站是很重要的。然而却有很多种方法可以实现这一任务。排版,布局和品牌色彩。这只是简单地举几个例子,都能有效地创建一个在视觉和感观上面都具备“现代化”特性的网站,同时对关键部分还能给予适当地强调。

何种情况下采用大图片设计?

你的网站决定该采用哪种最佳设计方式是首要问题,在大多数情况下,你的网页有个目标和目标用户,具有吸引人们注意的大图片设计固然有价值,但是有利也有弊,相对于文本信息就更容易被忽视。

苹果主页也采用大图片为焦点的设计模式,这张图片实际上是展示他们最新的产品,并通过强大的导航栏提供给用户购买该产品的渠道。当然,大图片本身也提供了很多有用的信息,它清晰地向用户展示了这两款手机模型的相关尺寸。

苹果主页展示了他们最新的产品,并搭配有强大的全球性导航栏给用户强烈的视觉体验,这与轻量的主页背景形成鲜明的对比。


 

微软搜索引擎Bing的主页伴有不断变化的背景,是极端偏向于图片设计的另一个例子。网站是完全致力于有别于大多数网站的设计约束。这个网站的主要功能是向用户展示搜索框,没有其它过多的设计去强调不必要的元素。网站巨大的白色搜索框已然清晰地从其它元素中脱颖而出。这也达到了微软的预期效果。

 

微软Bing主页采用大图片作为背景的设计


平衡图片与其它元素的方法

大多数网站会采用相对平衡的设计方法:选用的图片能支持品牌,并且不掩盖其它重要的元素。例如StateFarm的主页采用一张象征开车的大图片,这也是他们业务的关键部分。但这张图片并没有影响其它元素的呈现,强大的导航栏和其它基本的元素其中包括登陆,报价和处理保险索赔等功能模块依旧能清晰地展现在用户眼前。

 

StateFarm主页用了一张引人注目的大图片,同时也注重其它元素的呈现。


文章由北京网站建设、北京UI设计、北京网页设计-智导互动编辑