Suggerimenti per la progettazione di siti Web multilingue

Numerosi siti Web ora hanno molte opzioni linguistiche in modo che i loro visitatori da tutto il mondo possano navigare comodamente. Internet ha contribuito a rendere il mercato un'esperienza globale, quindi avendo un sito Web, hai aperto le porte della tua attività a tutti coloro che dispongono di una connessione Internet. Tuttavia, se non capiscono la lingua, non rimarranno.

Fortunatamente, il processo per rendere multilingue il tuo sito Web è abbastanza semplice. ConveyThis può creare una versione tradotta del tuo sito in pochi minuti e quindi puoi personalizzare l'aspetto e il posizionamento del tuo selettore di lingua, apportare alcune modifiche al layout per adattarsi alle lingue più parole o da destra a sinistra e cambiare colori e immagini in quei casi in cui gli originali sono inadatto alla cultura di arrivo.

Il processo non è completamente automatizzato, dovrai fare qualche ricerca in anticipo. Questa guida spiega alcuni aspetti della progettazione di siti Web per aiutarti a entrare comodamente nel mondo dei siti Web multilingue e del design eccezionale.

Marchio coerente

L'esperienza dell'utente deve essere coerente indipendentemente dalla versione linguistica che sta visitando. L'aspetto dovrebbe essere molto simile in tutte le versioni, alcune differenze potrebbero essere necessarie a causa di differenze linguistiche o culturali, ma se passi da una lingua all'altra non dovresti avere la sensazione di essere stato reindirizzato a un sito completamente diverso.

Pertanto, elementi di design come il layout e il particolare stile di branding della tua azienda dovrebbero rimanere gli stessi in tutte le lingue.

Questo è super facile da fare in WordPress con ConveyThis, che identifica perfettamente il testo indipendentemente dal tema che hai scelto (anche se è personalizzato!) e lo traduce automaticamente, anche se stai lavorando con altri plugin.

Questo ti aiuterà ad avere un modello globale con lo stesso tema per tutte le lingue e, quindi, la stessa esperienza utente.

La homepage di Airbnb funziona benissimo come esempio, diamo un'occhiata alla versione australiana:

Ed ecco la versione giapponese:

Senza dubbio questo è lo stesso sito web. Lo sfondo è lo stesso, così come la funzione di ricerca. Avere un design unificato aiuta l'identità del tuo marchio e fa risparmiare tempo e fatica quando aggiungi nuove lingue o aggiorni.

Cancella selettori di lingua

Scegli una posizione di rilievo per il selettore di lingua, come uno qualsiasi dei quattro angoli del tuo sito Web, e posizionalo su ogni pagina, non solo sulla home page. Deve essere facile da trovare, nessuno vuole mai cercare un pulsante nascosto.

Si raccomanda vivamente che i nomi delle lingue siano nella propria lingua. "Español" invece di "spagnolo", ad esempio, funzionerà a meraviglia. Asana fa questo, il loro sito ha una casella a discesa con le opzioni di lingua disponibili.

In questo modo aiuta i visitatori a sentirsi i benvenuti. Se il tuo sito web è tradotto, l'elenco delle lingue dovrebbe rifletterlo. Leggere “tedesco, francese, giapponese” su un sito inglese non facilita la navigazione e dà l'impressione che la versione inglese sia la più importante.

"Lingue" è meglio di "Regioni"

Molti grandi marchi internazionali ti costringono a cambiare regione per poter leggere il sito web nella tua lingua. Questa è un'idea terribile che rende la navigazione più difficile per i visitatori. Questi siti Web funzionano presupponendo che tu stia navigando nella regione in cui si parla la lingua, quindi ottieni il testo nella tua lingua ma potresti non ottenere il contenuto per la regione che ti interessa.

L'immagine seguente è stata presa dal sito Web di Adobe:

