制作一个简单的静态网站多语言有哪些选择?
What are the options for making a simple static website multilingual?
我正在建立一个静态网站,我想用两种语言显示它。
我找不到不同选项的综合概述(例如服务器端加载与前端加载与使用不同的文件夹。每个选项的优点是什么(例如对于 SEO、可维护性、可扩展性等。 )?
理想情况下,翻译将存储在单独的 json 文件中。我最关心的是翻译——国际化和本地化的其他方面则较少。
例如我会如何翻译:
<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 - most standard option. support for loads of frameworks, but not clear which one is appropriate for most basic usage. i18nextify? jquery-i18next?
- i18js - 简单,但是 rails?
- i18n - 在 npm 上最受欢迎,但具有构建状态
- i18n-2 - 上面的更新版本
我觉得 i18next 是最标准的方式,但它适合简单的网站吗?
如果您所做的只是文本翻译,我认为您根本不需要为图书馆操心。您需要做的就是编写一个在两个(或更多)json 语言文件之间切换的简单函数,以及一种从所选 json 文件中显示正确字符串的机制。
对于其他环顾四周的人,我找到了关于此 Reddit thread 的概述。我还将在下面解释我选择的选项。
总结话题:
1) 前端 JS(例如 jquery.i18n)
- 通常很容易实施
- 它们会对 SEO 产生负面影响
- 可以增加页面权重
- 网站不适合不 运行 JS
的人
- 不推荐,但适合非常小的项目
2) 多页
- 这最容易设置,但维护却成了一场噩梦。不推荐
3) 服务器端(例如 node-i18n)
- 因为避免了前面提到的前端的弊端,所以一般比较大的项目推荐这个
4) 使用 npm 脚本或 gulp 等构建工具(例如 static-i18n)
- 使用构建脚本为每种语言生成单独的目录
- 一些初始设置,但易于维护和扩展
- 由于只生成静态 html 页面,html 代码可以安全地嵌入到翻译 json 文件中。
解决方案
最后我使用 static-i18n 选择了选项 4。虽然需要一些设置,但它适用于 SEO,适用于静态站点,易于维护,可扩展,并且避免了前端动态语言加载的混乱。
我正在建立一个静态网站,我想用两种语言显示它。
我找不到不同选项的综合概述(例如服务器端加载与前端加载与使用不同的文件夹。每个选项的优点是什么(例如对于 SEO、可维护性、可扩展性等。 )?
理想情况下,翻译将存储在单独的 json 文件中。我最关心的是翻译——国际化和本地化的其他方面则较少。
例如我会如何翻译:
<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 - most standard option. support for loads of frameworks, but not clear which one is appropriate for most basic usage. i18nextify? jquery-i18next?
- i18js - 简单,但是 rails?
- i18n - 在 npm 上最受欢迎,但具有构建状态
- i18n-2 - 上面的更新版本
我觉得 i18next 是最标准的方式,但它适合简单的网站吗?
如果您所做的只是文本翻译,我认为您根本不需要为图书馆操心。您需要做的就是编写一个在两个(或更多)json 语言文件之间切换的简单函数,以及一种从所选 json 文件中显示正确字符串的机制。
对于其他环顾四周的人,我找到了关于此 Reddit thread 的概述。我还将在下面解释我选择的选项。
总结话题:
1) 前端 JS(例如 jquery.i18n)
- 通常很容易实施
- 它们会对 SEO 产生负面影响
- 可以增加页面权重
- 网站不适合不 运行 JS 的人
- 不推荐,但适合非常小的项目
2) 多页
- 这最容易设置,但维护却成了一场噩梦。不推荐
3) 服务器端(例如 node-i18n)
- 因为避免了前面提到的前端的弊端,所以一般比较大的项目推荐这个
4) 使用 npm 脚本或 gulp 等构建工具(例如 static-i18n)
- 使用构建脚本为每种语言生成单独的目录
- 一些初始设置,但易于维护和扩展
- 由于只生成静态 html 页面,html 代码可以安全地嵌入到翻译 json 文件中。
解决方案
最后我使用 static-i18n 选择了选项 4。虽然需要一些设置,但它适用于 SEO,适用于静态站点,易于维护,可扩展,并且避免了前端动态语言加载的混乱。