布局是支持界面可视组件的结构。它的工作是打开视野，使视线可以分组，优先化和理解信息。它还可以帮助内容突出显示网站上最重要的数据。因此，布局功能对用户不可见，但与导航有关。

良好的布局设计与目标相关，反映在良好的用户体验中。这就是为什么我们可以说正确的布局可以使用户快速找到所需的内容。这也体现在更多的任务完成和更多的现场时间（参与度）上。

适当应用的间距有助于集中内容，减少干扰并提高页面扫描能力，还定义类别并为用户的心理过程赋予逻辑含义。通过使用富有创意的动态布局进行开发，您将获得可用且美观的UI设计。

要创建布局，我们必须了解邻近和负空间的原理，这在《界面设计的层次基础》一文中已有解释。在这项研究中，我们将提供七种资源，用于专业创建站立式布局。

尺寸

大小层次结构便于用户做出决定。大小是告知用户网站中重要内容的最清晰方法，这就是为什么首页布局通常具有分层的信息块的原因。

当前的传统导航方案可以分为两种类型，导航页面和消费者页面。通常，当用户进入网站的主页时，他们具有导航功能，可以发现内容或搜索特定内容。这就是创建层次结构块的原因，该层次结构块充当所有界面内容的门。

另一方面，当用户找到要查找的内容并单击一个块时，他们现在需要的是使用内容，从而使层次结构在此页面中的相关性降低。在这种情况下，最实用，最友好的设计是以平衡的方式显示信息，以促进视觉的自然阅读。一切都与每个页面的目标有关。

视觉之旅

意识到视觉之旅，您可以操纵它。沿着建议的路径引导视图比强制扫描项目要友好得多，因此必须在设计中知道视觉旅程。

以错误的观念开始设计是非常普遍的，所有的要素都必须引起人们的注意，但是没有优先顺序的设计会导致缺乏清晰度和沟通中的噪音。尽管很难做出这些决定，尤其是在诸如智能手机屏幕之类的狭小空间中，但考虑以下因素可以简化此过程：

了解信息，了解内容的含义，页面的目标以及要包含的元素。

自觉地绘制内容，创建布局，并根据已建立的优先级顺序开始制作替代版本。

时常验证视觉旅程，因为以“新眼睛”回到设计是识别更好机会以改善布局和视觉路径的好方法。

不对称

不对称的布局表现出更多的动感和动感。由于组成和平衡的规律，不对称往往在眼睛上更明显地表达出来，它促进了元素的层次化并为其提供了运动。

主要思想是使接口元素平衡，使得一个部分的重量不超过另一部分，但又不像对称设计那样严格地显而易见。这迫使我们在布局中定义层次结构，并以更具创意和站立感的方式处理诸如文本，图标，图像，空间和颜色之类的元素。

不对称构图的视觉历程从主要元素到次要元素，表达了它们之间的某种张力以及取决于设计风格和形式的多种情感。在这种情况下，用适当的负空间包围元素非常重要。简而言之，可以说不对称是一种隐藏的对称，这在头脑中更为有趣。

空间

正确的间距定义布局。由于布局是通过元素之间的间隔或负空间来证明的，因此其形式取决于某些元素比其他元素更接近多少。

这些空间包含合成，并以在它们之间创建关联的方式连接或断开元素。主要视觉关联由布局确定，因此必须从一开始就为此目的进行设计。我们还应该牢记，一个元素与另一个元素之间的距离必须反映出用户在关联和无关方面的想法，并且将一组元素隔离开可以提供更多的可读性和重要性。UI设计布局最终是一个空间组织。

打破

打破传统方案会引起用户的注意。形式的重复往往会限制思想，因此方案的更改总是引起用户的注意，并让他等待更多的信息。

完全专注于吸引注意力，同一方案的更改与重复和对齐的视觉定律相关联，在该定律中，属于一个组并且打破其异化或其他特征的任何元素将更加醒目和有趣。

设计基本功能布局的许多次降低了设计师的好奇心，他们发现了使信息阅读更有趣的新方法。但是，保持用户的注意力并使体验令人兴奋与移动，缩放，混乱和违反某些规则有很大关系。平常舒适，但创新却令人难忘。

叠合

一个元素与另一个元素重叠会产生深度。尽管布局位于二维世界中，但将一个元素放置在另一个元素上以扩大其深度可以使构图具有真实感。

在用户界面设计中使用叠加可以使用户感觉到屏幕上存在一个真实的舞台。使用不同的图层表明设计继续进行，并延伸到空间中，不仅感觉更逼真和吸引人，而且在视觉上也更加有趣。重叠文本时最重要的规则之一是与背景的对比度应足够大，以避免出现可读性问题。如果视线不能流利地识别角色，则体验将充满压力。

格网

网格的使用在数学上令人赏心悦目。尽管在设计中不可见，但网格有助于元素的位置，创建比例分布并为界面提供高度一致性。

设计正确的间距是一个真正的挑战，但是在整个UI流程中保持此间距的一致性甚至更具挑战性。网格是为此的标准解决方案。它包含元素的方式将给出精确的比例，但是我们必须记住，布局可能会发生很大变化，具体取决于设计师的风格以及他希望如何显示信息。系统实践是掌握网格使用的最佳方法。

总而言之，尽管可以使用多种布局和方式来分发信息，但是最重要的规则是保持信息的简单性。绝大多数用户不是通过设计进入界面，而是通过设计中包含的信息。毕竟，复杂的结构很难理解。

能够将美学原理与认知过程的科学相结合并不是一件容易的事，但正确使用两者对于专业UI设计至关重要。如果我们要处理一个新项目，请记住要给自己提供必要的创作自由，但要始终基于用户认可并证明有效的结构。