如何让您的网页页面设计脱引而出

我是那小文

我是那小文

2016-02-17 00:24

给自己一点时间接受自己,爱自己,趁着下午茶的时间来学习图老师推荐的如何让您的网页页面设计脱引而出,过去的都会过去,迎接崭新的开始,释放更美好的自己。

随着互联网的发展,Web页面在我们的生活中已经是无处不在,如何利用视觉艺术为你的Web产品增彩,也成了产品设计者逐步完善的一门课程。

一个完整的Web页面是需要点线面的合理结合,每一个页面都是一个神奇的空间,同时他的深度,广度和作者赋予的元素美感决定了这个页面的可观赏性。

要想让自己设计的页面有鲜明的艺术特色,从众多的页面里脱颖而出,下面着重从以下四点去介绍。

一、巧妙利用文字

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/pmsj/)

网页设计中,文字在整体界面中起到了主体的作用,是传达信息的主要元素,字体的的大小、颜色、字体样式甚至间距都会直接影响页面的视觉传达效果。

如下图例:

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

整体页面趋于简洁,但用文字跟图形做了巧妙的结合,使整个页面显的简而不空,同时整体文字大小对比也使页面变的更具层次感。

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

合理的将字体打散进行灵活艺术加工处理使其图形化,既呈现了信息,又使整体看起来更加贴切设计主题,更具美感和艺术性。

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

页面信息量虽大,但由于在间距和大小对比上做了合理的处理,使整个页面看起来满而不乱,很容易一眼就能找到信息点。

二、使用几何图形

网页一般都是由不同尺寸的栏目快和表格等组成,基本都是非常方正的表现方式,适当的运用一些几何图形加入其中,比如三角形,菱形或者圆形,会使整个画面更加的生动活泼和起到打破常规的作用。

如下图例:

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

提取了LOGO色,利用不同的几何图形组成固定的背景图案,使整体页面更加的形象化。

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

LOGO采用几何图形的表现方式,导航则巧妙的使用了轮盘的表现形式,使原本信息量不大且方正的页面看起来活泼和饱满。

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

利用几何外形直接作为栏目快,在hover的状态下直接呈现内容,使简单的画面丰富起来。

三、合理的留白

古人曾曰:虚实相生,无画出皆成妙境。说的就是场景中一实一虚留白的妙处。巧妙的留白可以让画面的视觉效果更加的通透,流畅和干净。避免元素的堆积造成的画面拥挤,辨识度低。当然留白并不是说页面中的白色区域,而是没有其他元素干扰的视觉区域。

如下图例:

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

以人物为中心,大面积四周留白,突出中心内容区域,虽信息量不大,但简单明了,直观的表达的网站的内容主旨。

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/pmsj/)

原本信息量很大的电子产品页面,通过精简内容和留白设计,内容不多,但突出主要功能点,使产品看起来更加的简洁和品质感十足。

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

图形化为中心的个人网站,由于信息不多,大胆的采用了大面积留白设计,巧妙之处在于在留白的基础上以图形作为网站的主要特色和主旨,通透活泼而不失严谨。

四、加入点缀色

点缀顾名思义,就是用小而精湛的手法在原有事物上加以衬托或装饰,使其更加的美好和迷人。同样,合理的利用点缀色也能在页面设计中起到画龙点睛的作用。

如下图例:

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

整体暗色调的设计,加入紫色的点缀,遍布各类主要元素,突出了信息,还使得原本沉闷的页面神秘和活泼起来。

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

朴实素净的页面,利用黄蓝的背景和元素点缀,丰富了页面内容,增加页面活力。

如何让您的网页页面设计脱引而出,PS教程,图老师教程网

大面积采用点缀色作为栏目背景色,使本来方方正正的页面变的有亮点,同时也突出衬托了栏目内容。

以上就是本次要讲的四个点,当然让页面活起来的方式肯定不止四种,像插画元素,动效等都可以为页面增彩,这就需要大家在日后的学习中多多总结和积累了。

展开更多 50%)
分享

猜你喜欢

如何让您的网页页面设计脱引而出

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
如何让您的网页页面设计脱引而出

格式塔在网页页面设计中的应用

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
格式塔在网页页面设计中的应用

什么是极简主义 如何打造极简风格家居

家居设计 装修设计
什么是极简主义 如何打造极简风格家居

8个创意风格的网页页面设计心得技巧

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
8个创意风格的网页页面设计心得技巧

精选国外创意的404网页页面设计欣赏

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
精选国外创意的404网页页面设计欣赏

2017榻榻米书房设计装修效果图 榻榻米书房设计图片

榻榻米 书房 装修设计 书房设计 平面设计
2017榻榻米书房设计装修效果图 榻榻米书房设计图片

详细解析如何做好网页页面优化

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
详细解析如何做好网页页面优化

CSS网页布局:网页页面结构化

Web开发
CSS网页布局:网页页面结构化

2017春夏女装风衣外套流行趋势

服装设计 平面设计 设计 服装搭配
2017春夏女装风衣外套流行趋势

用户体验之优化网站轮播图的技巧

用户体验之优化网站轮播图的技巧

浅谈如何让网站拥有受欢迎的交互界面

浅谈如何让网站拥有受欢迎的交互界面
下拉加载更多内容 ↓