在Web和桌面应用程序之间构建UI的差异

Question

Web应用程序的UI构建方式与桌面应用程序的UI不同。我很想知道在以下几个方面在两种应用程序样式之间构建UI的主要区别是什么：

1.使用技术

2.技术使用

3.使用的控件

4.屏幕变化行为

Answer 1

在网页设计中你不能忽视的一件重要事情是后退按钮。成千上万的人试图禁用或绕过它。不要试图绕过后退按钮！而是将后退按钮作为设计的一部分。

Answer 2

很多人忽视的一个很大的设计差异是窗户本身的结构。

• 桌面应用程序倾向于构建为最小高度＆amp;宽度分辨率（通常为800 * 600），并尝试尽可能地将所有相关信息拟合到小于该值的大小，因为滚动条对于非表格/列表数据通常是非常糟糕的做法。如果需要更多空间，通常会将信息拆分为新窗口或子窗口窗格/标签。
• 另一方面，Web应用程序具有基本上无限的垂直高度，因为大多数人习惯于在其Web浏览器中滚动。滚动条不再是坏事;事实上，使用滚动条任何地方可以使用主要的一个通常被认为是不好的形式（当然有一些例外）。信息通常在一个“窗口”中描绘，因为拆分它需要单独的页面加载，并重新加载相同的数据（样式，菜单等等。是的，有一个缓存，但它没有加载单个的快页）。更多的负载总是更慢，并导致不连续的感觉。有时候它们是不可避免的，但你几乎不应该只将应用程序限制在浏览器窗口的可见大小。
• 很多人使用网络浏览器阅读。新闻，博客，YouTube上的评论等等。当你制作一个网络应用程序时，它应该反映这种习惯，因为如果他们在网页和你的应用程序之间切换，你将会通过截然不同的布局来扼杀人们的大脑（你知道那个一些会）。看起来你只是在抄袭大玩家，但是一致性比看上去要重要得多。
• 文本列不应超宽，因为线越宽，跳到下一行继续阅读就越难。坚持类似于书籍的东西;他们已经被几个世纪精炼了。这就是为什么许多网页都是固定宽度的原因之一，并且有利于列的行。
• 空格重要。它有助于分离信息，并使处理更容易。想象一下，在没有任何空格，新行或子弹的情况下阅读此回复。

我的一个小小的烦恼是文本链接，它们执行频繁的操作。除非您实际上“链接”到单独的页面，否则不会使其看起来像链接。使其成为控件，图像或某物。链接用于移动在网站中，按钮做事物。当他们想要做某事时，大多数人会主动忽略蓝色，带下划线的文本，因为他们习惯于“提交表单”按钮或类似的东西。链接也很小，相对难以点击重复操作，而且对于我来说， reek 在广泛使用时不完整的设计/编码。

我见过的许多网络应用程序通常都失败了，试图在浏览器窗口中复制一个桌面应用程序......这样就可以将圆形挂钩装入方孔中。它可以完成，但它们不是不是相同的东西，在任何情况下都不应该这样对待。
部分例外是Web应用程序复制桌面应用程序（即Google文档）的功能。然后，在大多数情况下，布局应该仍然反映网页而不是应用程序，但控件应该可能模仿桌面应用程序以帮助人们过渡。

大多数人在桌面上使用程序来做某事。大多数人使用他们的浏览器来看某些东西（阅读，观看等）。当然，这是交叉，但考虑大多数人的日常习惯，并记住其他人将使用你设计的东西;这不仅仅是你（和你的克隆人）。

而且，虽然它重复其他，但后退按钮是 critical 。如果你打破它，用户会想要打破你。覆盖右键单击菜单或行为通常也是一个坏主意，并且主要是惹恼用户（有些人会主动阻止这样做的javascript，因为它太烦人了（包括我自己））。

Answer 3

唯一最大的区别是IMO，在Web应用程序中，您对鼠标行为的影响非常有限，而您所拥有的内容与已建立的桌面行为背道而驰。例如：

• 在桌面应用中，鼠标右键单击几乎普遍会导致弹出上下文菜单。在webapp中也是如此，但它是浏览器的上下文菜单，你不能（也不应该）改变它。
• 在桌面应用中，只需单击一下，双击即可执行某些操作;在webapp中，单击已“执行”链接，双击不存在。

Answer 4

桌面应用程序倾向于使用“在此事件上执行此代码块”模式来编写。 Web应用程序是更多块模式“服务器格式化整个页面，用户填写表单并按下按钮，服务器处理整个表单，服务器格式化另一个页面”模式。

由于浏览器可以在后台请求一些数据，并且刷新页面的某些部分，因此AJAX会稍微混淆水。然而，基本原则仍然存在。

使桌面GUI更容易响应特定的鼠标移动和点击等。另一方面，对于Web应用程序，与服务器的唯一通信是“获取”和“发布”请求，因此用户界面非常笨重。 / p>

基于Web的应用程序更加便携，而您在客户端上只需要的软件就是一个兼容的浏览器。这些系统管理优势是人们忍受稍差的GUI的原因。

Answer 5

有趣的读到：Web Apps vs. MS Windows Apps。

Answer 6

主要区别在于构建桌面上的Visual非常快，而且不需要使用不同的浏览器进行测试。我总是发现构建桌面的魅力因为软件的Visual部分刚刚绑定您的控制器（包含您的模型），您可以随时随地使用！

另一个区别是加载速度。您不必为显示器传输Javascript或CSS ...您不必使用zip或其他东西，因为它始终可以在桌面上的源代码中使用。

其他的事情是，您可以使用计算机的RAM来做艰难的事情，这往往会减少在服务端拥有多台计算机的需要，因为您可以使用所有这些计算机来“移植”大型进程（如果需要） ）。

另一方面，部署更难（你有ClickOnce和自动工具可以帮助你），但它从未像web一样透明。所以，你必须更多地计划发布，因为你不能做“热修复”。

Answer 7

• Web浏览器中的跨帧通信很困难。例如，让一个iframe影响另一个iframe与javascript。主要是因为加载时间可能不同，所以帧A可能需要在定时器循环上等待帧B加载。

• 在Web UI中，消息传递确实需要考虑请求/响应周期。很难做到像“如果记录改变数据库，在用户屏幕上弹出消息”这样的事情。此外，如果按下按钮必须刷新5个不同的iframe，则最终可能会向服务器发出5个单独的请求。不需要在桌面用户界面中担心这一点。

Answer 8

我发现最不同的一件事是数据绑定。这个概念仍然是相同的，但是对于网络应用程序，您总是担心是否重新绑定所述控件以根据其他事件点击刷新数据。关于桌面应用程序的好处是，这不是一个问题，因为单击其他事件或转到其他选项卡不会使控件中的数据无效。