网页布局的位置重心与位置间的对比关系
作者:小毅 来源:蓝色理想 发布时间:2007-10-15 19:20:00
网页的布局也许是大家最不放在眼里的地方,其实布局地位如同文字的排版一样,随便可布,布即随便。但是看过我上篇《网页设计技巧系列 之 文本排版》的朋友也许就会清楚,文字排版是一种不起眼但却非常重要的细节。做好了会让作品更为精细漂亮,做不好也许就成为作品失败的重要原因。
布局也是一样,需要我们足够的重视。下面我要讲的不是网页布置成“左中右”、“左右”、“上中下”之类的问题,而是位置的重心与位置之间的对比关系。
黄金分割率的概念大家都知道。下面我引用一段非常专业的解释:“黄金分割最早见于古希腊和古埃及。黄金分割又称黄金率、中外比,即把一根线段分为长短不等的a、b两段,使其中长线段的比(即a+b)等于短线段b对长线段a的比,列式即为a:(a+b)=b:a,其比值为0.6180339……这种比例在造型上比较悦目,因此,0.618又被称为黄金分割率。”大家也看清楚了什么叫黄金分割。
我们中国也有一种类似于这样的概念叫九宫格。这个也许就有一些朋友不清楚了,这是一种用以临写碑帖的一种界格纸。基本形是一个长方形等分九格。在这个九宫格中中间部分就产生了四个交叉点,这四个交叉点就是视觉中心点。
图示:九宫格
我们为什么要讲这两个概念呢?是因为这两个概念是设计的决窍之所在。我们很多时间喜欢把重要的东西放在正中心,表示重视想吸引目光注意。但是我要告诉大家。正中心属于盲点区。也就是说按人的视觉习惯来讲正中心是常常被忽视的。并且放在正中心也不会引起视觉刺激。用句玩笑话来侃一下:两眼中间是看不清楚的。不信拿你的手指指着鼻尖看你的手。那什么地方是视觉中心点呢,这就要用到上面的概念了。不过什么a:(a+b)=b:a都太麻烦了谁会那么细致的去算呢。这里用中国的九宫格原理就清楚得多了。四个视觉中心点很显然大家也清楚是什么位置了。
那么在实际应用中我们要怎么用呢。这点很重要,实战意义要比空谈概念重要得多。下面我们就来说一下实战中的应用,这里虽说是“网页设计技巧”,同样可以应用在平面设计与摄影或是其它的设计中,但是必竟是讲网页设计,所以主要还是举网页例。我们先从大布局来谈,然后再讲小布局,最后讲设计图片的布局。


猜你喜欢
- 前言上篇文章,讲了经典卷积神经网络-resnet,这篇文章通过resnet网络,做一些具体的事情。一、技术介绍总的来说,第一步首先要加载数据
- 网站设计时,有一个最常用的指导性原则:页面长度原则上不超过3屏,宽度不超过1屏。这个原则明显是从用户的体验出发,特别是宽度不超过一屏,其最基
- PHP 是世界上最好的语言。经典的 LNMP(linux + nginx + php + mysql)环境有很多现成的部署脚本,但是在 Do
- Tqdm库比较常用,用于显示进度条。简单用法:from tqdm import tqdmfor i in tqdm(range(2)):
- 今天给大家讲的是ASP给图片加水印的知识ASP给图片加水印是需要组件的…常用的有aspjpeg和中国人自己开发的wsImage…前者有30天
- 前言今天给大家分析3个计算机视觉方向的Python实用代码,主要用到的库有:opencv-pythonnumpypillow要是大家所配置的
- Seconds_Behind_Master对于mysql主备实例,seconds_behind_master是衡量master与slave之
- 本文实例为大家分享了python实现日历效果的具体代码,供大家参考,具体内容如下一、代码编程过程1、根据年月日算出星期几def get_we
- 在SQL Server数据库操作中,对数据库复制时出现了以下的错误,错误信息如下图所示:SQL Server数据库复制失败的原因及解决方案出
- 前言我在使用mac安装virtualwrapper的时候遇到了问题,搞了好长时间,才弄好,在这里总结一下分享出来,供遇到相同的问题的朋友使用
- 使用picasa的时候,注意到它首先是显示模糊的图片,然后图片突然变得清晰,这样做有一定的好处——picasa的图片翻页是用javascri
- 本文实例讲述了Python使用pylab库实现画线功能的方法。分享给大家供大家参考,具体如下:pylab 提供了比较强大的画图功能,但是函数
- 比较喜欢python的装饰器, 试了下一种用法,通过装饰器来传递sql,并执行返回结果这个应用应该比较少为了方便起见,直接使用了ironpy
- 本文实例讲述了GO语言实现列出目录和遍历目录的方法。分享给大家供大家参考。具体如下:GO语言获取目录列表用 ioutil.ReadDir()
- 需要引用vue-resource安装请参考https://github.com/pagekit/vue-resource官方文档在入口函数中
- TensorFlow™是一个基于数据流编程(dataflow programming)的符号数学系统,被广泛应用于各类机器学习(machin
- 本文实例讲述了Python读取一个目录下所有目录和文件的方法。分享给大家供大家参考,具体如下:这里介绍的是刚学python时的一个读取目录的
- 可视化辅助函数在下面的代码的注释内有大致的操作基本操作与前面的人脸检测的操作相似,增加了可视化的辅助函数import matplotlib.
- 使用Python读取解析xmind文件,一键统计测试用例数量。问题:做测试的朋友们经常会用到xmind这个工具来梳理测试点或写测试用例,但是
- PIL中设计的几个基本概念1.通道(bands):即使图像的波段数,RGB图像,灰度图像以RGB图像为例:>>>from