The OP of https://www.talkgraphics.com/showthr...-on-SOME-pages got me thinking.
How to best deliver a multi-language site?
These are my ideas.
- Don't use Country Flags as icons.
- Not all are recognisable.
- Not all indicate which language will be shown (Switzerland / Canada / The Netherlands).
- A right mess for Accessibility - how many would add Alt text?
- Better to use ISO 639-1 Language Name as labels (English | German | French | Italian) or even (better) (English | Deutsch | français | Italiano).
- Have all sites at the same folder level.
- Use ISO 639-1: two-letter codes for sub-folders - (en | de | fr | it).
- Code so a click on a language link, jumps to the identical page in that language.
The Website > HTML Code (Head) for this is simply:
Code:
<script>function changeto(lang) {
addr = document.location.href;
addr = addr.replace('/en/', '/' + lang + '/');
addr = addr.replace('/fr/', '/' + lang + '/');
addr = addr.replace('/de/', '/' + lang + '/');
addr = addr.replace('/it/', '/' + lang + '/');
document.location.href = addr;
}
</script>
For the français website, you add links:
- English - javascript: changeto('en');
- Deutsch - javascript: changeto('de');
- français - javascript: ; [or leave as - javascript: changeto('fr') as I might code to change the session variable (see below) for a match to not then jump; all language bars on all pages and sites would then be identical]
- Italiano - javascript: changeto('it');
You just set the language bar to Repeat on all pages: English | Deutsch | français | Italiano
You will need a launch page for visitors arriving without a picked language.
I personally would use localStorage.setItem("language", lang); in the changeto() above and an onLoad check if this variable was set and redirect to the right sub-site so the launch page is thereafter bypassed.
You would also need to plan for errors:
- Sub-site page not found - code to jump to its index page.
- Sub-site not found - server 404 page to offer other sub-sites or unset language variable and jump to the launch page.
Overall, a richer experience for the international visitor.
Acorn
Bookmarks