网站设计中如何利用好空白

许多网站设计师设计过于复杂和丰富多彩的网页犯了一个大错误。如果它不是故意的,你应该避免创建复杂的内容并使用更多的空白空间。空间是网页设计的基本方法,因为它可以为页面上的所有元素带来很多不同。在这篇文章中,我们阐明了空白空间的重要性,并分享了如何在网页设计中正确使用它的技巧。

什么是空白空间?

在我们开始之前,让我们首先确定空白空间是什么。负空间或空白区域表示网页上未使用的空间。在页面上没有引起用户注意的任何东西都是空白空间。这并不意味着空间必须是白色的:它可以是任何颜色,图像或任何其他背景。

“ 白色空间应被视为一个活跃的元素,而不是被动的背景。“ – Jan Tschichold

空白空间有两个层次:微观和宏观。微空白空间与线条,单词和字母等小元素之间的空间有关,而宏空白空间则是较大块或元素之间的空间。这两个级别对于网页设计的整体有效性都很重要。

让我们看一下使用空白空间的以下网页设计。

苹果

Apple一直非常注重设计,而他们自己的网站也不例外。只要看看他们如何巧妙地使用微观和宏观空白空间。该网站布局整洁,行动呼吁极为明确(CTA)。

您的注意力集中在核心功能,产品本身,而且没有任何东西会分散您对此页面的注意力。在页面中央查看单个对象是吸引用户注意力的完美方式。

Apple iPad主页负空间布局

谷歌

谷歌可能是网络空白空间的祖师。搜索巨头使用了大量的空白空间和干净的设计来引起我们对搜索栏本身的注意。

Google只会引导用户访问页面中最具操作性的区域,即Gmail,图片和搜索栏。设计清晰简洁,避免混淆。

Apple iPad主页负空间布局

Dropbox的

Dropbox主页结合了完美的微观和宏观空白空间,自然的调色板和和谐的字体,营造出平静的氛围,提供流畅的用户体验。由于正面使用空白空间,网站看起来很复杂,这反过来又创造了简洁和清洁。

Apple iPad主页负空间布局

您可以看到空白空间确实允许您的设计室呼吸。现在让我们转到有关如何在您的网站上以正确方式使用此空白空间的提示。

如何使用空白空间权利

1.使用负空格来分解页面

打破网页上的空间是设计中最重要的可视组件之一。当网站信息太多,空间太小时,访问者很难专注于主要信息。

空白空间使用户有时间吸收他们在页面上看到的信息。有一些规则可以帮助设计人员在页面上创建对称组合,并确保人们可以感知信息。组合的组件之间的相等空间设置了适当的设计结构,并帮助用户清楚地感知信息。根据网页设计的组成规则,这些微块之间的空间应占宏块之间空间的三分之一。

Apple iPad主页负空间布局
Breaks在页面上设置结构和语义重点。

2.致力于内容理解

内容可读性和易读性是网页设计中非常重要的一个方面。空白空间可以优化它们。在线条,单词和字母之间适当使用的空间可以多次增加阅读理解。

在优化内容理解时,段落边距和行间距是要记住的两个主要事项。每行之间的间距或简单的行间距增加了正文文本的整体易读性,如以下示例所示:

Apple iPad主页负空间布局

3.创建可视层次结构

空白空间不仅仅是页面元素之间的空白空间,而且是构建视觉层次结构的基本工具。空白空间可以组成或分离UI元素,以便创建有效的页面设计。

它提供了一个温馨的布局,使访问者在页面上的访问时间更长。此外,空白空间也会引起用户对重要元素的注意,并为眼睛提供休息。

澄清关系

格式塔心理学家在学习人们如何组织视觉信息的同时,制定了“邻近法则”。该法律规定,所有彼此相邻的视觉对象看起来与人眼相似。

Apple iPad主页负空间布局

在网页设计中,适当的空白距是实现接近原则并使设计更具视觉吸引力的有效方式。例如,这个原则适用于博客架构。通过将大量文本和谐地分成段落和块,设计师可以实现更易消化和愉快的布局。

<image>ещененашла,думаламожетпримернашегоблогапривести

最后总结

如您所见,空白空间是网页设计中最强大的工具之一。通过遵循本文中给出的一些简单规则,设计师可以创建一个完美的视觉吸引力设计,任何访问者都会欣赏。

原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/263044.html

(0)
上一篇 2022年5月28日
下一篇 2022年5月28日

相关推荐

发表回复

登录后才能评论