How do you serve a page with content in multiple languages?
Assumption: The question is about how to serve a page with content available in multiple languages and the content within the page should be displayed only in one consistent language.
Serving a page in different languages is one of the aspects of internationalization (i18n).
When an HTTP request is made to a server, the requesting user agent usually sends information about language preferences, such as in the Accept-Language
header. The server can then use this information to return a version of the document in the appropriate language if such an alternative is available. The returned HTML document should also declare the lang
attribute in the <html>
tag, such as <html lang="en">...</html>
.
To let a search engine know that the same content is available in different languages, <link>
tags with the rel="alternate"
and hreflang="..."
attributes should be used. E.g. <link rel="alternate" hreflang="de" href="http://de.example.com/page.html" />
.
Rendering
- Server-side rendering: The HTML markup will contain string placeholders and content for the specific language will be fetched from configuration in code or a translation service. The server then dynamically generates the HTML page with content in that particular language.
- Client-side rendering: The appropriate locale strings will be fetched and combined with the JavaScript-based views.