Le lingue non dovrebbero essere inestricabili dalle loro regioni. Prendiamo ad esempio tutte quelle città cosmopolite come New York, Londra e Parigi. Forse un belga che vive nel Regno Unito desidera acquistare dal sito del Regno Unito ma navigare in francese. Devono scegliere tra l'acquisto dal sito belga nella loro lingua o l'acquisto dal sito del Regno Unito in inglese, e non vogliono fare nessuna delle due cose. Hai così accidentalmente creato una barriera. Diamo un'occhiata a un sito Web che consente di specificare lingua e regione separatamente, il sito Web di Uber.

Questo è un design eccellente. In questo caso, l'opzione di cambio lingua è stata inserita nel piè di pagina a sinistra e invece di una casella a discesa hai un modale a causa delle numerose opzioni. I nomi delle lingue sono indicati anche nella loro lingua.

Come bonus potresti "ricordare" qual era la lingua scelta dall'utente in modo che dalla prima visita in poi non debba più cambiare lingua.

Rileva automaticamente la posizione

Questa funzione è super utile in modo che i tuoi visitatori non accedano attraverso la lingua sbagliata. E per risparmiare tempo da parte dell'utente in modo che non debba cercare il selettore di lingua. Ecco come funziona: il sito web identifica la lingua del browser o la sua posizione.

Ma fai attenzione nel caso in cui l'utente sia un turista e non abbia familiarità con la lingua locale perché avrà bisogno del pulsante della lingua per poter cambiare, per questo motivo lo strumento non è sempre preciso.

Quando progetti il tuo sito multilingua non scegliere tra il rilevamento automatico della lingua e il selettore di lingua, quest'ultimo è obbligatorio mentre il primo è facoltativo.

I flag non sono adatti sostituti del nome di una lingua

Ci sono 21 paesi di lingua spagnola e 18 paesi di lingua inglese, e in Cina ci sono 8 dialetti primari, quindi le bandiere non sono grandi sostituti dei nomi delle lingue. Inoltre, i flag potrebbero non essere indicatori utili perché potrebbero confondere coloro che non li riconoscono.

Sii flessibile con lo spazio del testo

Questa può essere una sfida, ma è innegabile che le traduzioni non occupano lo stesso spazio del testo originale, alcune possono essere più corte, altre possono essere più lunghe, alcune potrebbero anche aver bisogno di più spazio verticale!

I caratteri cinesi contengono molte informazioni quindi non è necessario molto spazio, mentre l'italiano e il greco sono più prolissi e richiedono il doppio delle righe. Una buona regola empirica è presumere che alcune traduzioni potrebbero richiedere più del 30% di spazio in più, quindi sii flessibile con il layout e assegna ampi spazi per il testo. Quelle strette strette nel sito Web originale potrebbero non avere abbastanza spazio per la traduzione, l'inglese è una lingua particolarmente compatta e se trovi la necessità di abbreviare in inglese in modo che il contenuto si adatti, incontrerai sicuramente qualche problema quando è tempo di tradurre.

Oltre ad avere spazio per allungare il testo, è anche una buona idea avere elementi dell'interfaccia utente adattivi in modo che anche i pulsanti e i campi di input possano crescere, puoi anche ridurre la dimensione del carattere, ma non troppo.

Il sito web di Flickr è multilingua, diamo un'occhiata al pulsante "visualizzazioni" originale:

Sembra fantastico, tutto è fantastico, ma "viste" risulta essere una parola più lunga in altre lingue, che richiede più spazio.

In italiano richiede il triplo dello spazio!

Molte scritture non latine, come l'arabo, richiedono più altezza affinché la traduzione si adatti. Quindi, per riassumere, il layout del tuo sito web dovrebbe essere sufficientemente flessibile da adattarsi alle diverse esigenze linguistiche, in modo che nel passaggio l'aspetto raffinato dell'originale non vada perso.

Compatibilità dei caratteri Web e codifica dei siti Web

Secondo il W3C è altamente raccomandato codificare la tua pagina web utilizzando UTF-8 , che consente caratteri speciali.

È piuttosto semplice, la dichiarazione UTF ha questo aspetto

