Costruire un negozio per un paese è facile. Costruire un negozio per 20 paesi è un frattale architettonico. Devi gestire:

Traduzione (Lingua: francese)
Localizzazione (valuta: CAD vs EUR)
Contesto di mercato (inventario: magazzino USA vs magazzino UE)

Perché Maison Code ne parla

In Maison Code Paris, agiamo come la coscienza architettonica dei nostri clienti. Spesso ereditiamo stack “moderni” costruiti senza una comprensione fondamentale della scala.

Discutiamo di questo argomento perché rappresenta un punto di svolta critico nella maturità ingegneristica. Implementarlo correttamente differenzia un MVP fragile da una piattaforma resiliente di livello aziendale.

La struttura dell’URL

Sosteniamo le sottocartelle, non i sottodomini.

Errore: fr.maisoncode.paris (autorità di dominio divisa).
Buono: maisoncode.paris/fr (Consolida il SEO).

Implementazione del middleware Remix

Utilizziamo un middleware i18n personalizzato in entry.server.tsx.

“dattiloscritto”. // Rileva la localizzazione dall’URL -> Cookie -> Intestazione funzione di esportazione risolvereLocale(richiesta: Richiesta): Locale { const url = nuovo URL(richiesta.url); const percorsoLocale = url.nomepercorso.split(’/’)[1];

if (supportedLocales.includes(pathLocale)) { restituire percorsoLocale; }

// Fallback su GeoIP (intestazione Cloudflare) const paese = request.headers.get(‘cf-ipcountry’); return countryToLocaleMap[paese] || ‘it’; }


## Il contesto del dizionario
Non codifichiamo stringhe.
Recuperiamo il dizionario (JSON) per la locale risolta e lo passiamo a un contesto React.

"tsx
const t = useTranslation();
<h1>{t('product.addToCart')}</h1> 
// Rende "Ajouter au panier" se la locale è fr

Tag hreflang

Questo è fondamentale per la SEO. Devi dire a Google che “/fr/chemise” è la versione francese di “/en/shirt”. Generiamo automaticamente queste intestazioni per ogni pagina.

<link rel="alternate" hreflang="it" href="https://site.com/it/shirt" />
<link rel="alternate" hreflang="fr" href="https://site.com/fr/chemise" />

9. Pagamento localizzato (Markets Pro)

Instradare il traffico verso “/fr” è inutile se il pagamento è in USD. Sfruttiamo Shopify Markets Pro. Il middleware rileva il paese “fr”. Creiamo il Carrello con {"country": "FR", "currency": "EUR"}. Ciò blocca il checkout per mostrare automaticamente dazi, tasse (IVA) e metodi di pagamento locali (Cartes Bancaires). Il flusso continuo da maisoncode.paris/fr a un checkout denominato in euro è il motivo per cui osserviamo una conversione del 40% in Europa.

10. Migliori pratiche di reindirizzamento geografico

Non eseguire mai il reindirizzamento automatico senza chiedere. Se sono un americano in viaggio a Parigi e mi costringi a “.fr”, ti odio. Modello:

Rilevare l’IP è la Francia.
L’utente è su “.com”?
Mostra una piccola “Bar” in alto: “Vediamo che sei in Francia. Passare al negozio francese? [Sì/No]”.
Reindirizzamento solo se si fa clic su Sì. Eccezioni: se digitano direttamente .fr, rispettalo.

11. Scala globale

Vendi negli Stati Uniti (USD) e nel Regno Unito (GBP). La descrizione del prodotto è identica (inglese). Google lo vede come “Contenuto duplicato”. Soluzione: Canonici autoreferenziali. L’URL “site.com/us/shirt” punta canonicamente a “site.com/us/shirt”. L’URL “site.com/uk/shirt” rimanda canonicamente a “site.com/uk/shirt”. Combinato con hreflang, questo dice a Google: “Si tratta di pagine distinte destinate a mercati diversi, non di copie”. Senza questo, Google deindicizza uno di essi.

7. Negoziazione del contenuto (Accetta lingua)

Il middleware non dovrebbe limitarsi a guardare l’URL. Dovrebbe esaminare l’intestazione “Accept-Language” inviata dal browser. Se un utente arriva a / (root), reindirizzalo:

Controlla la localizzazione dell’URL (Nessuno).
Controlla il cookie “NEXT_LOCALE”.
Controlla l’intestazione “Accept-Language” (fr-FR). -> Reindirizza a /fr.
Controllare GeoIP (Francia). -> Reindirizza a /fr.
Fallback -> /it. Questo “Smart Routing” aumenta la conversione indirizzando automaticamente l’utente alla sua lingua madre.

12. Localizzazione Edge (lavoratori Cloudflare)

L’esecuzione di i18n sul server di origine (Node.js) è troppo lenta (100 ms). Lo spostiamo sul Edge. I Cloudflare Workers intercettano la richiesta prima che raggiunga il server.

In entrata: GET / (da IP: Berlino).
Lavoratore: “L’utente è tedesco. Reindirizzamento a /de.”
Latenza: 5 ms. L’utente vede immediatamente il sito tedesco. Nessun “Flash di contenuti errati”. Questa è “Localizzazione alla velocità della luce”.

13. Sfumatura valutaria: il problema della visualizzazione

“10,00 USD” != “10,00 USD”. In Francia, lo spazio è uno spazio unificatore utilizzato come separatore delle mille. In Giappone non ci sono decimali (Yen). L’uso di “Intl.NumberFormat” è obbligatorio. Ma che dire del “prezzo psicologico”?

USD: € 19,99
EUR: €19,95 (gli europei preferiscono ,95) Implementiamo le regole di arrotondamento dei prezzi per mercato. Se il tasso di cambio indica 19,12 €, lo arrotondiamo automaticamente a 19,95 €. Questo fa sembrare il marchio “nativo”, non come un dropshipper straniero.

14. Perché Maison Code?

Noi di Maison Code non traduciamo solo parole; traduciamo Contesto. Abbiamo distribuito negozi in oltre 50 paesi per marchi di lusso ridondanti. Sappiamo che in Germania bisogna mostrare “Impressum”. Sappiamo che in Giappone il modulo dell’indirizzo è invertito (prima il codice postale). Costruiamo architetture che rispettano queste sfumature culturali per impostazione predefinita. Il tuo marchio dovrebbe sentirsi locale, ovunque.

15. Conclusione

Diventare globali significa per il 10% traduzione e per il 90% architettura. Puoi assumere i migliori traduttori, ma se la struttura del tuo URL confonde Google, fallirai. Se il tuo checkout non mostra le tasse locali, fallirai. Costruisci un “Global Core” con routing, middleware e gestione valutaria adeguati. Allora il mondo è il tuo mercato.

Perso nella traduzione?

Progettiamo implementazioni globali per marchi che rifiutano di scendere a compromessi sulle sfumature locali.

Globalizza il mio negozio. Assumi i nostri architetti.