Question

我正在设置一个静态网站，该网站希望以两种语言显示。

我找不到有关各种选项的全面概述（例如，服务器端加载与前端加载以及使用不同的文件夹。每个选项的优点是什么（例如，对于SEO，可维护性，可伸缩性等）？

理想情况下，翻译将存储在单独的json文件中。我最关心的是翻译-少了i18n和l10n的其他方面。

例如我应该如何翻译：

<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <h1>Welcome</h1>
    <p>Here's a website</p>
    <p>Here's a <a href="https://www.google.com/">Link</a> to language specific Google</p>
    <button>Click here</button>
  </body>
</html>

到目前为止，我遇到过许多选择：

i18next-最标准的选项。支持框架的负载，但不清楚哪一种适合大多数基本用法。 i18nextify？ jquery-i18next？
i18js-很简单，但是需要导轨吗？
i18n-在npm上最受欢迎，但具有构建状态
i18n-2-以上版本的更新版本

我觉得i18next是最标准的方法，但是它适合简单的网站吗？

Answer 1

如果您只做文本翻译，我认为您根本不需要理会图书馆。您所需要做的就是编写一个简单的函数，该函数在两个（或更多个）json语言文件之间切换，以及一种机制，以显示所选json文件中的正确字符串。

Answer 2

对于其他人，我发现了对此Reddit thread的概述。我还将在下面解释我选择的选项。

总结线程：

1）前端JS（例如jquery.i18n）

通常相当容易实现
它们可能会对SEO产生负面影响
可以增加页面重量
该网站不适用于未运行JS的人
不推荐，但对于很小的项目还可以

2）多页

这是最容易设置的，但是维护成为一场噩梦。不推荐

3）服务器端（例如node-i18n）

由于它避免了上述前端的缺点，因此通常建议在大型项目中使用

4）使用npm脚本或gulp等构建工具（例如static-i18n）

使用构建脚本为每种语言生成单独的目录
初期设置但易于维护和扩展
由于仅生成静态html页面，因此可以将html代码安全地嵌入到翻译json文件中。

解决方案

最后，我使用static-i18n选择了选项4。虽然花了一些时间设置，但是它对于SEO很好，对于静态网站也很有效，易于维护，可伸缩，并且避免了前端动态语言加载的混乱。

使简单的静态网站多语言化有哪些选择？

2 个答案:

总结线程：

解决方案