【问题标题】:Usability techniques for better form presentation用于更好的表单呈现的可用性技术
【发布时间】:2011-01-07 18:16:57
【问题描述】:

我正在尝试使用很多字段来简化表单(使用 ASP.NET MVC,但我想这可能无关紧要)。我最初的想法是将它分成标签,但后来我在某处读到这将是可用性地狱。此外,必填字段将在不同的选项卡之间拆分,因此验证将是一个挑战。有哪些方法可以很好地呈现表单,而不是一页长的字段?

【问题讨论】:

  • 将它们排成一行。
  • 或者把它们排成一圈。

标签: .net jquery html asp.net-mvc usability


【解决方案1】:

我认为关键是尊重用户的期望。

  • 标签有它们的位置,但我认为大多数用户的期望是您转到不同的标签来执行不同的任务,而不是需要转到多个标签来填写一个表单。

  • 向导方法可以很好地处理长表单,尤其是当您提供有关用户进度的反馈时。

  • 如果某些问题仅适用于其他问题的答案,那么隐藏有条件的问题直到它们相关为止肯定很好。

  • 有时可以将问题分散在用户与网站的交互过程中,而不是让他们一次性回答所有问题。

  • 最后,作为一名开发人员,我确实有责任为用户辩护,向客户建议他们可能不需要询问这么多信息。

【讨论】:

  • +1 表示“向客户建议他们可能不需要询问这么多信息。”
  • 感谢您的建议。我不得不选择@Jamie 的答案,因为这是在我的特定情况下最合适的解决方案。
【解决方案2】:

我个人认为显示“一长页字段”不仅是最有用的,也是呈现表单的最佳方式。

有一种说法是,用户更有可能填写一个分成多个页面的长表单,但是作为个人喜好,我喜欢看看我在做什么以及需要填写什么。

(根据我自己的多页表单经验,我通常会在中途退出,因为我无法估计填写表单需要多长时间,而且我还有其他需要做。)

我喜欢做的一件事是使用<fieldset> 分隔相关区域,然后对这些区域进行样式设置以提供干净清晰的表格。这使用户可以轻松查看他们需要填写哪些数据(分隔为逻辑字段集),并为开发人员提供了以使表单看起来不那么令人生畏的方式设置每个区域的样式的机会。

【讨论】:

    【解决方案3】:

    多个选项卡很好,但不是“提交”而是“下一步”,直到最后一个选项卡,你有“完成”。还要在表格顶部用“第 2 部分,共 5 部分”指明您所在的位置。

    实际上,您可以使用标签分散,但如果您可以返回并修复问题,那就太好了,所以如果不是标签,那么“上一个”和“下一个”按钮是必要的。

    只有标签,每个标签上都有一个提交按钮,而且必填字段到处都是非常烦人。 :) 这比拥有一个必须上下滚动的巨大表单更糟糕。

    【讨论】:

      【解决方案4】:

      我必须说我真的很喜欢StackOverflow Careers 上的表格,您可以在其中发布/编辑您的简历。这是一页很长的表格,但它不会成为问题,因为您总是知道自己在哪里以及该做什么。

      就个人而言,我更喜欢包含整个表单的单页。这样,您就可以快速查看表格以及完成表格所需的操作。

      【讨论】:

        【解决方案5】:

        听起来Accordion Forms 可以满足您的需求。

        基本上,表单不是将您的字段显示为向导或一系列选项卡,而是显示在一个页面上,但折叠部分会根据需要或用户单击“下一步”展开。

        案例展示了 Apple 对它们的使用。

        【讨论】:

          【解决方案6】:

          如果您使用类似向导的方法,那么最好在按下 Next 之后验证每一页,而不是在按下 Finish 之后验证最后一页。

          【讨论】:

            猜你喜欢
            • 1970-01-01
            • 2023-03-21
            • 2012-11-01
            • 1970-01-01
            • 2017-12-30
            • 2019-08-11
            • 2010-09-16
            • 1970-01-01
            • 2011-04-22
            相关资源
            最近更新 更多