网站设计系列｜如何在网站设计中有效的运用留白效果：4大秘诀分享
在2020年8个网站设计趋势中，我们提到留白已经成为一种广泛的应用手法。
我们常常认为安静、空的、无色的东西是无趣的，却鲜少人了解到正因为这些空白的存在，才会成为有声、有物、有色的对比基础。唯有安静才让我们了解到声音的重要性，唯有空白的空间才让我们知道要如何填补这些所谓的空白。在网站设计中，很多人喜欢把网站摆得满满满，认为任何多余的留白都是浪费的，应该要让大家看到越多内容越好。但事实上，留白是一种非常强大的视觉设计技巧，能大幅增加网站设计的质感，以用户的观感来说，有时适当的留白甚至与提供好的内容同样重要。
什么是留白？
留白通常在英文中也被称为Negative Space，直翻为「负空间」。
字体里的每一笔一画，或是网站上的每一个形状、每一个内容，都可被称为「正空间」，而「负空间」则是在文字的间隙、网页的留白处等这些不引人注意的部分。
为什么要留白？
Interaction Design Foundation的Mads Soegaard说：
「空白的空间就很像一个画布。空白是设计中能将所有元素拢在一起的背景，让他们能够凸显出来。」
空白的作用就好比是演奏一首曲子中的顿音一样，短的顿音，让听众在旋律间有喘息的空间。而长的停顿，则是令人不禁屏住呼吸，情绪在此刻被定格、延续，而在下一个音响起之时，整个情绪涌现。留白也有一样的效果，它是将整个设计绑在一起的重要元素，帮助形塑了整个页面的流程。
在设计中善用留白的手法，可以做到下面这些事：
- 增加页面的阅读性
- 加强视觉设计的层次效果
- 让不同元素间的连结清晰可见，不用再使用额外的「箭头」、「框框」或「表单」等元素去表示
- 为整个页面提供喘息的空间，使页面不会感觉过于拥挤
- 让用户注意到最重要的元素，降低画面中的干扰
- 让整个网页更有风格并增添了优雅的气息
如何有效地运用留白？
1. 适当的选择留白空间
正确使用网站设计中的留白效果可以提升文字阅读性20%！文字间的留白应该要反映出用户在阅读时需要的停顿，像是给眼睛的视觉喘息空间。过于拥挤的文字会造成阅读的障碍，而过于分散的文字则会造成段落间的不连贯性。所以适当选择正确的留白空间是非常重要的。
2. 调整内容间的距离
除了选择文字与文字间适当的留白空间，还要确保不同资讯间彼此的留白距离。根据接近定律的解释，人类眼睛会将放置在一起的物件认为是互相有关联的，而较远的物件则会认为是不同的。
而内容之间的留白空间也会扮演著重要的视觉提示作用（Visual Cues），可以让用户了解内容中不同元素间的互相关系。你可以增加物件中的留白来区分不同的内容，或是删减物件中的留白来将物件归纳一起。
而对于文字来说，可以使用段落来将同一个概念区分不同的小节。而在制作表单的时候，也不要忘记套用接近定律，把说明的文字放在相近的位置。
3. 创造焦点
一个拥挤的介面会降低用户的阅读意愿，不知道究竟哪里才是重点，而在众多的干扰讯息中失焦。你可以把最重要的地方用附近留白的方式圈起来，留白的地方越多，用户越会注意到。
所以如果你想要著重于一段文字上，或许你可以使用一个非常大而醒目的标题，将附近的空白加大，字与字之间的空格也拉大，这样会破坏本来内容间的连续性而抓住用户目光。
4. 留白不一定是白色！
虽然称之为「留白」，但是不一定要是「白色」的，可以是任何颜色的空白，或甚至是有条纹、纹路的背景图。
比如说Prada的页面中，虽然不是白色，而是采用蓝色的空白背景图，但是也能够创造出同样的效果，让大家的目光集中在最重要的品牌标志以及倒数计时器上面。
准备好制作属于自己的网站却不知如何开始吗？哈利熊为大家整理了网站设计的八个简单步骤，设计出最强的网站！
推荐文章：