信息动态

网站设计是技术与创意的完美融合!

技术资讯

视觉层次感提升网页设计效果(原创)

2014-01-06 11:55:06

下面的网站设计效果,共有九张图片组成,不但有大大小小的标题,还有多个新闻版块,和一些搜索区域等,但是该网页的第一视觉并不会感到杂乱,反而页面比较有层次和干净。就是因为在这个网页效果上使用了层次对比效果,让网页各个元素之间,深色和浅色之间有了一个清晰的对比。
 
视觉层次感提升网页设计效果
在第一视觉中,电影明星盖伦霍尔显得非常醒目,原因是首先 他是该网页元素中是最大的一个,另外,他的图片轮廓和周边的方形浅色图形成了层次对比,并且他的头像超出了顶部一分部。
 
通过下面的图示也许会看的清晰:
视觉层次感提升网页设计效果
A区域是网页的重要区域;
1、该版面被划分为三个区域;
2、对每个小区域有再次进行了细分;
3、虽然经过了多次区域划分,但是A区域的颜色比较厚重些,所有在视觉上就很容易醒目的突出。
 
这种划分方法,不但让页面可以包含进很多不同的图片信息,标题信息,还能保证页面的简介美观。