网站本地化(或本地化)

Question

我最近一直在考虑本地化我的网站，但在谷歌搜索中发现有点空白。我一直在寻找如何本地化应用程序，但不是网站或GeoLocation，这有点太具体了。

我希望能够本地化使用纯HTML(5)和CSS(3)主要。我希望能够本地化的部分在一个页面，而不是有单独的网址为每个国家。

这方面的任何帮助都将是非常有用的，所以提前感谢。

编辑:如果没有一种纯HTML(5)或CSS(3)的方式来做这件事，那么服务器端、js或其他语言的任何示例都是有用的。

Answer 1

这个解决方案是我在一个几乎没有html的ajax应用程序中使用的(所有内容都是从数据客户端生成的)。

第一部分确保您可以在url中指定语言(例如，通过添加&lang=it )，并确保它存储在本地存储中(浏览器中的永久用户首选项)：

myapp.available_langs = ['en', 'fr', 'it']; // the first one is the default language
// Exemples :
//   {en:'hi', fr:'Bonjour'}
//   {fr:'Bonjour'}
myapp.loc = function(map) {
    if (map[myapp.lang]) return map[myapp.lang];
    for (var i=0; i<myapp.available_langs.length; i++) {
        if (map[myapp.available_langs[i]]) return map[myapp.available_langs[i]];
    }
    return "-label not found-";
};

myapp.getUrlParameter = function(name, defaultValue) {
    name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var results = new RegExp( "[\\?&]"+name+"=([^&#]*)" )
         .exec( document.location.href );
    if( results == null ) return defaultValue;
    else return decodeURIComponent(results[1]);
};

myapp = {};
myapp.lang = localStorage['lang'] = myapp.getUrlParameter('lang', localStorage['lang']||myapp.available_langs[0]);

它在其他地方也是这样使用的：

$('body').append('<div product id=product_header>\
    ...
        <tr>\
            <td> '+myapp.loc({en:'cut',fr:'date'})+': <span id=product_cutdate>?</span></td>\
            <td> '+myapp.loc({en:'grade',fr:'qualité'})+': <span id=product_grade>?</span></td>\
            <td> '+myapp.loc({en:'length',fr:'longueur'})+': <span id=product_length>?</span> m</td>\
            <td> '+myapp.loc({en:'thickness',fr:'épaisseur'})+': <span id=product_thickness>?</span> mm</td>\
            <td> '+myapp.loc({en:'width',fr:'largeur'})+': <span id=product_width>?</span> m</td>\
        </tr>\

您可能还会选择使用用户代理，但在实际的企业使用中，我发现它几乎没有用。请注意，i18n解决方案可能非常多种多样。我并不主张使用这个，这只是一个我喜欢的模式。许多人更喜欢提取外部属性文件中的字符串，但根据我的经验，这会导致更多糟糕的翻译，并且更难管理(只要只有一个团队会说所有涉及到的语言，而您没有10个)。