前端页面使用静态页面(SSG)方式部署,是SEO最友好的。
前端页面使用服务器端渲染(SSR)方式呈现给搜索引擎,SEO次优。
如果你的前端主应用必须是使用Vue.js或React.js等框架开发的单页应用(SPA),但还有其他的营销相关页面 (落地页、关于页、wiki、博客等),请单独部署这些页面!理想情况下,营销页面应该是包含尽可能少js代码的静态HTML,并用静态页面(SSG)方式部署。
不只是技术,还有专业之外。
前端页面使用静态页面(SSG)方式部署,是SEO最友好的。
前端页面使用服务器端渲染(SSR)方式呈现给搜索引擎,SEO次优。
如果你的前端主应用必须是使用Vue.js或React.js等框架开发的单页应用(SPA),但还有其他的营销相关页面 (落地页、关于页、wiki、博客等),请单独部署这些页面!理想情况下,营销页面应该是包含尽可能少js代码的静态HTML,并用静态页面(SSG)方式部署。
For websites that use server-side templating engines (e.g., Laravel’s Blade) to render HTML documents, the approach to localization (internationalization) is as follows: For common pages like login and registration, you can use the __() function to translate text based on the lang= query parameter passed from the frontend. For other pages, the language-specific views should be placed in directories like resources/views/{language_code} (for Laravel) or public/{language_code} (where “public” refers to the web root directory).
For fully decoupled applications, such as those where the frontend is developed using MVVM frameworks like Vue.js or React.js for SPAs, and the backend is built with Laravel to provide APIs, localization methods differ. In this case, you should add language-specific subdomains at the domain level, such as cn.vuejs.org for the Chinese Vue.js site, ja.vuejs.org for the Japanese site, with the default vuejs.org serving the English version. Additionally, the database should support language-specific partitioning, where each language code has its own set of tables or databases.
对于前端使用服务器端模板引擎(例如Laravel的blade)渲染输出HTML文档的开发方式,本地化(国际化)的方法是,通用的页面,例如登陆注册,可以使用__()函数根据前端传过来的lang=语言代码查询参数翻译文本。其他不同用的页面应该放在resources/views/语言代码目录(对于Laravel)或public/语言代码目录(public代表web根目录)下。还有一种方法是在HTML文档中使用lang='xxx'属性标记HTML元素的内容所使用的语言,再使用:lang伪类选择器根据前端传过来的lang=语言代码,选择显示特定语言的HTML元素(由服务器端模板引擎实现),其他语言的元素都不显示(由服务器端模板引擎设置display:none;)。例如:
<style>
/*显示中文内容*/
:lang(zh_CN){
…
}
:lang(fr){
display:none;/*不显示法文内容*/
…
}
</style>
<div lang='zh_CN'>中文内容……</div>
<div lang='fr'>法文内容……</div>
这种方法适用于内容比较简单的国际化网页。
除了在URL里带上lang=语言代码查询参数,也可在HTTP标头的Accept-Language字段中设置语言代码,例如:
Accept-Language: zh_CN
或
Accept-Language: en
请求头和响应头都要设置Accept-Language标头。这种方式与在URL里带上lang=语言代码查询参数比起来,可以省去为模板文件中的所有URL拼接查询参数的麻烦。
对于前后端完全分离的应用程序,例如前端使用Vue.js、React.js等MVVM框架开发SPA,服务器端使用Laravel开发并提供API给前端调用,本地化(国际化)的方法有以下几种:
lang=语言代码查询参数。Accept-Language字段中设置语言代码。对于方法二和方法三,对于通用的信息,例如错误信息字符串,有以下两种处理方法:
__()函数根据前端传过来的语言代码翻译文本。这种方法适用于浏览器网站应用程序。数据库也应该根据语言代码分库分表。节约磁盘空间做法是,不根据语言代码分库分表,但是需要国际化的字段,它的值应该有每种语言的版本,例如商品的名字需要有中文和英文两种值,对应数据库表里的两个字段name_zh_cn和name_en。