网站建设
建站资讯Website News

您的位置:主页 > 营销知识 > 建站资讯 > 网页设计中设计师应该了解留白的一些事情

网页设计中设计师应该了解留白的一些事情

上海网站建设公司建站资讯2017-10-14

空白(或“负空间”)是页面之间和之间的空白空间。图形用户界面中的空格元素有:

  • 边缘,衬垫和沟槽

  • 围绕图像和图形对象的空间

  • 文本内容中的行间距和字母间距


虽然有些人可能认为空白浪费宝贵的屏幕遗产,但它是设计中的一个基本要素。事实上,空白与内容同样重要。正如广东话所说:

  • 空白被认为是一个活跃的元素,而不是被动的背景

所以良好的用户界面将适当的空格值从顶部到底部包含在所有页面元素中。页面上的空格可以与UI元素占用的空间重要,因为文本,按钮,徽标和其他对象需要呼吸的空间。


在这篇文章中,您将会发现如何在设计中使用空格来给它一个干净整洁的感觉:

提高文字阅读能力

空白通过减少浏览者一次看到的文字数量,能够使阅读更容易。缺乏空白(杂乱的页面)不会使用户想要阅读内容。另一方面,如德米特里·法耶耶夫(Dmitry Fadeyev)指出的,正确使用的空白已被证明可以将文本理解提高20%。

优化文本内容时要记住的两个重要事项是段落边距和行间距(文本中每行之间的间距)。后者可以大大提高文本体的可读性。通常,间距越大,用户在读取时将具有更好的体验(尽管线间距过大可能导致线路断开)。

 

澄清关系

整体布局由其部分和内容关系的总和产生,由周围的空白定义。接近定律表明彼此相近的物体似乎相似。在这种情况下,空白作为一个视觉提示。看看下面的图片:

blob.png

格式塔的法则规定,近邻物体将显示为一个“单位”; 白色空间充当视觉提示。

几乎每个看到这个图像的人都注意到两组圈子,而不是简单的12个圈子。圈子是完全相同的,它们之间的唯一区别是分隔它们的空格的数量。

通过减少它们之间的空间并增加它们与页面上的其他元素之间的空间,可以将项目组合在一起。

对于用户界面,这意味着邻近的对象将显示为一个“单位”。例如,在Web表单的上下文中,最好将标签放置在相关字段附近以创建对象。当标签放置在靠近字段时,这使得用户之间的关系变得非常清楚。

blob.png

当标签被放置得更接近与它们相关的领域时,信息被更清楚地传达。

 

引起注意

设计师可以使用空白来一目了然地交流最重要的内容。距离和注意之间有一种关系; 较大的距离迫使人注意 缺少其他元素只会使现有元素更加突出。可以使用空格来获取您的优势 - 将漂泊的眼睛吸引到某些页面元素上。特定内容部分的额外填充会迫使用户注意到该区域,因为屏幕上没有任何其他内容可以引起注意。因此,一个物体周围的空白越多,眼睛被吸引越多。

blob.png

创建视觉层次结构

当适当地使用空格时,它允许页面创建一般的流程和平衡,这又有助于传达设计的意图。空白可以支持整体层次。它产生对称或不对称。

对称创造记忆与和谐:

blob.png

Mailchimp,你可以看到,是他们的设计中白色空间的主要提倡者。当访问者扫描主页时,“免费注册”按钮几乎立即吸引了他们的注意。 使用对称性可以创建平衡的布局,同样重要的左右部分。

不对称引起注意:

blob.png

不对称非常适合将注意力引到页面的特定区域。

blob.png

当一个元素使用不对称的空间时,它与其他周边的元素脱颖而出。

 

空白空间不是浪费的空间,它是一个强大的设计工具。它可以像图像,文本或其他用户界面对象占据的空间一样重要,因为即使空白空间用于目的并支持布局的视觉完整性。

虽然这似乎是一个简单的话题,但空白空间可能难以掌握,因为空白的应用是艺术和科学。真正了解应该用多少空白来创造良好的布局需要练习。

原文标题:网页设计中设计师应该了解留白的一些事情
欢迎您访问,如有疑问请联系客服
TAG,上海网站建设,上海网站制作,上海APP开发

最新案例

相关文章

更多最新文章

网站关键词

上海云轩网络版权所有 Copyright©2008-2018 http://www.lvon8.com All Rights Reserved 备案号:沪ICP备14049216号