谁说鱼和熊掌不可兼得?
又谁说形象和销量不可兼得?

大唐全网络整合营销:

网页设计中的那些经典构图方法之黄金分割

录入者:大唐视觉 文章来源:大唐视觉 点击数: 1685 发布时间:2016-08-09 13:36:38

黄金分割意义:

它具有严格的比例性,艺术性,和谐性,蕴藏着丰富的美学价值,做为高端网站设计者们一定要熟练掌握它。

研究构图的目的是研究在一个平面上处理好三维空间——高、宽、深之间的关系,以突出主题,增强艺术的感染力。构图处理是否得当,是否新颖,是否简洁,对于设计作品的成败关系很大。 在网页设计时,可借鉴于此,网页需要注意应用黄金分割。现在的响应式网站更要研究应用黄金分割法。

黄金分割介绍:

黄金分割线是一种古老的数学方法,黄金分割的创始人是古希腊的毕达哥拉斯,他在当时十分有限的科学条件下大胆断言:一条线段的某一部分与另一部分之比,如果正好等于另一部分同整个线段的比即0.618,那么,这样比例会给人一种美感。后来,这一神奇的比例关系被古希腊著名哲学家、美学家柏拉图誉为“黄金分割律”。黄金分割线的神奇和魔力,在数学界上还没有明确定论,但它屡屡在实际中发挥着意想不到的作用。

案例:

从远古时代,美观与美学就开始受到人们的赞扬。但很少有人知道最有效、最平衡完美、最有视觉冲击力的创作往往和数学有着丝丝的联系。直到1860年,德国 物理学家、心理学家Gustav Theodor Fechner提出一个简单比率,通过一个无理数来定义大自然中的平衡,即黄金分割率。Fechner的实验很简单:十个矩形具有不同的长宽比,请人们从 中选出最美好的一个。结果显示,最受青睐的选择是具有“黄金分割率的矩形”(比例为1.618)。

黄金分割率:

黄金分割率基于数字φ=1.61803398874……,该数字最早由意大利数学家 Fibonacci提出。Φ是斐波那契数列1,1,2,3,5,8,13,21,……中从第二位起相邻两数之比,即2/3,3/5,5/8,8 /13,13/21,...的近似值。在该数字序列中,下一个数字(从第三个开始)是前两个数字之和,即1+1=2,1+2=3,2+3=5,……。该序 列中两个相邻数字相比,如5/3=1.67,21/13=1.615,所得的结果与φ(1.618)越来越接近。

这个数字了不起的地方 在哪里呢?一些人认为它是最有效率的结果,自然力量的结果。一些人认为它是设计的普适常量,神的签名。无论你相信哪一种说法,我们在大自然中所发现的所有 设计中,φ为其创造了平衡、和谐与美观的感觉。那么,人类在自己的艺术、架构、颜色、设计、作曲,甚至音乐创作中,利用这个在自然界中发现的比率以达到平衡、和谐、美观的目的,也就不足为奇了。从帕台农神庙到蒙娜丽莎,从埃及金字塔到信用卡,都应用了φ。

鹦鹉螺的曲线黄金分割构图也体现在网页构图上,如titter的IPad版。

植物:

“黄金角度”生物学家发现植物种类繁多、叶子形态各异,但是叶子在茎上的排列却有着特殊的规律.我们从某种植物的顶端往下看,便会发现上下层相邻的两片叶子之间所构成的角约为137.50,如果每层叶子只画一片来表示,第一层和第二层的相邻两叶之间的角度约为137.50,以后二层到三层、三层到四层、四 层到五层……两叶之间都成这个角度,这个角度对叶子的通风和采光最为有利.这叶子之间的137.50角与黄金数又有什么联系呢?我们知道,一周为3600,137.50:=137.50:222.50≈0.618.也就是说,各种植物叶子的生长规律中自然隐藏着黄金数。

向日葵花有89个花辫,55个朝一方,34个朝向另一方。

人物:

面部比例。相貌对不起观众的人各有千秋,美丽的人却有很多相似的地方。奥黛丽赫本有这标准的三平五眼,作为公众的美女,我们看看他的脸部有那些黄金分割吧。

“黄金矩形”是指一个长方形的宽度是它高度的1.6180倍。 例如,一个划分为300 px的一侧, 则另一侧为300 * 1.6180≈485 px可以称之为黄金矩形。

