论坛

标题: 6.2网页交互设计（中）里面黄金分割的算法疑问 [打印本页]

作者: 晓丽 时间: 2016-1-28 11:43
标题: 6.2网页交互设计（中）里面黄金分割的算法疑问

请教大神们，教程7-10分钟的样子，老师在计算三个板块间距的时候用了黄金分割的计算方法 1：0.618
三个块每个块占两格（每格100px）一个块也就是200px 然后开始计算总间隔有100px 平分的话一个就是30px 间隔留15px 就是70px 三个再平分然后才给每个块加了22px
so 问题来了：
1.间隔空白有100px 三个平分的话不应该是100px/3=33.33px吗？老师怎么说平分后一个就是30px呢？
2.后面间隔留15px是为什么？为什么要留15px，15px如何得来的？再得出100px-15px*2=70px 再把70px平分给三个块所以每个块给加了22px

作者: 潜意式 时间: 2016-1-28 18:34
这个的主要意思是，网页布局遵循黄金分割的法则，会让页面美观度看起来更好。我们在计算的时候，肯定是以整数来计算比较好，如果分割像素出现0.333这样的数据，会给我们增加很多工作量，并且实际影响不大，因此，先约等于是30。我们的目的是为了确定下面三个块的宽度。首先分200给每个块，剩下的间隔就有一百多，肯定太宽，还需要分。然后我们反推，如果间距是15像素，那么两个间距就是30，剩下70划分给三个块，约23.33~一般用到偶数，所以每个块分到22比较合适。当然，这里几个像素的差并不需要非常精确，你说色块部分多一两个像素，间距少一两个像素，对整体视觉的影响不大，无需深究。这里是一个快速布局网页的方法，艺术始终不是科技，没有那么多精准的数据。

作者: 晓丽 时间: 2016-2-2 11:31

果然是大神，你一说我感觉懂了90%，有一点还不是很清晰，在反推的时候你是直接假设的间距是15px，这个值是根据你平常的经验来的吗？你怎么知道间距有15px 这个间距看起来就会很合适呢？那是否我可以假设间距是20px或者30px呢？这样子反推的话最终的结果就相差还是有点大的

作者: 晓丽 时间: 2016-2-2 11:33

潜意式发表于 2016-1-28 18:34
这个的主要意思是，网页布局遵循黄金分割的法则，会让页面美观度看起来更好。我们在计算的时候，肯定是以整 ...

作者: 潜意式 时间: 2016-2-2 18:00
这个数据不是固定的，有些页面做得松的，大点无所谓，有些页面需要紧凑些，间距自然也就小一些。平时多搜集一些优秀页面，看看其他优秀设计师是如何控制间距的，出来的效果有什么不同等。

欢迎光临论坛 (http://bbs.qinxue.com/)