佛山家具目录的参数在桌面上适合对照,到了手机却可能挤成细字。先弄清客户是在比较多个对象的同一字段,还是阅读一个对象的完整信息,再决定保留表格、局部滚动或改成卡片。版式变化后,型号、字段、单位和未确认项不能失去对应关系。

同一批字段,两个阅读动作

按照阅读任务选择
任务表格候选卡片候选
横向看同一字段差别字段对齐便于逐列比对需有清晰的重复字段标签
读单件完整信息单行过宽时阅读成本上升可按单件顺序组织
手机容纳宽数据可考虑局部滚动并保留语义不应因空间小就删掉条件
复制或交接资料需保留表头、单位和对象关系需确认复制后仍能识别每个字段

小屏改变布局,先保护关系

W3C表格教程强调数据单元与表头关系,响应式调整也要保留这种关系。局部滚动可以是方案之一,但必须让人知道区域可操作并在实际环境核对。把表头挪走只留一列数字,或者靠视觉位置猜字段,都容易让读者误认对象。

1定任务比较同一字段,还是逐件理解。
2保关系确认对象、字段和条件对应。
3做小屏按选定方式处理宽度与操作。
4查一致确保不同显示下仍是同一份资料。
版式评审顺序

给设计与开发同一份验收矩阵

原创验收矩阵,不是已完成测试
检查项表格要核对卡片要核对
内容完整列未被静默隐藏字段未因省空间遗漏
对象明确行与列的身份可识别每张卡有明确对象
未知信息保留待确认含义不能将空字段自动隐藏成已知
字号与放大按项目最低字号要求及放大阅读复测同样复测,不能只看默认比例
  • 在小屏逐个读出一个对象的全部字段,检查是否误串。
  • 选择一个字段比较不同对象,记录操作是否清楚。
  • 用键盘和适合的辅助工具检查真实语义,不只看截图。
  • 切换筛选或型号后再检查标题、参数和图片一致性。
卡片天然比表格更适合手机吗?

不一定。任务若依赖跨对象对照,大量卡片也可能增加来回寻找;应让代表读者完成同一任务再比较。