分割线的分类和使用规则

*界面设计中的分割线*

在UI界面中,分割线是页面重要组成元素。线元素可以对页面进行分割、编排或重新布局,起到对相似或者重复的信息有规律的分隔或者分割的作用。将视觉上或者内容上需要区分的内容用横向或者纵向的细线区分开来,帮助用户了解页面的层次结构。

常见的划分页面信息的线元素有三种类型:

1、通栏分割线 

2、两侧开口分割线

3、左侧开口分割线。

1、通栏分割线与两侧开口分割线

为什么要把这两种分割线放在一起说,是因为通栏分割线和两侧开口分割线在功能上几乎是一致的,目的都是为了让用户明确分辨出每段信息在何处终止;而通栏分割线的封闭式分割,将上下两块信息内容显得更为独立。左右两侧开口的分割线留出页面的边距,相比通栏的分割在视觉上更为轻量,让页面更加简洁干净。

2、左侧开口分割线

左侧开口,右侧闭合的分割线可以分为两种功能:

① 是对同一类别或者是同一组信息之间相关内容的分隔。

②  用来作为视觉线索,便于用户来浏览大量相关的内容,当用户浏览的时候,它们会作为路标而存在,便于用户快速的翻页浏览。

另外,需要注意的是运用不同粗细,深浅,数量的分割线对于用户在阅读页面时的造成的感受。仔细思考在什么情况下既能让用户专注于我们的页面内容不被分割线干扰,又能有效并且清晰的分辨页面信息层次结构。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容