Sprogvælgeren er et vigtigt element, som du bør være meget opmærksom på, når du opretter en flersproget hjemmeside, fordi sprogskifteren er det, som brugere ofte vil besøge, når de vil skifte sprog.
En effektiv sprogskiftknap kan give flere fordele for en hjemmeside, lige fra øget weboptimering til øget salg.
I denne artikel vil vi diskutere bedste praksis for design af sprogvælgere. Lad os diskutere det yderligere i den følgende artikel.
Hvad er en sprogvælger?
En sprogvælger er et brugergrænsefladeelement eller -funktion, der giver brugerne mulighed for at vælge det sprog, som de ønsker at interagere med et websted, en applikation eller enhver digital platform med. Det findes almindeligvis på websteder, softwareapplikationer og andre digitale grænseflader, der passer til brugere, der taler forskellige sprog.
Sprogvælgeren viser normalt en liste over tilgængelige sprog, og brugeren kan vælge sproget efter eget valg fra denne liste. Når det er valgt, vil grænsefladeindhold, inklusive tekst, etiketter og nogle gange billeder, blive vist på det valgte sprog. Dette er især vigtigt for websteder og apps, der tjener et globalt publikum eller forskelligartet brugerbase.
Sprogvælgere bidrager til en bedre brugeroplevelse ved at gøre digitalt indhold tilgængeligt for et bredere publikum, uanset deres sproglige niveau. De er en nøglekomponent i lokalitetsbestræbelser, der giver udviklere og designere mulighed for at tilpasse deres produkter til forskellige sproglige og kulturelle kontekster.
Hvorfor skal du tilpasse din sprogskifter?
Tilpasning af sprogskifteren på et flersproget websted har flere vigtige fordele.
- Brandtilpasning og visuel stil: Ved at tilpasse sprogskifteren kan du sikre, at udseendet og stilen på det anvendte sprog stemmer overens med dit websteds branding og visuelle stil. Du kan tilpasse sprogskiftknapper eller menuer, så de passer til det overordnede design af din hjemmeside, hvilket skaber ensartethed i brugeroplevelsen.
- Større kontrol over viste sprog: Nogle gange vil du måske begrænse visse sprog, der vises i sprogskifteren. For eksempel kan du have en begrænset version af dit websted på flere sprog, og du ønsker kun at vise disse sprog i sprogskifteren. Ved at tilpasse sprogskifteren kan du vælge, hvilke sprog der skal vises, hvilket giver dig mere kontrol over det tilgængelige indhold.
- Optimeret brugeroplevelse: Ved at tilpasse sprogskifteren kan du skabe en optimeret brugeroplevelse. For eksempel kan du justere layoutet eller placeringen af sprogskifteren for at gøre det nemt for brugerne at finde. Du kan også tilføje funktioner såsom meddelelser eller sprogskifte-instruktioner, der hjælper brugerne med at forstå, hvordan de nemt kan bruge funktionen.
- Opfyld forskellige brugerbehov: Hver bruger har forskellige sprogpræferencer. Ved at tilpasse sprogskift kan du opfylde behovene hos brugere med forskellige sprogbaggrunde. Dette kan omfatte lokale brugere, internationale besøgende eller brugere, der er mere komfortable på et andet sprog.
- Øg salgskonvertering: Korrekt tilpasning af sprogskifter kan også give fordelen ved at øge salgskonverteringen. Fordi en effektiv sprogskifter kan give brugerkomfort, når de interagerer med dit websted. Ifølge CSA Research-data sagde 72,4% af forbrugerne, at de ville være mere tilbøjelige til at købe produkter, der havde information på deres eget sprog. Så det er umuligt, at dit salgsniveau også stiger.
Forskellige typer sprogvælger
Hver hjemmesideejer vil helt sikkert overveje nøje, hvordan deres sprogvælger ser ud, hver hjemmeside vil selvfølgelig have forskellige præferencer. Til dig, der leder efter en type sprogvælger, der kan bruges, er her nogle af dem.
Sprog knap
Dette er en af de almindeligt anvendte typer sprogskifter. Sprogknappen er normalt et ikon eller en tekst, der angiver det sprog, der vises, for eksempel "EN" for engelsk eller et landsflag for at repræsentere et bestemt sprog. Når brugere klikker på sprogknappen, vil de blive omdirigeret til versionen af hjemmesiden på det relevante sprog.
For sprogknapper anbefales det at vise et begrænset antal sprog for at undgå et rodet display. Generelt kan det skabe en travl visuel effekt at have mere end 4 til 5 sprog. Det er vigtigt at placere knappen et synligt sted, så brugerne nemt kan finde den. Vi vil diskutere disse aspekter yderligere i det næste afsnit af denne artikel.
Sprogknapper kan være velegnede til virksomheder, der målretter mod bestemte markeder eller betjener internationale samfund på bestemte steder. Et eksempel på brug af sprogknappen på WHO's hjemmeside er som nedenfor.
Tekstlink
Tekstlinks er en type sprogskifter, der bruger tekst i form af sprognavnet som et link. For eksempel kan du vise tekstlinks som "engelsk", "français" eller "español", der fører brugere til en version af webstedet på det valgte sprog. Dette tekstlink placeres normalt i en liste eller rullemenu for at gøre det nemmere for brugerne at vælge det ønskede sprog.
Én type linksprogvælger bruges af det store firma Facebook, udover de angivne sprog kan du også trykke på (+)-ikonet for at finde flere sprog.
Derefter vil siden straks blive oversat til det tidligere valgte sprog.
Valgmenu
En valgmenu er en type sprogskifter, der bruger en rullemenu eller åben menu til at vælge et sprog. Når brugere klikker på indstillingsmenuen, vil de se en liste over tilgængelige sprog og kan vælge det ønskede sprog. Indstillingsmenuen kan indeholde landeikoner eller flag som sprogindikatorer samt sprognavne i teksten.
Valgmenuen er helt anderledes end sprogknappen, denne type er mere kompleks end blot en knap. Som eksemplet nedenfor som kommer fra Porsches hjemmeside.
De tilbyder et sprogvælgerwebsted, hvor brugere direkte kan skrive deres sprog eller destinationsland ned.
Dropdown vs. List vs. Pop-Up: Hvilken fungerer bedst?
At vælge den rigtige interaktionsmodel til din sprogvælger er afgørende for at levere en problemfri og intuitiv brugeroplevelse. Hver metode-hvad enten dropdown, inline-liste eller pop-up giver forskellige fordele afhængigt af dit websteds layout, antal understøttede sprog og brugeradfærd. Nedenfor er en sammenligning af de tre vigtigste interaktionsmodeller til sprogvalg, der fokuserer på UX, tilgængelighed og implementeringskontekst.
Type | Strenghts | Begrænsninger | Bedste brugssag |
Dropdown | Kompakt, ren, skalerbar med mange sprog | Kræver interaktion (klik/tap), er muligvis ikke indlysende for alle brugere | Multipropswebsteder med pladsbegrænsninger |
Tekstliste | Synlig uden interaktion, hurtigere adgang til nøglesprog | Kan rodet brugergrænseflade, ikke skalerbar for mange sprog | Websteder med 2–4 primære sprogindstillinger |
Pop-up | Kan omfatte et søgefelt, fleksibelt UI -design | Kan forstyrre brugerstrømmen, har brug for en klar tæt knap og tilgængelighed | Globale websteder med 10+ sprog |
Sprogvælger bedste praksis og tips
At designe en effektiv sprogvælger involverer at levere en problemfri oplevelse på tværs af alle enheder og sikre tilgængelighed for brugere af forskellige baggrunde. Med et stadig mere globalt publikum skal din sprogafbryder være intuitiv, tilgængelig og lydhør for at sikre, at brugerne kan interagere komfortabelt på deres foretrukne sprog.
Nedenfor er bedste praksis, du kan anvende for at sikre, at din sprogvælger er klar, praktisk og tilgængelig for alle brugere.
Prioritere responsivt design
De fleste brugere får adgang til websteder fra mobile enheder, så din sprogvælger skal være lydhør og mobilvenlig. Sørg for, at knappen eller menuen er let at trykke på, dækker ikke vigtigt indhold og forbliver synlig på mindre skærme.
F.eks. Ser Sprogvælgerwebstedet sådan ud.
Derefter, når man ser fra den mobile side, kan sprogvælgeren stadig fås let og ikke bevæger sig eller forsvinder.
Brug dropdowns eller udvidelige menuer til at holde layoutet ryddeligt, og sikre, at berøringsmål har nok afstand til behagelig interaktion. Dette hjælper brugerne med at vælge deres foretrukne sprog let uden frustration forårsaget af trange eller vanskelige at klikke på elementer.
Tankevækkende placering i grænsefladen
Placer sprogvælgeren i meget synlige, forventede områder såsom øverste højre hjørne af overskriften eller den nederste sidefod. Dette er intuitive placeringer, hvor brugere typisk leder efter sprogindstillinger.
Undgå at skjule vælgeren inde i tvetydige ikoner eller sekundære menuer. Hold placeringen konsistent på tværs af alle sider, så brugere, der skifter sprog, ofte kan finde det let når som helst.
Brug tilgængelighedsattributter (ARIA)
For at sikre, at din sprogvælger er tilgængelig for brugere med handicap, skal du bruge ARIA (tilgængelige rige internetapplikationer) attributter som Aria-Label, Aria-Haspopup og ARIA-ekspanderede. Disse hjælper hjælpemidler som skærmlæsere forstår elementets rolle og funktionalitet.
Implementering af tilgængelighed opfylder WCAG -standarder og sikrer, at dit websted er inkluderende og anvendeligt af et bredere publikum. Inkluderende design gavner alle, ikke kun brugere med specifikke behov.
Brug klare og genkendelige sprogetiketter
Vis hver sprogindstilling ved hjælp af dets oprindelige label, for eksempel "Español" i stedet for "spansk" eller "Deutsch" i stedet for "tysk." Dette giver brugerne mulighed for hurtigt at genkende deres foretrukne sprog, selvom de ikke forstår det aktuelle stedsprog.
Indfødte etiketter er mere inkluderende og reducerer kognitiv belastning, især for internationale brugere. Undgå at bruge uklare forkortelser eller sprogkoder, medmindre dit publikum kender dem.
Undgå overbelastning med for mange muligheder
At vise for mange sprogindstillinger på én gang kan rodet grænsefladen og forvirre brugerne. Vis kun de mest relevante eller almindeligt anvendte sprog først, og placer resten i en dropdown -menu eller under et "flere sprog" -sektion.
Dette holder grænsefladen ren og forbedrer anvendeligheden, især på mobil. Brug webstedets trafikanalyse til at beslutte, hvilke sprog der skal prioriteres eller skjules.
Brug passende ikoner og visuelle signaler (uden at stole på flag)
Visuelle signaler som Globe Icons (🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 ▾ 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 ▾ ▾ ▾ ▾ 🌐 🌐 🌐 🌐 ▾ ▾ 🌐 🌐 🌐 ▾ ▾ ▾ ▾ 🌐 ▾ ▾ 🌐 ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ 🌐 🌐 🌐 🌐 ▾ 🌐 🌐 🌐 🌐 ▾ 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 ▾ 🌐 🌐 ▾ ▾ 🌐 ▾ 🌐 ▾ 🌐 ▾ 🌐 ▾ 🌐 ▾ 🌐 ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ ▾ 🌐 ▾ ▾ ▾ ▾) Undgå dog at bruge nationale flag til at repræsentere sprog, da et sprog kan tales i flere lande.
Flag kan også have kulturelle eller politiske konsekvenser. Hvis du bruger visuals, skal du parre dem med tekstetiketter for at sikre klarhed og holde ikoner konsistente og kulturelt neutrale på tværs af dit design.
Bliv i overensstemmelse med webstedsdesign og branding
Din sprogvælger skal visuelt tilpasse sig dit websteds overordnede stil. Uanset om du bruger knapper, tekstlink eller ikoner, skal du sikre dig, at typografi, farver og svæver stater matcher dit branding. Dette forbedrer tilliden og styrker brugeroplevelsen.
Hvis du bygger en brugerdefineret vælger, skal du teste den på tværs af forskellige browsere og enheder for at sikre, at den fungerer som tilsigtet. Konsekvent design og pålidelig funktionalitet bidrager til en problemfri flersproget brugerrejse.
Indstilling af en sprogvælger med Linguise i 7 trin
På dette tidspunkt kender du bedste praksis for sprogvælgere. Denne oversættelse kan udføres, når du har brugt webstedets oversættelsestjeneste. Det er dog ikke alle oversættelsestjenester, der giver fleksibilitet i sprogvælgerindstillinger.
Men du skal ikke bekymre dig, for Linguise er ikke sådan. Linguise er en automatisk oversættelsestjeneste, der giver brugertilpasning af sprogskifteren. Nogle af de fordele, du vil få, når du bruger Linguise inkluderer.
- Linguise kan bruges og integreres i mere end 40 CMS ( WordPress , Joomla , Drupal , osv.).
- Oversættelse til forskellige sprog vil blive udført automatisk på få sekunder, efter du har tilføjet sproget til sprogskifteren på hjemmesiden.
- Der er mere end 80 sprog tilgængelige , som kan føjes til sprogvælgeren.
- Linguise vil automatisk udarbejde en unik URL i henhold til oversættelsesdestinationssproget. For eksempel URL'en linguise .com/de/ for en side, der er ved at blive oversat til tysk.
- Det vil automatisk oprette en kanonisk URL for at hjælpe med at undgå duplikeret indhold i søgemaskiner, når du har sprogvariationer på en side.
- Du kan konfigurere sprogskifter fleksibelt i henhold til webstedets behov, startende fra ikonet og farven til sprognavnet.
- Du kan se statistik for besøgende sidevisning pr. sprog for hvert sprog, der er tilføjet sprogvælgeren.
I denne vejledning vil vi bruge WordPress som et eksempel på det anvendte CMS.
Trin 1: Registrering af Linguise gratis konto
For at få adgang til sprogskifteren på Linguise er det første trin, du skal gøre, at registrere en konto på Linguise . Linguise tilbyder også en gratis prøveperiode på en måned, som inkluderer en række funktioner, du kan drage fordel af.
Trin 2: Tilføj domæne til din flersprogede hjemmeside
Det andet trin er at tilføje webstedsdomænet i Linguise , som du allerede ejer, til Linguise dashboardet. Der er flere ting, du skal udfylde, startende fra.
- Konto
- URL'er
- Platform
- Sprog
- Oversættelsessprog
- Oversæt URL
Derefter skal du aktivere API-nøglen og indstille sprogets URL. For en komplet guide til at tilføje et webstedsdomæne kan du læse dokumentationen, mens du specifikt til WordPress kan se den ved at installere Linguise automatisk oversættelse på WordPress eller se videovejledningen nedenfor.
Trin 3: Installer plugin'et Linguise
Når du har tilføjet et websted, skal du åbne WordPress dashboardet og installere Linguise pluginnet, gør dette ved at bruge Plugins > Tilføj nyt > Linguise > Installer > Aktiver.
Hvis plugin'et allerede er installeret, skal du gå til Linguise dashboardet og kopiere API-nøglen.
Åbn derefter Linguise pluginnet, og indsæt API-koden, som du fik fra Linguise -dashboardet, i den følgende kolonne.
Trin 4: Konfigurer hoveddisplayet
For at konfigurere en sprogskifter eller vise sprogflag, er trinene via Linguise dashboardet i menuen Indstillinger > Visningsmenu for sprogflag.
Under den indledende opsætning vil vi foretage justeringer af hoveddisplayet under hensyntagen til de forskellige komponenter.
En indledende overvejelse er konfigurationen af sproglistens visningsformat, som tilbyder tre muligheder at vælge imellem: side-by-side, dropdown eller popup. På venstre side er der en forhåndsvisning for hvert format.
Det første format, som vist nedenfor, er et side-by-side layout.
Følgende format anvender en dropdown-stil, som vist på billedet nedenfor.
Til sidst har vi popup-formatet som den sidste mulighed.
Dernæst går vi videre til næste trin, som involverer konfiguration af sprogskifterens position. Du har fleksibiliteten til at vælge mellem forskellige positionsmuligheder, så det er vigtigt at vælge en position, der er let mærkbar for besøgende.
Til sidst skal du beslutte dig for kombinationspræferencen for visning af sprogindstillingerne. Du kan vælge mellem muligheder som flag + sprognavn, flag + kort navn eller blot at vise flaget alene. Denne beslutning vil afhænge af dine specifikke designpræferencer og din målgruppes præferencer.
Trin 5: Indstil flagdesign
Derefter vil du under hoveddisplaysektionen støde på designkonfigurationer specifikt til flaget. Billedet nedenfor viser nogle af de tilgængelige indstillingsmuligheder.
- Visning af sprognavn : Du har mulighed for at vise sprognavnet baseret på enten landet eller selve sproget. Du kan f.eks. vælge at vise "Tysk" eller "Tysk".
- Engelsk flagtype: Denne mulighed er anvendelig, når der er tale om sprog, der har flere variationer, såsom "English USA" eller "English Britain." Lignende valg kan foretages for sprog som spansk, taiwansk, tysk og portugisisk.
- Flagstil: Denne indstilling giver dig mulighed for at definere formen på flagikonet, om det skal være rundt eller firkantet (rektangulært).
Trin 6: Indstil flagets farve og størrelse
Når flagdesignet er sat op, involverer næste trin justering af farver, størrelse og forskellige andre elementer. I den følgende grænseflade finder du adskillige indstillinger, der kan tilpasses, herunder:
- Flag kant-radius: Dette giver dig mulighed for at personliggøre kantradius i pixels, når du bruger et rektangulært flag.
- Sprognavnsfarve: Du kan vælge standardtekstfarven for sprognavnet.
- Popup-sprogfarve: Denne indstilling bestemmer farven på sprogtitlen i pop op- eller dropdown-områderne.
- Flagstørrelse: Du har mulighed for at ændre størrelsen på flaget i henhold til dine præferencer.
- Svævefarve på sprognavn: Denne indstilling styrer tekstfarven, når du holder musen over sprognavne.
- Popup-sprog-hoverfarve: På samme måde bestemmer denne indstilling tekstfarven, når du holder musen over sprogtitlen i pop op- eller rullemenuen.
Trin 7: Indstil flag box-shadow
I den afsluttende fase har du mulighed for at tilpasse skyggeindstillingerne for flaget. Den oprindelige indstilling giver dig mulighed for at angive en skygge for hvert flag, der vises på dit websted, mens den efterfølgende indstilling vedrører skyggeeffekten, når du holder musemarkøren over sprogflaget.
Husk at klikke på Gem for at bevare de tilpasningsindstillinger, du har lavet for sprogskifteren. Dette sikrer, at dine valgte konfigurationer for skyggeeffekterne implementeres og gemmes til fremtidig brug.
Efter at alle konfigurationer er blevet udført, er her et eksempel på sprogvælgervisningen ved hjælp af en popup, placeret i øverste højre hjørne, og med initialer. Dette er blot et eksempel, du kan tilpasse resten som du ønsker og efter hjemmesidens behov.
Bortset fra WordPress CMS kan du også bruge andre webstedsplatforme og følge den detaljerede vejledning, såsom opsætningsskifter til OpenCart , sprogskifter til Drupal og indstillingsskifter til PrestaShop .
Design din sprogvælger til en problemfri flersproget oplevelse med Linguise!
Her har du fået indsigt i bedste praksis for design af sprogvælgere, og hvordan du gør det ved hjælp af Linguise! Tro mig, at oprette en sprogskifter kan give mange fordele og sikre optimering baseret på ovenstående punkter.
Når du opretter en sprogvælger, skal du sørge for at følge de tips og bedste fremgangsmåder, som vi har forklaret ovenfor, fra at bruge ikoner og vælge relevante sprog til placering.
Registrer nu Linguise konto , tilføj dit websted, og finjuster sprogvælgeren for at give en bedre brugeroplevelse. Glem ikke at prøve 1-måneders gratis prøvefunktion for at nyde Linguise overlegne funktioner!
