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.

  1. Don't use Country Flags as icons.
    1. Not all are recognisable.
    2. Not all indicate which language will be shown (Switzerland / Canada / The Netherlands).
    3. A right mess for Accessibility - how many would add Alt text?

  2. Better to use ISO 639-1 Language Name as labels (English | German | French | Italian) or even (better) (English | Deutsch | français | Italiano).
  3. Have all sites at the same folder level.
  4. Use ISO 639-1: two-letter codes for sub-folders - (en | de | fr | it).
  5. 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