网页设计都有什么表格 第1篇
关键字搜索
条件筛选
筛选按照触发方式可分为触发筛选和实时筛选，一般情况下，筛选条件存在交叉时使用触发筛选，不存在交叉时使实时筛选。但是在后台条件允许的情况下，发现型网站一般建议实时筛选，也可以根据筛选条件的数量选择合适的触发方式，比如条件少时用实时筛选，条件多时用触发筛选。
对于筛选条件有交叉的场景，建议采用展开形式，并手动触发刷新。对于筛选条件没有交叉的场景，当条件少于五个，采用tab切换;超过五个少于二十个，采用下拉选择;多于二十五个，为下拉选择添加模糊匹配，并且实时刷新。
其中，tab切换适合没有交集的内容，需要按照特定顺序分类，并保证分类覆盖所有情况，也不宜过多。对于需输入筛选条件的场景，如日期筛选条件，展示出来。下拉选择比tab占的空间小，但建议把重要项默认显示，下拉列表内也可以加入单选按钮或者复选框。表头筛选更节省空间，不过一次只能筛选一类条件。全部显示筛选项适用于输入项相对很少的情况。
提供自定义列
为了满足多个角色在不同情况下的业务需求，系统往往采取宁多勿少的原则尽可能提供详细的数据给用户，结果造成表格指标过多，难以在一个屏幕内展示完全，需要横向拉伸，降低了易读性。在这个问题上可以采用的方法是给默认表格提供通用的字段指标，然后用户可根据自身所需添加或调整系统所提供的其它字段指标，让弹性化的表格满足用户的个性化需求。
这样做首先可以让用户在表格上方看到所有的指标名称，避免了原来需要横向拖拽才能浏览到所有指标的情况;其次，用户可以根据自己的需要，自由选择所要显示的指标，隐藏不必要指标，减少干扰。有的表格除了自定义列，还允许自定义排序。
通过排序可以快速发掘出用户关注的信息，帮助用户发现信息条目之间的关系，提高关键条目的优先级。排序的列和不排序的列应该有明显区分，最好对某个重要列进行默认的排序。排序可以增加表格活力，一般有升序和降序两种方式。比较常见的是上下空心箭头表示默认，上箭头为升序，下箭头为降序。这种方式占空间较少，但认知有一定困难，且不适合排序方式较多的情况。排序方式较多时应采用下拉选择，因为这样信息展示最直接有效，且能减少反复操作的次数。
滚动与固定
随着行和列的增加，用户的瞬时记忆会达到极限，超过“7±2原则”的范围，用户需要依靠辅助信息去阅读表格内的数据，防止遗忘某列数据的意义。设计大数据量表格时，不得不通过拖拽横向或纵向滚动条来阅读数据，此时，固定表格的表头或行标题列，可以帮助用户在阅读过程中清晰知晓单元格数据的属性。
(1)表头固定
固定表头可以让用户明白当前单元格内信息的属性和含义，体现界面友好性。当数据列差异不大，用户不能直观的根据表格中的数据分辨出数据类型时，尤其需要固定顶部表头。当然，表头有操作时，固定表头更能提升使用效率。
(2)首列固定
呈现大型数据时，横向滚动无法避免。固定属性列(一般为第一列或前几列)更方便信息的对比。
(3)自定义固定列
作为高级功能，可以对列进行单独锁定，以便用户将数据与多个锚定标识符进行比较。
(4)固定表尾和底栏
固定表尾和底栏可以避免页面无数据时的空洞。
查看详情
精简表格之后如何查看隐藏起来的次要信息呢?
(1)展开行
展开行(Expandable rows)允许用户无需打开新页面即可查看附加信息，防止用户迷失。
(2)表格组节
表格组节(Table sections)把相关的行组合在一起，并且能够收缩和展开，各组节层级要有样式区别。如果有需要，在每个组节里可以显示数据概要。
(3)弹窗
包括模态弹窗和非模态弹窗，模态弹窗可以打开任一个条目进行详细查看，非模态弹窗可以同时打开多个，并允许拖动弹窗位置进行信息对比。
(4)表格内部侧边展开
相比弹窗减少了页面层级和隔离感。
(5)视图切换
可以通过视图切换查看更多细节，比如在“表格”和“左列表+右详情”之间切换，或者提供“只看文本，看文本和缩略图，只看缩略图”几种查看方式。
数据的选择
网页设计都有什么表格 第2篇
数据合适的位置排列能够提升数据的浏览效率和准确度。对齐能够很好的形成视觉引导线，会让表格更加规范易理解，给用户视觉上的统一感，视线流动更顺畅，让用户快速的捕捉到所需内容。
正如连续律所描述的，人们倾向于把那些经历最小变化或阻断的直线或圆滑曲线知觉为一个整体，倾向于使知觉对象的直线继续成为直线，使曲线继续成为曲线。在界面设计中，将元素进行对齐，既符合用户的认知特性，也能引导视觉流向，让用户更流畅地接收信息。
网页设计都有什么表格 第3篇
表格的构成
1、内部构成元素
内部构成元素包括标题、表头、表体、表尾等。标题是对表格信息内容的整体概括，可包含数据来源及属性(日期、地区等)，以便用户对表格内容有整体认知。表头一般指列标签，这里也指首列行标签，是对所属行或列信息的描述。表尾一般是统计信息，例如总计、平均数等。
2、外部相关元素
外部相关元素包括筛选区、按钮区、底栏等。筛选区包含模糊搜索和条件筛选。按钮区的按钮可分为增删改操作和业务处理操作。底栏一般放统计信息、分页等内容。
表格的基本布局
一般来说，表格有水平型、垂直型和矩阵型三种布局。水平布局会弱化列的存在，强调信息的连贯性，保证用户阅读信息时视觉流是从左到右的，然后自上而下逐条扫描，适合大量信息的浏览。垂直布局是在行分割的基础上，通过强化列的视觉特征来突出行间信息的对比。矩形布局的表格有均匀而明显的分割线，边框单元格比较明显，适用于列信息较多而没有足够空间用留白来分割信息时。