表格设计全过程：这次给你讲的明明白白最近做了几个后台管理系统，表格在其中占据着不可或缺的地位。在此对于表格的设计做一个整理，如有考虑不周之处，欢迎留言，共同学习进步~ 表格：一种可视化的数据沟通模式，也是组织整理数据的一种手段，主要承载数据的展示、对比和归纳。一、设计原则 易读：表格应该是一目了然的，层级分明的。让用户的注意力集中在内容而不是表格的形式。 高效：表格页应该是可交互的，帮助用户更快来分类猎取信息以他们习惯的方式。 二、表格结构 下图展示的为最常见的表格，表格不仅可以包含数据还可以包含可视化元素，比如：图表。对于表格，最基本的元素就是表体，也就是数据部分。 容器：容器包含表格的所有内容。搜索/筛选区域：方便用户快速查询定位数据，一般位于表格上方。功能性按钮：一般位于表格上方，有时也可以位于表格下方。表头：起到对于数据内容的解释以及可以附加筛选排序等。表体：包含行和列数据以及一些操作（可选）。底栏：底栏包含数据量以及总页数和当前页数以及每页数据量和分页，底栏数据也可以放置在表格顶部。2.1 搜索/筛选区域 在表格设计中，一般搜索和筛选会同时出现，但是两者一般很少同时使用来对数据进行定位。搜索更多的是对单一或者包含某个字段的的数据来进行定位，有更高的精确度； 不同于搜索，筛选更多的是查询一类数据，可以和一些功能相配合使用（导出）。 根据搜索和筛选的属性，我们可以根据实际情况设计搜索和筛选的表现形式。 根据 MECE，我们可以归纳出以下的场景：常用搜索少用筛选，若筛选项多，可以选择隐藏筛选性，筛选少可以展示出来；搜索和筛选都常用，可以将搜索和筛选都展示出来；常用筛选少用搜索，筛选和搜索同时展示；筛选和搜索都不常用，展示搜索隐藏筛选。 搜索构成：标签，输入框，搜索按钮（可选）输入：通过输入特定的字段，来查询单一的数据，在表格中有导航的作用。查询范围：可以查询单个数据类型，也可以查询多个数据类型搜索结果：根据输入的搜索字段，可能存在空状态。对于搜索结果的排序，可以根据数据的匹配度或者生成时间等排序。 根据匹配方式，可以分为：精确搜索和模糊搜索。在大多数情况下，模糊搜索有利于减轻用户记忆负担，但是在同一个输入框搜索具有相似度很高的内容（比如手机号和 ID 都包含数字）时，建议对于该内容使用精确搜索或者分开两个输入框搜索。 根据搜索时效性，又可将搜索分为，实时搜索和点击搜索。...