如果你从这个黄金矩形切分一个完美的矩形,留给你的会是另一个黄金矩形:

你可以更小的矩形继续做同样的动作,然后再继续切分下去,无限循环,你会得到这个熟悉的图像:

yourlocalstudio.dk

这个网站有两三个页面有用到黄金比例。主页是关键信息的一个概念性诠述。然而,当您访问工作室页面时,会发现它融合了一点传统的web布局与黄金分割矩形,如以下页面:

通过利用黄金比例来进行网站设计。该设计表面上采用了渐进式的组织分明、结构清晰的网格系统,你可能会说,这些一切都看起来像引导。。。留意了越来越多的网站都是以结构更动态的布局来吸引用户注意力。

mashable.com 黄金分割应用

www.jandk.fr黄金分割应用

我们很多时间喜欢把重要的东西放在正中心,表示重视想吸引目光注意。但是我要告诉大家。正中心属于盲点区。也就是说按人的视觉习惯来讲正中心是常常被忽视的。并且放在正中心也不会引起视觉刺激。用句玩笑话来侃一下:两眼中间是看不清楚的。不信拿你的手指指着鼻尖看你的手。那什么地方是视觉中心点呢,这就要用到上面的概念了。不过什么a:(a+b)=b:a都太麻烦了谁会那么细致的去算呢。这里用中国的九宫格原理就清楚得多了。四个视觉中心点很显然大家也清 楚是什么位置了。

关于布局也许是大家最不放在眼里的地方,其地位如同文字的排版一样,随便可布,布即随便。但是看过我上篇《网页设计技巧》的朋友也许就会清楚,其实文字排版是一种不起眼但却非常重要的细节。做好了会让作品更为精细漂亮,做不好也许就成为作品失改的重要原因。其实布局也是一样,需要我们足够的重视起来。下面我要讲的不是网页布置成“左中右”、“左右”、“上中下”之类的问题。而是讲位置的重心与位置之间的对比关系。

大布局 基本上网页的布局分为,上中下、左中右、左右、上下、与上下左右之混合几类。同时我们还要思考的是分辨率与网页大小的关系。现在大部分的机器都是1024以上的分辨率了,那我们的宽度是不是一定也要顺应变得宽一点呢。个人观点是大可不必。因为网页本身也会与浏览器产生视觉对比。如果塞得太满势必也不是很好看。如果留下空隙网面与留出来的空白也可形成一定的对比,其比例也较接近黄金分割率。所以我觉得还是不要塞满浏览器为好,给创意网页一个可以呼吸的空间。

黄金比例自然会吸引用户的眼睛到页面上某个特定的点。作为一个概念,它可以帮助你思考内容的布局以及有效利用层次结构,组合布局,排版,色彩和总体原则,将有助于将你的设计标准水平提升到一个新的阶段。


以上为大唐互联网+(北京网站建设 www.1do.cn)从网络收集整理的文章,若转载请注明来源,违者必究。

Tags:

大唐网络观点:北京网站设计-企业网站设计成功要做到5个100%,北京网站建设多年的经验。一是网站定位要做好;二是网站策划要做好;三是网站创意设计要到位;四是网站程序及制作要做;五是网站运营要做好。大唐是北京网站设计公司里定位做高端网站设计的公司
点击看大唐网络建站优势>>

大唐网络分享:世界最新网站技术,最新网站设计,最新网站配色,最新网站流行,最新网站创意,最新网站版式,最新网站资讯等。北京网站制作与世界接轨,北京网站建设独具特色
点击看国际网页设计欣赏>>

相关动态
企业网站设计的域名命名方法
高端网站设计中登录页面设计
高端网站建设中首屏多色块设计
高端网站建设弹出窗设计
高端网站建设中注册页面设计linkedin案例
网页设计中平衡构图法应用总结
网页设计中的那些经典构图方法之黄金分割
网站建设中网页表单的设计规则
网站整体与品牌整体性研究
大气的网页设计特点
  • 网站备案:京ICP备12007931号-5
  • 京公安网备 110105012777
  • 版权所有©2015
  • 北京大唐视觉国际品牌咨询有限公司官网
  • 技术支持:大唐互联网+