1. 首页
  2. 网站设计
  3. 正文

如何在网站设计中使用空白来改善用户体验

  空白(或“负空间”)是页面元素之间和周围的空白区域。尽管许多人可能认为它浪费了宝贵的屏幕空间,但空白是设计中必不可少的元素。

  “空白应被视为一种主动元素,而不是被动背景”

  在本文中,光龙网络将分享五个技巧,说明如何在设计中使用空白可以带来更好的用户体验。

  1.   强调某些元素
  2.   澄清对象之间的关系
  3.   提高可读性
  4.   在不使用可见分隔符的情况下划分元素
  5.   营造优雅的感觉

  1.强调某些元素

  优先考虑特定内容或交互元素对于设计师来说是相当常见的任务。当设计人员制作页面时,他们通常希望将用户的注意力引向主要对象(例如内容部分或号召性用语按钮)。虽然设计师可以使用许多不同的视觉方法来聚焦特定对象,但实现此目标的最有效方法之一是使用该对象周围的空白量。

  您可以使用一个简单的技巧来实现该目标——移除对象周围的所有元素。特定区域中其他元素的缺乏使该区域中的现有元素更加突出。用户的注意力会转移到有物体的区域,因为在该区域没有其他东西可看。

  物体周围的空白越多,人们就越会被它吸引。


  看看谷歌搜索主页。一旦您登陆此页面,您的注意力就会放在搜索表单上。它是使表单弹出的空白。

  当人们访问谷歌搜索主页时,他们的目光会立即被页面的中心——谷歌的搜索表单所吸引。

  2. 明确对象之间的关系

  当我们检查一个新的布局时,我们很少将其视为独立元素的集合。我们通常看到的是对象的组合。这是因为我们的大脑天生就可以创建不同对象之间的关系模型。最常见的关系是基于对象之间的相对距离创建的。认知心理学中有一种称为格式塔原则的理论,它规定彼此靠近的对象将表现为一个“单元”。

  看看这张照片:


  您很可能会看到两组圆圈(4 和 6),而不是 10 个圆圈。这些圆圈都是相同的,唯一区别它们的是分隔它们的空格数量。

  这条定律几乎可以应用于图形和交互设计的任何部分。让我们看看它在数字表单的上下文中是如何工作的。大多数用户发现长表格势不可挡。当用户看到一个包含太多问题的长表单时,他们需要花费额外的时间来了解需要哪些信息。但是设计人员可以通过使用空格将相关字段组合在一起来简化用户的任务。这样一个简单的过程可以极大地提高表单的理解能力——用户将花费更少的时间来分析他们需要哪些数据输入。

  检查下面的示例。两种表格的问题数量相同,但右侧的表格给用户留下了更好的印象——空白使扫描表格更容易。


  如果您设计的表单有七个以上的问题,最好将相关问题分组到逻辑部分中。使用空格分隔逻辑部分。

  3.提高可读性

  内容为王。内容是人们首先访问您的网站或安装您的应用程序的原因。这就是为什么考虑内容的可读性如此重要的原因。很多因素都会影响可读性——字体大小、字体粗细、颜色对比度等等。但是还有另一个对内容可读性有直接影响的重要因素——空白。

  行距(段落中每一行之间的间距)可以极大地提高文本内容的易读性和可读性。当行距太紧时,人们阅读文本变得更加困难。一般来说,导言越大,读者在阅读时的体验就越好。


  如果您比较从左右示例中阅读文本的体验,很明显,适当的间距有助于可读性。图片来源:苹果

  段落之间和文本块周围的空白量在内容理解中也起着重要作用。一项研究发现,在段落之间正确使用空格可以提高近 20% 的理解力。

  4.在不使用可见分隔符的情况下划分元素

  设计人员经常使用可见线来分隔页面上的部分或单个组件。虽然这种方法在大多数情况下都能正常工作,但它有一个主要缺点——可见的分隔线增加了额外的视觉重量。太多可见的分隔线会使整体设计感觉很重。

  可以按元素和间距而不是线条来划分。更少的线条和其他可见的分隔线总是会给您的界面带来更干净的感觉。


  使用不同大小的元素有效地创建了视觉层次结构。

  5.营造优雅的感觉

  我们上面回顾的所有示例都有一个共同点——它们描述了如何使用空格来提高产品的可用性。但是空白也可以用于纯粹的审美目的。具有大量空白的布局可能会传达一种奢华感。许多奢侈品牌使用空白作为主要工具,将他们销售的产品置于聚光灯下。


  劳力士网站使用空白将用户注意力引向他们希望访问者看到的产品。

  结论

  空白是一个强大的设计工具;大方的空白可以使几乎任何类型的布局都变得简单而吸引人。但与任何其他设计工具类似,空白可能很难掌握。掌握空白需要练习。

    延伸阅读

  • 网站设计细节注意,做对搜索引擎友好的页面

    我们知道网站页面设计直接影响到其是否能够对搜索引擎足够友好,进而会对网站的排名以及优化难度带来影响。网站页面的结构必须足够清晰网站页面结构是否清晰决定着用户是否能够在进入网站的...

  • 网站设计制作注意事项科普!

    很多企业之所以要进行建站,就是为了能够多开辟一条通道,让更多的用户了解到自己的企业,也希望能够通过网络促成更多的订单。那么,在建站的过程当中,肯定是离不开网站设计制作的。在具体...

  • 企业网站设计制作首页需要安排哪些内容?

    网站首页是用户进入网站后看到第一个页面,是企业网站的门面,好的首页能给网站访问者留下好的感官印象、起到清晰的导航作用、能够体现和突出网站主题、充分获得用户对网站和企业的信任度。...

  • 企业网站设计基本优化要素

    网站优化设计的核心是要重视网站访客的访问便捷性等用户体验要素,具体包括网站结构、网站内容、网站功能和网站能够提供的服务,尤其是网站的结构和网站内容更重要,网站优化的核心是“内容...

  • 莆田网站设计

    随着互联网的快速发展,网站已经成为了企业在网络上展示信息、推广产品和服务的重要途径。一个好的网站设计可以提升用户体验,增加用户粘性,从而为企业带来更多的机会和收益。1.概述莆田...

本文来自投稿,不代表本人立场,如若转载,请注明出处:http://www.lnbdc.com/article/6612.html

(function(){ var src = (document.location.protocol == "http:") ? "http://js.passport.qihucdn.com/11.0.1.js?1d7dde81dc0903e04d3ac0b9599444f6":"https://jspassport.ssl.qhimg.com/11.0.1.js?1d7dde81dc0903e04d3ac0b9599444f6"; document.write('<\/mip-script>'); })(); (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })();