2

假设我们在一个网页上有一个覆盖 DHTML 面板,该面板在顶部包含两个按钮,占据了对话框的整个宽度,如下所示:

控制板

Button 1 和 Button 2 的文本应本地化。复选框组的内容是静态的,不应本地化。

不同语言的按钮文本宽度可能存在很大差异(与英文版本相比,大约有 100% 的额外空间)。

问题是根据文本内容的长度应用哪种策略来调整 Button 1 和 Button 2 的大小:

  1. 使按钮固定宽度并用省略号截断文本内容。
  2. 使按钮固定宽度并在后续行中换行文本内容,从而使按钮的高度增加。
  3. 使按钮宽度固定,但使其宽度足以容纳所有语言的文本,而无需截断或换行。
  4. 使按钮动态调整宽度并使面板随其大小水平增长。

根据发现的几个 UI 本地化最佳实践,我倾向于使用第三个或第四个选项:

我们仍然在团队中进行一些辩论,讨论最佳选择,听到社区有意识的外部声音会很有趣。

我对这个特定案例的最佳方法以及解决与本地化有关的 Web UI 大小问题的一般指南感兴趣。

谢谢!

4

1 回答 1

5

您可能知道,用省略号(或单点)缩短的文本可能难以理解:

如何压缩。是吗?

你应该在移动领域(手机,平板电脑等)看到很多这样的员工,这样的翻译看起来很难看。好的,在较低的屏幕分辨率下,您实际上别无选择(除非您可以创建一些自动滚动文本)。但如果是 Web 界面,您当然可以选择。

通常,有两种解决方案对应于您的第 3 点和第 4 点。就个人而言,我倾向于#4 - 使按钮自动调整大小。这当然会导致按钮大小不一致,但我们对此无能为力。

如果您不能使用解决方案#4(即UI 设计师是这种技术的强烈反对者),您可以稍微修改解决方案#3。基本上,我在过去的项目中使用的是,我有固定大小的按钮,默认大小能够适应大多数语言(当然波兰语和俄语除外),但我也有几个定义更宽按钮的 CSS 类。当本地化成“太长”的语言时,我只是使用了最宽的按钮类。如果文本仍然不合适,那么我要求翻译人员缩短它(通常重新措辞并用一个点缩短文本作为最后的手段)。
但是,请记住,它会增加本地化成本。这就是我不推荐这种方法的原因。

至于解决方案#2,你最终会得到丑陋的 UI。您根本无法控制浏览器如何包装文本,并且您将有很多文本超出按钮剪切矩形(重叠)。

至于解决方案#1,使用省略号是一个坏主意,原因有两个。第一个是,省略号在许多语言中都无效(尤其是亚洲语言)。第二个是,据我了解,您想自动执行此操作。在这种情况下,您将无法测量字符串——它们在屏幕上的实际大小,使用后备字体编写. 在 Web UI 的情况下,您不知道用户是否安装了特定的字体,因此您将猜测大小(好吧,使用 Dojo,您理论上可以在客户端测量它)。这当然会导致文本重叠(如果您决定动态缩短所选字体)或完全无法理解的文本(如果您决定在说 8 个字符后缩短)。我有一个开始使用静态缩短的项目,这完全是一团糟。然后我们切换到动态,它仍然不够好。
为了反驳潜在的 UI Designer 论点“我们没有字符串扩展的空间”,我只能说这意味着你设计的界面不正确,因为它太拥挤了. 这就是 I18n 与 UI 设计最佳实践齐头并进的一点:力求简单(在 UI 设计中)。结果将易于使用且易于本地化应用程序。

于 2012-05-05T12:39:08.007 回答