网页设计教程之背景中的他!她!它!

所属分类: 网站运营 / 建站经验 阅读数: 96
收藏 0 赞 0 分享

笔者曾经在《图文搭配,网页不累》的案例中提到,视觉引导对于首次访问网站的用户非常重要。当用户来到一个完全陌生的页面,网站必须予以合理的引导,这样才能让用户有继续浏览点击的方向。

人物背景网页设计的好处不仅如此,以下是笔者为大家收集的各种相关案例,让我们在案例中继续探索。

1、第一个案例是笔者为OYAMA定制的官方网站。从首屏设计上就不难看出网站需要表现出一种积极向上,充满朝气的氛围。因此设计师很巧妙的将人物元素融入METRO的设计风格,这样既能避免色彩多造成的视觉疲劳,也能顺势利用丰富亮丽的色彩,让网站看起来更加生动有活力。

网站建设 网页设计风格 网页设计 网站用户体验

2、Ballet与普通的人物背景网页设计不同,在人物的处理上没有使用高清的大图,而是故意做了充满朦胧感的模糊处理,搭配经典的黑色,让网页多了一层神秘感。为了掩盖大量的留白可能会带来的单调,设计师用人物的大幅度动作让页面看起来更充实。

网站建设 网页设计风格 网页设计 网站用户体验

3、HotDot的网站背景风格似乎很符合现代设计师的口味。背景中的人物使用亮点不仅仅只在于独特抢眼的妆容上,更在于人物的视线方向上。从整个网站的布局上来看,用户体验并不是很理想,导航在首屏的底部,而且字体和颜色也很不利于阅读。所以,设计师利用人物的视线,将用户的视线带到了底部导航部分,很大程度的弥补了这一不足。

网站建设 网页设计风格 网页设计 网站用户体验

4、这个网站很明显是一个产品的推广网站,所以设计师用最简单直接的方式吸引用户关注产品。虽然产品在首屏中的占比很小,但却仍然能够把浏览者的注意力集中在产品的部分,除了产品以外部分的设计都尽可能的精简,就连按钮也采用了幽灵按钮的设计。

网站建设 网页设计风格 网页设计 网站用户体验

5、使用高清大图作为背景是2014年的网页设计趋势之一,在这个案例中也有一定的体现,而使用高清图片的特点就是让画面的真实感更强,但同时也许会流失一些美感。如下案例所示,老奶奶布满皱纹的脸的确让网页更多了一些生活感和亲切感,但如果不加以修饰就就会显得有些许苍白单调,因此设计师巧妙的加以纹理背景,让画面看起来既不失真又美观。

网站建设 网页设计风格 网页设计 网站用户体验

6、这个案例中使用了大量的圆形元素,而看似独立的图形反而会让用户尤其注重其中的内容和条理关系。仔细看每个圆形中的布局方式,设计师很细心的用布局来弥补几何元素带来的“凌乱”,让用户感受到网页的个性。

网站建设 网页设计风格 网页设计 网站用户体验

7、有人物的任何场景都能表现出不同的情感,就算没有眼神、动作的交流,一个简单的背影也能引发出浏览者的无限遐想。

网站建设 网页设计风格 网页设计 网站用户体验

8、Metro的设计加上五彩缤纷的色彩,这对第一眼的视觉冲击还是很有作用的,但这只能针对走马观花的用户,多看两眼会让人有点摸不着头脑。而该案例中的人物使用让整个画面连贯起来,图片中每个人物的肢体流向成了用户们浏览网站的线索。

网站建设 网页设计风格 网页设计 网站用户体验

9、LOCALS AP

PAREL的网站前三屏都使用了人物背景,这三张图片中人物所表现出的形态都不尽相同,但展现出的效果却很类似。这个网页背景是一个很典型的用画面中的人物来引导用户的案例,设计师利用同一个人物的不同方向,让整体变得既统一又清晰。

网站建设 网页设计风格 网页设计 网站用户体验

10、他?她?还有它!幽默的拟人化动物形象能为网页加入更多的诙谐色彩。如下案例所示,大猩猩不例外的成了整个页面的主角,为了要将用户的视线引到内容或是导航上,设计师在这些内容上添加了纯色块,让网页主次分明。

网站建设 网页设计风格 网页设计 网站用户体验

使用人物作为背景的网页风格大多以简约为主,因为这样才能将其作用更好的展现出来。表情的确是一种很奇妙的内心表现形式,很细微的变化就会反馈给对方不同的信息。

更多精彩内容其他人还在看

打造成为优秀网站的10个技巧 推荐

每一个网站管理者都希望他们的网站是最好的。总有一个原因让他决定建立一个网站。但不管原因是什么,无论是出于商业目的还是为个人使用,创造一个令人印象深刻的网站始终是主要目标。
收藏 0 赞 0 分享

域名被别人备案了的注销方法

如果你发现自己的网站域名被别人备案了,可以按以下步骤撤销备案
收藏 0 赞 0 分享

降低网站被K的可能性 明晰网站优化的常见错误

搜索引擎优化很重要,也可以说是必不可少的东东,很多刚刚接触到SEO的朋友,在进行优化的操作上“不明白”或者“不清楚”,很容易出现操作错误,所以,就出现了被K的状况,有效的避免这些错误
收藏 0 赞 0 分享

国外windows主机要注意权限级别

最近要上一个.net的网站,而这个网站是采用xslt的,xslt中有使用到自定义脚本msxsl:script,但放到godaddy的服务器上去之后,却报出了黄页错误。
收藏 0 赞 0 分享

网站盈利不要在SEO的一棵树上吊死

无论你是做电子商务,写博客,操作一个企业网站或者是建个小站赚Google Adsense, 都可以找到相应的策略获得成功。当然成功是要通过大量实践得到的,不要只拘泥一种营销策略,只有多尝试才能知道哪几种对你的网站最有效。
收藏 0 赞 0 分享

注册资金难道创业者 互联网创业谈

创业者个个像愚公,当你决定去创业时,一推开门,面前就是一座座大山挡在了你前进的道路上,首当其冲的便是:注册资金。
收藏 0 赞 0 分享

购买虚拟主机10个注意事项

下面是我觉得在选购虚拟主机时候需要考虑的几点要素,希望对大家在选购虚拟主机的时候有一定的帮助。
收藏 0 赞 0 分享

搜索引擎流量下跌后的分析诊断过程

对于SEO来说,除了需要通过各种手段来实现网站的流量增长之外,我们也需要面对一个严峻的问题:流量下跌后,怎么办?这个时候,我们就需要分析流量下跌的原因,同时提出解决方案。这篇文章,我跟大家简单讨论下,如何做好搜索引擎流量下跌后的分析诊断过程。
收藏 0 赞 0 分享

新手认识 制作一个网站的成本分析

今天这个话题也是我很早就想谈的,谈谈自己从做个人网站到现在,在网站空间成本上的体会。看对大家有没有不一样的启发。
收藏 0 赞 0 分享

Groupon 美国团购网站的三方共赢的盈利模式

超低价,抢!以往这样的状况大多发生在商场的折扣专区,现在,这一场景在美国团购网站Groupon.com(下称Groupon)上得到再现,用户们疯抢网站每天推出的诸如餐饮、SPA、跳伞以及高尔夫这样的商品或服务机会。
收藏 0 赞 0 分享
查看更多