Assicurati anche che i caratteri siano compatibili con le diverse lingue, altrimenti il testo potrebbe sembrare illeggibile. Fondamentalmente, prima di decidere su qualsiasi font, controlla la sua compatibilità con tutti gli script di cui hai bisogno. Se vuoi entrare nel mercato russo, verifica che la scrittura cirillica sia supportata.

L'immagine seguente è stata presa da Google Fonts e, come puoi vedere, puoi scegliere di scaricare qualsiasi versione di script di cui hai bisogno. Quelle lingue con una quantità maggiore di caratteri creano file di caratteri più grandi, quindi tienilo in considerazione quando scegli e mescoli i caratteri.

Per quanto riguarda le lingue da destra a sinistra

Man mano che il mercato mediorientale cresce, potresti prendere in considerazione la creazione di una versione del tuo sito Web che attiri visitatori da questa regione, ciò significa adattare il layout in modo che sia compatibile con la loro lingua. Una caratteristica della maggior parte delle lingue mediorientali è che si leggono da destra a sinistra! Questa è una grande sfida e la soluzione inizia con il mirroring dell'interfaccia.

Questo è il design di Facebook per le lingue da sinistra a destra, come l'inglese.

E questo è il design capovolto per le lingue da destra a sinistra, come l'arabo.

Guarda da vicino, il posizionamento di tutto nel design è stato rispecchiato.

Consulta l'articolo di Robert Dodis sul design per le lingue da destra a sinistra per ulteriori informazioni su come farlo.

Alcune lingue da destra a sinistra sono arabo, ebraico, persiano e urdu e ConveyThis non ha problemi ad adattare il tuo sito Web per soddisfare le loro esigenze linguistiche e garantire un'ottima esperienza utente. E la cosa migliore è che puoi personalizzare l'aspetto di ogni lingua e apportare modifiche al tipo di carattere o alle sue dimensioni e, se necessario, modificare l'altezza della linea.

Scegli le icone e le immagini appropriate

Le immagini hanno una componente culturale molto pesante e sono elementi chiave di un corretto design del sito web. Ogni cultura assegna un significato a immagini e icone diverse, alcune interpretazioni sono positive e altre completamente opposte. Alcune immagini riflettono le esperienze degli ideali di una cultura ma in un contesto diverso faranno sentire gli utenti alienati.

Ecco un esempio di un'immagine che doveva essere sostituita perché non era culturalmente appropriata. Tieni presente che non tutte le immagini saranno offensive per gli altri, forse genererà solo apatia quando desideri che le persone siano curiose e interessate al tuo prodotto.

Questa è la homepage di Clarin per la lingua francese, con una donna caucasica. Ed ecco la versione coreana, con una donna coreana come ambasciatrice del brand.

I tipi di immagini che possono offendere sono quelli che possono sembrare innocenti per alcune culture, ma, agli occhi di una cultura diversa, mostrano comportamenti illegali o tabù, ad esempio, raffigurazioni di omosessualità o emancipazione femminile.

Questo vale anche per le icone, mentre negli Stati Uniti un'icona con due coppe di champagne che brindano rappresenta la celebrazione, in Arabia Saudita è illegale bere alcolici quindi l'icona dovrà essere sostituita con un'icona culturalmente appropriata.

Pertanto sarà necessaria una ricerca per garantire che le icone che hai scelto siano appropriate per il mercato di riferimento. Se non sei sicuro puoi sempre andare sul sicuro.

Ad esempio, queste tre icone raffigurano la Terra, la prima è stata progettata per il pubblico australiano; il secondo, per il pubblico africano; e l'ultimo è adatto a un pubblico più ampio e globale in quanto non è presente alcuna area particolare.

Ultimo ma non meno importante, ConveyThis può tradurre qualsiasi testo, purché non sia incorporato in un'immagine. Il software non sarà in grado di identificare ciò che è scritto su di esso quindi rimarrà nella lingua originale, quindi evita di incorporare il testo.

Scelta dei colori

