使一个简单的静态网站多语言化有哪些选择? [英] What are the options for making a simple static website multilingual?

查看:173
本文介绍了使一个简单的静态网站多语言化有哪些选择?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I'm setting up a static website which I want to display in two languages.

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

I can't find a comprehensive overview of the different options (e.g. server-side loading vs front-end loading vs using different folders. What are the advantages of each option (e.g. for SEO, maintainability, scalability etc.)?

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

Ideally the translations will be stored in separate json files. The main thing I care about is translation - less so the other aspects of i18n and l10n.

例如,我应该如何翻译:

For example how might I translate:

<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>

到目前为止,我遇到了许多选择:

Some of the many options I've encountered so far:

  • i18next - most standard option. support for loads of frameworks, but not clear which one is appropriate for most basic usage. i18nextify? jquery-i18next?
  • i18js - simple, but for rails?
  • i18n - most popular on npm, but has build status
  • i18n-2 - updated version of above

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

I feel like i18next is the most standard way to go, but is it suited to a simple site?

推荐答案

对于其他人,我发现了对此

For anyone else looking around, I found an overview on this Reddit thread. I'll also explain the option I went with below.

1)前端JS(例如 jquery.i18n )

1) Front-End JS (e.g. jquery.i18n)

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

2)多页

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

3)服务器端(例如 node-i18n )

3) Server Side (e.g. node-i18n)

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

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

4) Using a build tool like npm scripts or gulp (e.g. static-i18n)

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

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

In the end I went with option 4 using static-i18n. While it took a bit of setting up, it works well for SEO, works for static sites, is easily maintainable, is scalable, and avoids the messiness of front-end dynamic language loading.

这篇关于使一个简单的静态网站多语言化有哪些选择?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