Selectorul de limbă este un element important căruia ar trebui să acordați o atenție deosebită atunci când creați un site web multilingv , deoarece comutatorul de limbă este ceea ce utilizatorii îl vor vizita adesea atunci când doresc să schimbe limbile.
Un buton eficient de schimbare a limbii poate oferi mai multe beneficii pentru un site web, de la creșterea optimizării web până la creșterea vânzărilor.
În acest articol, vom discuta despre cele mai bune practici pentru proiectarea selectoarelor de limbă. Să o discutăm în continuare în articolul următor.
Ce este un selector de limbă?
Un selector de limbă este un element sau o caracteristică a interfeței cu utilizatorul care permite utilizatorilor să selecteze limba cu care doresc să interacționeze cu un site web, aplicație sau orice platformă digitală. Se găsește de obicei pe site-uri web, aplicații software și alte interfețe digitale pentru a se potrivi utilizatorilor care vorbesc diferite limbi.
Selectorul de limbă afișează, de obicei, o listă de limbi disponibile, iar utilizatorul poate selecta limba pe care o alege din acea listă. Odată selectat, conținutul interfeței, inclusiv text, etichete și uneori imagini, va fi afișat în limba selectată. Acest lucru este important în special pentru site-urile web și aplicațiile care deservesc un public global sau o bază diversă de utilizatori.
Selectorii de limbă contribuie la o experiență mai bună a utilizatorului făcând conținutul digital accesibil unui public mai larg, indiferent de nivelul lor de cunoștințe lingvistice. Ele sunt o componentă cheie a eforturilor localității, permițând dezvoltatorilor și designerilor să-și adapteze produsele la diferite contexte lingvistice și culturale.
De ce trebuie să vă personalizați comutatorul de limbă?
Personalizarea comutatorului de limbă pe un site web multilingv are câteva beneficii importante.
- Alinierea mărcii și stilul vizual: prin personalizarea comutatorului de limbă, vă puteți asigura că aspectul și stilul limbajului folosit sunt în concordanță cu brandingul și stilul vizual al site-ului dvs. Puteți personaliza butoanele sau meniurile de schimbare a limbii pentru a se potrivi cu designul general al site-ului dvs., creând coerență în experiența utilizatorului.
- Control mai mare asupra limbilor afișate: Uneori, poate doriți să limitați anumite limbi afișate în comutatorul de limbi. De exemplu, este posibil să aveți o versiune limitată a site-ului dvs. în mai multe limbi și doriți să afișați doar acele limbi în comutatorul de limbi. Personalizând comutatorul de limbi, puteți alege ce limbi sunt afișate, oferindu-vă mai mult control asupra conținutului disponibil.
- Experiență optimizată pentru utilizator: personalizând comutatorul de limbă, puteți crea o experiență optimizată pentru utilizator. De exemplu, puteți ajusta aspectul sau poziția comutatorului de limbă pentru a fi ușor de găsit de către utilizatori. De asemenea, puteți adăuga funcții, cum ar fi notificări sau instrucțiuni de schimbare a limbii, care îi ajută pe utilizatori să înțeleagă cum să folosească funcția cu ușurință.
- Îndeplinește diferite nevoi ale utilizatorilor: fiecare utilizator are preferințe de limbă diferite. Personalizând schimbarea limbii, puteți satisface nevoile utilizatorilor din diferite medii de limbă. Acestea ar putea include utilizatori locali, vizitatori internaționali sau utilizatori care se simt mai confortabil într-o altă limbă.
- Creșteți conversia vânzărilor: personalizarea corectă a comutatorului de limbi poate oferi, de asemenea, beneficiul creșterii conversiei vânzărilor. Pentru că un comutator eficient de limbi poate oferi confort utilizatorului atunci când interacționează cu site-ul dvs. web. Potrivit datelor CSA Research, 72,4% dintre consumatori au declarat că ar avea mai multe șanse să cumpere produse care au informații în propria limbă. Deci este imposibil ca și nivelul tău de vânzări să crească.
Diferite tipuri de selector de limbă
Fiecare proprietar de site va lua în considerare cu atenție cum arată selectorul de limbi, fiecare site va avea, desigur, preferințe diferite. Pentru cei dintre voi care sunt în căutarea unui tip de selector de limbă care să poată fi folosit, iată câteva dintre ele.
Butonul de limbă
Acesta este unul dintre tipurile frecvent utilizate de comutator de limbi. Butonul de limbă este de obicei o pictogramă sau un text care indică limba afișată, de exemplu, „EN” pentru engleză sau un steag de țară pentru a reprezenta o anumită limbă. Când utilizatorii fac clic pe butonul de limbă, aceștia vor fi redirecționați către versiunea site-ului web în limba corespunzătoare.
Pentru butoanele de limbă, se recomandă afișarea unui număr limitat de limbi pentru a evita un afișaj aglomerat. În general, a avea mai mult de 4 până la 5 limbi poate crea un efect vizual ocupat. Este important să poziționați butonul într-o locație vizibilă, astfel încât utilizatorii să-l poată găsi cu ușurință. Vom discuta aceste aspecte în continuare în secțiunea următoare a acestui articol.
Butoanele de limbă pot fi potrivite pentru companiile care vizează piețe specifice sau deservesc comunități internaționale din anumite locații. Un exemplu de utilizare a butonului de limbă de pe site-ul web al OMS este prezentat mai jos.
Link text
Legăturile text sunt un tip de comutare de limbă care utilizează text sub forma numelui limbii ca link. De exemplu, puteți afișa linkuri text precum „English”, „Français” sau „Español” care conduc utilizatorii la o versiune a site-ului web în limba selectată. Acest link text este de obicei plasat într-o listă sau într-un meniu derulant pentru a facilita utilizatorilor să selecteze limba dorită.
Un tip de selector de limbă pentru link este utilizat de marea companie Facebook, pe lângă limbile enumerate, puteți apăsa și pictograma (+) pentru a găsi mai multe limbi.
După aceea, pagina va fi tradusă imediat în limba selectată anterior.
Meniu de selecție
Un meniu de selecție este un tip de comutator de limbă care utilizează un meniu vertical sau un meniu deschis pentru a selecta o limbă. Când utilizatorii fac clic pe meniul de opțiuni, vor vedea o listă de limbi disponibile și pot selecta limba dorită. Meniul de opțiuni poate conține pictograme de țară sau steaguri ca indicatori de limbă, precum și nume de limbă în text.
Meniul de selecție este destul de diferit de butonul de limbă, acest tip este mai complex decât un simplu buton. Ca exemplul de mai jos care vine de pe site-ul Porsche.
Acestea oferă un site web de selecție de limbi unde utilizatorii își pot nota direct limba sau țara de destinație.
Dropdown vs. List vs. Pop-Up: Care funcționează cel mai bine?
Alegerea modelului de interacțiune adecvat pentru selectorul de limbi este crucial pentru a oferi o experiență de utilizator fără probleme și intuitivă. Fiecare metodă-indiferent dacă dropdown, lista inline sau pop-up, oferă avantaje diferite în funcție de aspectul site-ului dvs. web, numărul de limbi acceptate și comportamentul utilizatorului. Mai jos este o comparație a celor trei modele principale de interacțiune pentru selecția limbajului, concentrându -se pe UX, accesibilitatea și contextul de implementare.
Tip | Strenghts | Limitări | Cel mai bun caz de utilizare |
Scapă jos | Compact, curat, scalabil, cu multe limbi | Necesită interacțiune (faceți clic/atingeți), este posibil să nu fie evident pentru toți utilizatorii | Site-uri web cu mai multe limbi cu constrângeri spațiale |
Lista de text | Vizibil fără interacțiune, acces mai rapid pentru limbile cheie | Poate aglomera ui, nu este scalabilă pentru multe limbi | Site -uri cu 2–4 opțiuni de limbaj primar |
Pop-up | Poate include un câmp de căutare, design UI flexibil | Poate perturba fluxul utilizatorului, are nevoie de un buton de închidere clar și accesibilitate | Site globale cu 10+ limbi |
Cele mai bune practici și sfaturi pentru selectarea limbii
Proiectarea unui selector eficient de limbi implică furnizarea unei experiențe perfecte pe toate dispozitivele și asigurarea accesibilității pentru utilizatorii de diverse medii. Cu o audiență din ce în ce mai globală, comutatorul dvs. de limbă ar trebui să fie intuitiv, accesibil și receptiv pentru a se asigura că utilizatorii pot interacționa confortabil în limba preferată.
Mai jos sunt cele mai bune practici pe care le puteți aplica pentru a vă asigura că selectorul de limbi este clar, convenabil și accesibil pentru toți utilizatorii.
Prioritizează designul receptiv
Majoritatea utilizatorilor accesează site-urile web de pe dispozitive mobile, astfel încât selectorul dvs. de limbi ar trebui să fie receptiv și mobil. Asigurați -vă că butonul sau meniul este ușor de atins, nu acoperă conținut important și rămâne vizibil pe ecrane mai mici.
De exemplu, site -ul de selecție a limbii arată așa.
Apoi, atunci când priviți din partea mobilă, selectorul de limbă poate fi accesat cu ușurință și nu se mișcă sau dispare.
Utilizați meniuri derulante sau meniuri extensibile pentru a menține aspectul ordonat și asigurați -vă că țintele de atingere au suficientă distanțare pentru o interacțiune confortabilă. Acest lucru îi ajută pe utilizatori să-și selecteze ușor limba preferată, fără frustrare cauzată de elemente înghesuite sau greu de clic.
Plasare atentă în interfață
Plasați selectorul de limbi în zone extrem de vizibile, cum ar fi colțul din dreapta sus al antetului sau subsolul de jos. Acestea sunt locații intuitive în care utilizatorii caută de obicei opțiuni de limbă.
Evitați să ascundeți selectorul în icoane ambigue sau meniuri secundare. Mențineți plasarea sa consecventă pe toate paginile, astfel încât utilizatorii care schimbă limbajul frecvent o pot găsi cu ușurință în orice moment.
Utilizați atribute de accesibilitate (ARIA)
Pentru a vă asigura că selectorul dvs. de limbi este accesibil utilizatorilor cu dizabilități, utilizați atribute Aria (aplicații de internet bogate accesibile), cum ar fi Aria-Label, Aria-Haspopup și Aria Expanded. Acestea ajută tehnologiile de asistență precum cititorii de ecran să înțeleagă rolul și funcționalitatea elementului.
Implementarea accesibilității respectă standardele WCAG și asigură că site -ul dvs. este inclus și utilizabil de un public mai larg. Designul incluziv beneficiază toată lumea, nu doar utilizatorii cu nevoi specifice.
Folosiți etichete de limbaj clar și recunoscut
Afișați fiecare opțiune de limbă folosind eticheta natală, de exemplu, „español” în loc de „spaniolă” sau „deutsch” în loc de „germană”. Acest lucru permite utilizatorilor să își recunoască rapid limba preferată, chiar dacă nu înțeleg limbajul actual al site -ului.
Etichetele autohtone sunt mai incluzive și reduc încărcarea cognitivă, în special pentru utilizatorii internaționali. Evitați să folosiți prescurtări obscure sau coduri lingvistice, cu excepția cazului în care publicul dvs. le cunoaște.
Evitați supraîncărcarea cu prea multe opțiuni
Afișarea prea multor opțiuni de limbă simultan poate aglomera interfața și confunda utilizatorii. Afișați mai întâi doar cele mai relevante sau frecvent utilizate limbi și așezați restul într -un meniu derulant sau sub o secțiune „Mai multe limbi”.
Acest lucru menține interfața curată și îmbunătățește capacitatea de utilizare, în special pe mobil. Utilizați analiza traficului de site -uri pentru a decide ce limbi ar trebui să fie prioritare sau ascunse.
Folosiți pictograme și indicii vizuale adecvate (fără a vă baza pe steaguri)
Indicații vizuale precum pictogramele globului (🌐), săgeți descendente (▾) sau starea activă evidențiază îi ajută pe utilizatori să înțeleagă că un element poate fi dat clic. Cu toate acestea, evitați utilizarea steagurilor naționale pentru a reprezenta limbi, deoarece o limbă poate fi vorbită în mai multe țări.
Steagurile pot avea, de asemenea, implicații culturale sau politice. Dacă utilizați imagini, împerechează -le cu etichete de text pentru a asigura claritatea și păstrați pictogramele consistente și neutre din punct de vedere cultural în designul dvs.
Rămâneți în concordanță cu designul și brandul site -ului
Selectorul dvs. de limbi ar trebui să se alinieze vizual stilului general al site -ului dvs. web. Indiferent dacă utilizați butoane, link -uri text sau pictograme, asigurați -vă că tipografia, culorile și stările Hover se potrivesc cu brandul dvs. Acest lucru îmbunătățește încrederea și consolidează experiența utilizatorului.
Dacă construiți un selector personalizat, testați -l pe diferite browsere și dispozitive pentru a vă asigura că funcționează așa cum este prevăzut. Proiectarea constantă și funcționalitatea fiabilă contribuie la o călătorie multilingvă de utilizator.
Setarea unui selector de limbă cu Linguise în 7 pași
În acest moment, cunoașteți cele mai bune practici pentru selectatorii de limbi. Această traducere se poate face după ce utilizați serviciul de traducere a site-ului web. Cu toate acestea, nu toate serviciile de traducere oferă flexibilitate în setările selectorului de limbă.
Dar nu-ți face griji pentru că Linguise nu este așa. Linguise este un serviciu de traducere automată care oferă utilizatorului personalizarea comutatorului de limbi. Unele dintre beneficiile pe care le veți obține atunci când utilizați Linguise includ.
- Linguise poate fi folosit și integrat în peste 40 de CMS ( WordPress , Joomla , Drupal etc.).
- Traducerea în diferite limbi se va face automat în doar câteva secunde după ce adăugați limba la comutatorul de limbi de pe site.
- Există peste 80 de limbi disponibile care pot fi adăugate la selectorul de limbi.
- Linguise va pregăti automat o adresă URL unică în funcție de limba de destinație a traducerii. De exemplu, adresa URL linguise .com/de/ pentru o pagină care este tradusă în germană.
- Acesta va crea automat o adresă URL canonică pentru a evita conținutul duplicat în motoarele de căutare atunci când aveți variații de limbă pe o pagină.
- Puteți configura comutatorul de limbă în mod flexibil, în funcție de nevoile site-ului web, începând de la pictogramă și culoare până la numele limbii.
- Puteți vizualiza statisticile de vizualizare a paginii vizitatorilor în funcție de limbă, pentru fiecare limbă adăugată la selectorul de limbi.
În acest tutorial, vom folosi WordPress ca exemplu de CMS utilizat.
Pasul 1: Înregistrarea contului gratuit Linguise
Pentru a accesa comutatorul de limbă pe Linguise , primul pas pe care trebuie să-l faceți este să vă înregistrați un cont pe Linguise . Linguise oferă, de asemenea, o perioadă de încercare gratuită de o lună, care include o varietate de funcții de care puteți profita.
Pasul 2: Adăugați un domeniu pe site-ul dvs. multilingv
Al doilea pas este să adăugați domeniul site-ului web în Linguise pe care îl dețineți deja în Linguise . Există mai multe lucruri pe care trebuie să le completați, începând de la.
- Cont
- URL-uri
- Platformă
- Limba
- Limba de traducere
- Traduceți adresa URL
După aceea, trebuie să activați cheia API și să setați adresa URL a limbii. Pentru un ghid complet pentru adăugarea unui domeniu de site, puteți citi documentația, în timp ce, în special pentru WordPress , îl puteți vedea instalând traducerea automată Linguise WordPress sau urmărind tutorialul video de mai jos.
Pasul 3: Instalați pluginul Linguise
După ce ați adăugat cu succes un site web, apoi deschideți WordPress și instalați Linguise , faceți acest lucru prin Plugins > Adăugați nou > Linguise > Instalați > Activați.
Dacă pluginul este deja instalat, accesați tabloul de bord Linguise și copiați cheia API.
Apoi deschideți pluginul Linguise și inserați codul API pe care l-ați primit din tabloul de bord Linguise în coloana următoare.
Pasul 4: Configurați afișajul principal
Pentru a configura un comutator de limbă sau pentru a afișa steaguri de limbă, pașii sunt prin intermediul Linguise din meniul Setări > Afișare steaguri de limbă.
În timpul configurării inițiale, vom face ajustări la afișajul principal, ținând cont de diferitele componente.
O considerație inițială este configurarea formatului de afișare a listei de limbi, care oferă trei opțiuni din care să alegeți: alăturat, drop-down sau pop-up. În partea stângă, există un afișaj de previzualizare pentru fiecare format.
Primul format, așa cum se arată mai jos, este un aspect alăturat.
Următorul format adoptă un stil derulant, așa cum este prezentat în imaginea de mai jos.
În cele din urmă, avem formatul pop-up ca opțiune finală.
În continuare, trecem la pasul următor, care implică configurarea poziției comutatorului de limbă. Aveți flexibilitatea de a alege dintre diferite opțiuni de poziție, așa că este important să selectați o poziție care este ușor de observat de vizitatori.
În cele din urmă, trebuie să decideți asupra preferinței de combinație pentru afișarea opțiunilor de limbă. Puteți alege dintre opțiuni precum steag + nume de limbă, steag + nume scurt sau pur și simplu afișarea steagului singur. Această decizie va depinde de preferințele dvs. specifice de design și de preferințele publicului țintă.
Pasul 5: Setați designul steagului
După aceea, sub secțiunea principală de afișare, veți întâlni configurații de design special pentru steag. Imaginea de mai jos demonstrează unele dintre opțiunile de setare disponibile.
- Afișarea numelui limbii : aveți opțiunea de a afișa numele limbii în funcție fie de țară, fie de limba în sine. De exemplu, puteți alege să afișați „Germană” sau „Deutsch”.
- Tip de steag engleză: această opțiune este aplicabilă atunci când se lucrează cu limbi care au mai multe variante, cum ar fi „Engleză SUA” sau „Engleză Marea Britanie”. Alegeri similare pot fi făcute pentru limbi precum spaniolă, taiwaneză, germană și portugheză.
- Stilul steagului: această setare vă permite să definiți forma pictogramei steagului, indiferent dacă ar trebui să fie rotundă sau pătrată (dreptunghiulară).
Pasul 6: Setați culoarea și dimensiunea steagului
Odată ce designul steagului este configurat, următorul pas implică ajustarea culorilor, mărimii și diferitelor alte elemente. În următoarea interfață, veți găsi numeroase setări personalizabile, inclusiv:
- Raza chenarului steagului: Aceasta vă permite să personalizați raza chenarului în pixeli atunci când utilizați un steag dreptunghiular.
- Culoarea numelui limbii: puteți selecta culoarea implicită a textului pentru numele limbii.
- Culoarea limbii pop-up: această setare determină culoarea titlului limbii în zonele pop-up sau drop-down.
- Mărimea steagului: aveți opțiunea de a modifica dimensiunea steagului în funcție de preferințele dvs.
- Culoarea cursorului numelui limbii: această setare controlează culoarea textului atunci când treceți mouse-ul peste numele limbii.
- Culoarea cursorului limbii pop-up: în mod similar, această setare determină culoarea textului atunci când treceți mouse-ul peste titlul limbii în meniul pop-up sau drop-down.
Pasul 7: Setați flag box-shadow
În faza finală, aveți posibilitatea de a personaliza setările de umbră pentru steag. Setarea inițială vă permite să specificați o umbră pentru fiecare steag afișat pe site-ul dvs. web, în timp ce setarea ulterioară se referă la efectul de umbră atunci când treceți cu mouse-ul deasupra steagului limbii.
Nu uitați să faceți clic pe Salvare pentru a păstra setările de personalizare pe care le-ați făcut pentru comutatorul de limbă. Acest lucru asigură că configurațiile selectate pentru efectele de umbră sunt implementate și salvate pentru utilizare ulterioară.
După ce au fost efectuate toate configurațiile, iată un exemplu de afișare a selectorului de limbă folosind un pop-up, poziționat în colțul din dreapta sus și folosind inițiale. Acesta este doar un exemplu, restul îl puteți personaliza după cum doriți și în funcție de nevoile site-ului.
În afară de WordPress CMS, puteți utiliza și alte platforme de site-uri web și puteți urma ghidul detaliat, cum ar fi comutatorul de configurare pentru OpenCart , comutatorul de limbă pentru Drupal și comutatorul de setare pentru PrestaShop .
Proiectați-vă selectorul de limbi pentru o experiență multilingvă perfectă cu Linguise!
Aici, ați obținut informații despre cele mai bune practici pentru proiectarea selectoarelor de limbi și cum să faceți acest lucru folosind Linguise! Crede-mă, crearea unui comutator de limbi poate oferi multe beneficii și poate asigura optimizarea pe baza punctelor menționate mai sus.
Când creați un selector de limbă, asigurați-vă că urmați sfaturile și cele mai bune practici pe care le-am explicat mai sus, începând de la utilizarea pictogramelor și selectarea limbilor relevante până la poziționare.
Acum, înregistrați un cont Linguise , adăugați site-ul dvs. și ajustați selectorul de limbă pentru a oferi o experiență mai bună pentru utilizator. Nu uitați să încercați funcția de încercare gratuită de 1 lună pentru a vă bucura de funcțiile superioare ale Linguise