Come accennato nella sezione precedente, le culture interpretano le immagini in modo diverso e la stessa cosa accade con i colori. I loro significati sono soggettivi.

Ad esempio, in alcune culture, il bianco è il colore dell'innocenza, ma altri non sarebbero d'accordo, è il colore della morte. Lo stesso accade con il rosso, nelle culture asiatiche viene utilizzato nelle celebrazioni ma per alcuni paesi africani non ha una connotazione così positiva in quanto legato alla violenza.

Tuttavia, sembra che il blu sia il più sicuro di tutti i colori, comunemente associato a significati positivi come calma e pace. Molte banche usano il blu nei loro loghi perché può anche significare fiducia e sicurezza.

Questo articolo mostra le differenze nei significati dei colori in tutto il mondo , molto utile per iniziare la tua ricerca su quali sono i colori migliori per il tuo sito multilingue.

Aggiustamenti di formato

Considera di evitare di usare solo numeri quando scrivi le date perché ci sono molti modi diversi per scriverle, negli Stati Uniti il formato ufficiale è mm/gg/aaaa e se puoi vedere solo i numeri alcuni utenti di altri paesi che usano sistemi diversi (come gg/mm/aaaa) potrebbero confondersi. Quindi le tue opzioni sono: assicurarti che le versioni tradotte abbiano il formato della data adattato o scrivi il mese in lettere in modo che ConveyThis scriva sempre la data corretta.

Inoltre, mentre negli Stati Uniti viene utilizzato il sistema imperiale, la maggior parte dei paesi utilizza il sistema metrico, quindi dovrai decidere se sarebbe adatto per il tuo sito trasformare le misure.

Il miglior plugin di traduzione per WordPress

Ci sono così tante opzioni quando si tratta di aggiungere un plugin di traduzione al tuo sito Web WordPress e non tutte funzionano allo stesso modo, i risultati possono variare. Con ConveyThis hai la garanzia di una perfetta integrazione indipendentemente dal design del tuo sito web.

ConveyQuesta è la scelta migliore per la traduzione di siti web con 92 lingue disponibili. È un plug-in WordPress affidabile che ti consentirà di avere rapidamente una solida versione multilingue del tuo sito web. Può comprendere il layout del sito, rilevare tutto il testo e tradurlo. ConveyThis include anche un editor intuitivo per la personalizzazione del testo.

ConveyQuesto include un pulsante di cambio lingua adatto a tutti che funziona con qualsiasi sito come predefinito, ma puoi anche modificarlo quanto vuoi. Seguiamo anche i principi di progettazione indicati in questo articolo:

• Branding coerente su tutte le versioni linguistiche del sito web.
• Chiaro selettore di lingua e possibilità di scegliere una lingua preferita.
• I siti web sono codificati automaticamente con UTF-8.
• Interfacce adeguate per le lingue da destra a sinistra

ConveyThis: una soluzione per siti Web multilingue di cui ti puoi fidare

Si ritiene comunemente che la traduzione del sito Web sia un processo complesso. Ma non c'è bisogno di rimandarlo perché non vuoi affrontare il mal di testa. Non è affatto scoraggiante! Con ConveyThis, diventa una semplice conversione. È senza soluzione di continuità e veloce.

Dopo una rapida installazione, tutti i tuoi contenuti possono ora essere tradotti senza influire sulla formattazione, inclusi i contenuti generati da altre app e il processo di checkout. ConveyQuesto è uno strumento semplice per la traduzione di siti Web multilingue che non rovinerà il tuo codice, come fanno gli altri.

È disponibile anche l'opzione per ordinare traduzioni professionali del tuo sito! Ti aiuteranno a trasformare completamente il tuo sito web multilingue in uno multiculturale, migliorando drasticamente l'esperienza dei tuoi clienti. Ricorda che se traduci un sito web, devi anche avere l'assistenza clienti disponibile nella lingua del tuo nuovo cliente. Considera l'idea di investire nella localizzazione e nell'adattamento dei contenuti per garantire ai tuoi visitatori un'esperienza utente eccezionale.