行业动态

了解最新公司动态及行业资讯

当前位置:首页>新闻中心>行业动态
全部 5 公司动态 2 行业动态 3

网页设计也有黄金比例?涨知识了!

时间:2018-04-12   访问量:134

弗洛伦丝·科尔盖特被英国一电视选秀节目评选为英国最美的脸,因为她的脸蛋被该档节目评选为“黄金比例脸蛋”。达芬奇传世画作《蒙娜丽莎》,也是巧妙的运用黄金比例,成为创世之作。其实,无论是脸蛋、身材,还是物品,拥有黄金比例,总能给人一种具有生命力、纯天然的视觉效果。其实,黄金比例不仅可以运用在人和物上,网页设计也有黄金比例。

网页设计也有黄金比例?涨知识了!1


黄金比例

网页设计也有黄金比例?涨知识了!2


黄金比例又称之为黄金分割,是数学上的一种术语,用来表示两个元素的比例,这个值大约是1.618。这么说可能大家都不能很好的理解,我们可以这样简单举个例,假设有两个线段,一个线段是a一个线段是b,当它们的长度a+b/a的值等于a/b,即a+b/a=a/b=1.618时,黄金比例就成立了,a与b之间的点,就是黄金分割点。
从文艺复兴时期开始,当时的艺术家们就十分狂热于使用黄金比例,将其运用于各种设计作品上,例如世界著名的吉萨金字塔和达芬奇传世画作《蒙娜丽莎》,就是采用了黄金分割设计而成的。此外还有很多文艺复兴时期流传下来的雕塑,建筑,绘画等,都可以看到黄金比例的身影。
黄金分割的运用


以一个960px宽度的网页布局为例,假设我们要将这个网页分成两个板块,该如何找到它的黄金分割点呢?
通过上诉a+b/a=a/b=1.618公式,可以换算成960/1.618=593,所以593px的位置,就是我们要找的黄金分割点。在设计网站的时候,我们可以将左栏宽度设置为593px,右侧栏宽设置为367px。
这种方式,还可以适用于非固定的弹性网页,通过上诉的计算公式,计算出对应的数值即可。按照黄金分割设计出来的页面,可以给用户最舒适,最自然的视觉体验。
当然,设计网页不局限于两栏,网站设计师还可以根据企业需求和产品定位,将网页分割成三栏、四栏……
使用黄金分割设计网页,只是一项指导。你可以打破这项规则,让设计出来的网页整体看起来具有平衡感,也是可以的。例如按照5:2比例代替黄金分割,虽然这个数值不会很精准,但是却更为直观,使用起来也更为方便。
三分法

网页设计也有黄金比例?涨知识了!3


一名网页设计师在设计网页的时候,不应该完全基于某项设计理论。我们未必一定要严格按照1.618这个数值进行分割页面。例如三分法,就是一个运用黄金分割的简单又实用的延展方式。
分别用两条水平线和垂直线,将构图按照水平和垂直的方向分为三等份,做成九宫格,被我们称之为三分法。利用三分法的四条线进行交叉,可以获得4个点,而这4个点就是我们的关键点。在设计网页的时候,最好将重要的设计元素放置在这4个点。
很多时候,我们设计网站的会不知不觉运用到三分法,例如logo、导航栏、宣传语等网站的重要信息,会放置在左上角。右上角可能会放置重要性稍微低一些的内容。此外在放置标题按钮和链接的时候,多多少少也会运用到三分法。
当然作为一名合格的设计师,我们要懂得运用三分法,但不用完全严格遵守。学会灵活运用,才能设计出具有视觉体验的网页。
黄金矩形

网页设计也有黄金比例?涨知识了!4


根据不同的板块,将网页分成多个矩形,矩形大小也可以参照黄金分割进行设计,形成多个黄金矩形。其实这种方式运用十分广泛,借助黄金矩形,可以确认图片应该放在首页的什么位置,可以决定侧边栏或者网站底部的内容位置。发现目前很多网站在设计产品展示的时候,都会参考黄金矩形。
网页设计也有黄金比例?涨知识了!巧妙运用黄金比例,可以让我们设计出来的网站更具有视觉效果。但这并不是要求我们必须严苛遵循黄金比例来设计网站,还需要加上自己的一些“奇思妙算”,才能设计出更加与众不同,符合用户体验,符合市场需求的网页。


上一篇:适配还是不适配,设计移动端网站时必须要清楚

下一篇:没有了!

在线咨询

点击这里给我发消息 售前咨询专员

点击这里给我发消息 售后服务专员

在线咨询

免费通话

24小时免费咨询

请输入您的联系电话,座机请加区号

免费通话

微信扫一扫

微信联系
返回顶部