编辑到位与单独的编辑页面/模态?

Mat*_*ish 13 theory jquery user-experience modal-dialog inline-editing

我有一些分为几个部分的数据,很像StackOverflow Careers的Resume功能(虽然它不是恢复数据),它可以通过jQuery Web应用程序进行编辑/创建.它有点层次化(作业可以有子作业等),所以根据我采用的CRUD方法,它意味着不同的工作量.我不介意花时间去做正确的事,但我不想花很多时间做一些不是最佳用户体验的想象.

是否对"编辑"这种分段的分层文本数据的不同风格进行了任何研究:

  1. 在适当的位置编辑(例如,您单击一个表单元素,如作业标题,它变为可编辑,然后您单击"确定",它保存)

  2. 编辑按钮,将您带到新屏幕(如当前的StackOverflow)

  3. 弹出模态表单的编辑按钮

  4. 所有字段都是开放和可编辑的,单个保存按钮(如StackOverflow Careers)

是否应该使用这些不同的表格来提供最佳的用户体验?

Pat*_*Pat 12

这取决于.如果您的用户群是精通网络的,我建议使用编辑就地方法,因为它提供了自然的编辑流程.


编辑到位

编辑层次结构的一部分时,可以使用其余信息进行内联编辑.这使您可以检查您的修改如何适用于其他信息作为你让他们(而不必来回移动屏幕之间).

在可用性方面,分组项目可以一次编辑的场景很好,因为它可以节省多次点击.例如,如果作业具有以下数据项:

Title
Description
Positions
Run Code Online (Sandbox Code Playgroud)

最好提供一种机制来一次编辑所有项目以及编辑每个项目的位置行为.

内联编辑还可以保护层次结构的其他部分不会被意外更新.


模态编辑

这种编辑方法在整个层次结构和您正在编辑的部分之间引入了一个障碍(即,您正在进入的信息之间的关系以及它在层次结构中的位置在查看UI时不会立即显现出来).


新屏幕

与模态编辑一样,编辑信息与整个层次结构的关系也会丢失.但是,这是一个非常基本的设置,您的大多数用户群将立即理解.它还可以保护整个文档免遭意外更新.


所有领域都开放

这提供了将编辑的信息保持在上下文中的好处(与编辑就地一样)并且非常简单.没有学习曲线需要用户了解他们必须单击元素进行编辑.

然而,由于我的好奇孩子破坏了不止一种形式的人,我不喜欢它如何将整个层次结构暴露给非预期的更新.