理想的网页既实用又和谐，但是即使是最老练的网页设计师也很难告诉您是什么让设计自然流畅。 尽管存在色彩和导航理论，但有时完美网页美感的最关键方面似乎无法言喻。 我们不知道它为什么起作用，但有时它确实起作用。 可能全部是因为有一个简单的概念。
通过以字面上自然的顺序支撑您网站的设计，观众可能会发现您的设计更有趣，天生令人愉悦。 这个概念称为黄金分割率 ，这是自然界遵循的数学概念，我们人类下意识地认为这是完美的表达。
黄金什么？
简而言之，黄金比例（也称为神圣比例或黄金均值 ）是在自然和艺术品中反复出现的数学常数。
表示为方程，当一个大于b中，（a + b）大 的分割等于除以b（只是看图像的下方），它约等于1.618033987。 该数字通常由希腊字母“ phi”表示，是黄金分割率 。
可以使用相同的理论来构造一个称为黄金矩形的矩形 。 可以将遵循黄金分割率的图像整齐地放置在一个遵循黄金分割率的矩形内。
要构造一个金色矩形，请选择一个数字，该数字将是矩形短边的长度。 为了论证，假设500像素。 乘以1.618。 结果为809像素，即矩形的长边的长度。 因此，500像素乘809像素的矩形是金色矩形。 它遵守黄金分割率。
自然美
实际上，科学家们不确定人类如此喜欢的比例是多少。 他们确定的是我们有多喜欢它。 研究表明 ，即使对图像进行微小的更改，使其更接近黄金分割率，对观看者的大脑也会产生很大的影响。
人脸也遵循该比例，并且我们发现脸部比例更真实的人更具吸引力。 贝壳，文艺复兴时期的经典杰作，上古时期的建筑，甚至人体部位，都根据手指本身的比例进行分配 。
我们内心深处的某些事物将黄金分割率表述为美丽，这是艺术家和建筑师已经使用了数千年的事实，无论是否有知。 它是图像中的主要语言。 结果是有机的，直观的，并且感觉不错。
神的组成
然后，如何在网页的构成中使用该幻数？ 数学可能看起来像一个令人窒息的盒子，您的创造力将在其中挣扎，但是黄金分割率只是一个有用的指导。 有了基本的指导方针，最终可以通过消除比例和位置的某些猜测来为您提供更多的创作空间。
可以将其视为工具而不是笼子。 最基本的说，您可以使用黄金比例来指定内容区域和侧边栏的大小和位置。 固定宽度的布局是最简单的应用程序。 通过创建金色矩形的方法确定布局的整体大小。
对于网格/块
由a线创建的正方形将是您的内容块。 较小的矩形将是侧面或导航栏。 一旦确定了矩形的大小，就可以轻松算出导航栏的宽度。
- 对于此示例，我们将说您的矩形为525 x 850像素。
- 525是a而850是（a + b） ，并且b将是边栏的宽度。
- 要找到b ，我们只需从（a + b）中减去325即可。
- 因此，边栏的宽度为325。
请记住，可以根据自己的目的翻转矩形，将边栏放在顶部，底部或相反侧。 只要比例保持不变，您的设计就会感到和谐。
对于文字
有一种更快的方法来获取所需的测量值，并且可以与文本内容一起应用。
- 假设您的上下文文本为12号。
- 将12乘以黄金比率1.618 ，您将得到19.416。
- 标头文本大小为19或20将紧随黄金比例。
黄金分割是您的大脑理解的一种语言，通过与之沟通，您的想法将更有效地传播。 您不必完全遵守它； 基本原理就足够了。 将比例应用于图像大小，文本和图像位置之间的关系以及在侧边栏中创建细分都是可能的概念。
网格工作：三分法则
如果数学不是您的最佳选择，则可以简化黄金分割率的概念。 三分法则控制场景中兴趣点的放置。 将任何给定图像水平和垂直分成三份。 您将获得9个网格。
根据三分法则，这些线的顶点（线交叉处）是关注点的理想放置。 扫描页面的人更有可能注意到放置在这些点附近的事物，并且该分区很容易查看。 通过将三分之二分解为三分之二，可以实现更复杂的设计。
简而言之，眼睛可以懒惰，不必搜索重要的细节。 我们的大脑是这样的。 主要图像，新闻框，搜索栏和其他任何兴趣点都可以位于顶点上或顶点附近。 这个简洁的小捷径将为您提供一个既易于使用又使人们被关键数据吸引的设计。
列和字体大小：斐波那契数列
与黄金比例有关的另一个简单的网页设计工具是斐波纳契数 。 斐波那契数列以0和1开头。将前两个数字加在一起以生成序列中的下一个数字： 0、1、1、2、3、5、8、13、21、34等。
一点数学运算就告诉我们，顺序斐波那契序列号之间的关系惊人地接近黄金分割率–将序列中的任何数字除以该序列号之前的数字，您会得出–您猜对了– 1.618 。
与黄金比例一样，斐波那契数字可用于指示标题和内容文本大小之间的关系。 它也可以用来指定列的宽度，在博客和其他文本密集的布局中特别有效。 合成也可以建立在斐波那契平铺的概念上，其中，使用斐波那契序列来建立图块大小。
黄金螺旋与内容聚类
同时使用黄金比率和斐波那契数的另一种可能的方法是黄金螺旋和斐波那契螺旋 。 黄金螺旋每转四分之一圈变宽等于黄金比率，并且斐波那契螺旋使用斐波那契平铺形成。
螺旋已经在艺术品中使用了很长时间，只要数字和比例本身即可。 从理论上讲，负空间和感兴趣的视觉区域应适合螺旋形。 在这种优美的布局中，就像三分法一样，眼睛自然会被吸引到螺旋的中心以寻找细节。
螺旋可以用作内容密度和聚类的指南。 它们可以作为网站标题图像，搜索栏和工具栏比例的基础。
当为基于大型图形的首页（例如商店首页和摄影网站）选择理想的图像时，您也可以从金色和斐波那契螺旋图中受益。
强大的信息通常是潜意识的，黄金分割率是自然界最多产的潜意识广告之一。 通过利用神圣的比例，您可以给自己一个自然逻辑和有机恩典的优势，这是所有人类都有的潜意识吸引力。 黄金分割率是您可以自由使用的另一个工具。
更多阅读：
编者注：这篇文章由Chris Pentago为Hongkiat.com撰写。 克里斯（Chris）是一位经验丰富的Web开发人员，设计师和互联网营销商，对使您的在线业务表现出色的关键技术感兴趣。您可以在Twitter上找到他。
翻译自: https://www.hongkiat.com/blog/golden-ratio-in-moden-designs/
133
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
