Best practices voor het ontwerpen van de taalkiezer

Best practices voor het ontwerpen van de taalkiezer
Inhoudsopgave

De taalkiezer is een belangrijk element waar u goed op moet letten bij het maken van een meertalige website , omdat gebruikers vaak de taalwisselaar zullen bezoeken als ze van taal willen wisselen.

Een effectieve taalwisselknop kan verschillende voordelen voor een website bieden, van het verhogen van weboptimalisatie tot het verhogen van de omzet.

In dit artikel bespreken we best practices voor het ontwerpen van taalkiezers. Laten we het verder bespreken in het volgende artikel.

Wat is een taalkiezer?

Best practices voor het ontwerpen van de taalkiezer

Een taalkiezer is een gebruikersinterface-element of -functie waarmee gebruikers de taal kunnen selecteren waarmee ze willen communiceren met een website, applicatie of een ander digitaal platform. Het wordt vaak aangetroffen op websites, softwareapplicaties en andere digitale interfaces, geschikt voor gebruikers die verschillende talen spreken.

De taalkiezer geeft doorgaans een lijst met beschikbare talen weer, en de gebruiker kan uit die lijst de taal van zijn keuze selecteren. Eenmaal geselecteerd, wordt de interface-inhoud, inclusief tekst, labels en soms afbeeldingen, weergegeven in de geselecteerde taal. Dit is vooral belangrijk voor websites en apps die een wereldwijd publiek of een diverse gebruikersbasis bedienen.

Taalkiezers dragen bij aan een betere gebruikerservaring door digitale inhoud toegankelijk te maken voor een breder publiek, ongeacht hun taalvaardigheidsniveau. Ze vormen een belangrijk onderdeel van lokale inspanningen, waardoor ontwikkelaars en ontwerpers hun producten kunnen aanpassen aan verschillende taalkundige en culturele contexten.

Waarom moet u uw taalwisselaar aanpassen?

Best practices voor het ontwerpen van de taalkiezer

Het aanpassen van de taalwisselaar op een meertalige website heeft verschillende belangrijke voordelen.

  • Merkuitlijning en visuele stijl: Door de taalwisselaar aan te passen, kunt u ervoor zorgen dat het uiterlijk en de stijl van de gebruikte taal consistent zijn met de branding en visuele stijl van uw website. U kunt taalwisselknoppen of menu's aanpassen aan het algemene ontwerp van uw website, waardoor consistentie in de gebruikerservaring ontstaat.
  • Grotere controle over weergegeven talen: Soms wilt u misschien bepaalde talen beperken die worden weergegeven in de taalwisselaar. Het kan bijvoorbeeld zijn dat u een beperkte versie van uw website in meerdere talen heeft, en dat u alleen die talen wilt weergeven in de taalwisselaar. Door de taalwisselaar aan te passen, kun je kiezen welke talen worden weergegeven, waardoor je meer controle hebt over de beschikbare inhoud.
  • Geoptimaliseerde gebruikerservaring: Door de taalwisselaar aan te passen, kunt u een geoptimaliseerde gebruikerservaring creëren. U kunt bijvoorbeeld de lay-out of positie van de taalwisselaar aanpassen, zodat gebruikers deze gemakkelijk kunnen vinden. U kunt ook functies toevoegen, zoals meldingen of instructies voor het wisselen van taal, zodat gebruikers begrijpen hoe ze de functie eenvoudig kunnen gebruiken.
  • Voldoe aan verschillende gebruikersbehoeften: Elke gebruiker heeft verschillende taalvoorkeuren. Door de taalwisseling aan te passen, kunt u voldoen aan de behoeften van gebruikers met verschillende taalachtergronden. Dit kunnen lokale gebruikers, internationale bezoekers of gebruikers zijn die zich prettiger voelen in een andere taal.
  • Verhoog de verkoopconversie: een goede aanpassing van de taalwisselaar kan ook het voordeel bieden dat de verkoopconversie wordt verhoogd. Omdat een effectieve taalwisselaar gebruikerscomfort kan bieden bij de interactie met uw website. Volgens gegevens van CSA Research zei 72,4% van de consumenten dat ze eerder producten zouden kopen die informatie in hun eigen taal bevatten. Het is dus onmogelijk dat jouw omzetniveau ook stijgt.

Verschillende soorten taalkiezers

Elke website-eigenaar zal zeker goed nadenken over hoe zijn taalkiezer eruit ziet, elke website zal uiteraard andere voorkeuren hebben. Voor degenen onder u die op zoek zijn naar een type taalkiezer die gebruikt kan worden, hier zijn er enkele.

Taalknop

Dit is een van de meest gebruikte typen taalwisselaars. De taalknop is meestal een pictogram of tekst die de taal aangeeft die wordt weergegeven, bijvoorbeeld 'EN' voor Engels of een landvlag die een specifieke taal vertegenwoordigt. Wanneer gebruikers op de taalknop klikken, worden ze doorgestuurd naar de versie van de website in de juiste taal.

Voor taalknoppen wordt aanbevolen om een ​​beperkt aantal talen weer te geven om een ​​rommelige weergave te voorkomen. Over het algemeen kan het hebben van meer dan 4 tot 5 talen een druk visueel effect creëren. Het is belangrijk om de knop op een zichtbare plaats te plaatsen, zodat gebruikers deze gemakkelijk kunnen vinden. We zullen deze aspecten verder bespreken in de volgende sectie van dit artikel.

Taalknoppen kunnen geschikt zijn voor bedrijven die zich op specifieke markten richten of internationale gemeenschappen op bepaalde locaties bedienen. Een voorbeeld van het gebruik van de taalknop op de WHO-website is hieronder.

Best practices voor het ontwerpen van taalkiezer-WHO

Tekstlink

Tekstlinks zijn een soort taalwisselaar die tekst in de vorm van de taalnaam als link gebruikt. U kunt bijvoorbeeld tekstlinks weergeven, zoals 'Engels', 'Français' of 'Español', waarmee gebruikers naar een versie van de website in de geselecteerde taal worden geleid. Deze tekstlink wordt meestal in een lijst of vervolgkeuzemenu geplaatst, zodat gebruikers gemakkelijker de gewenste taal kunnen selecteren.

Best practices voor het ontwerpen van de taalkiezer

Eén type linktaalkiezer wordt gebruikt door het grote bedrijf Facebook, naast de vermelde talen kunt u ook op het (+) pictogram drukken om meer talen te vinden.

Daarna wordt de pagina onmiddellijk vertaald in de eerder geselecteerde taal.



Selectiemenu

Een selectiemenu is een soort taalwisselaar die een vervolgkeuzemenu of een open menu gebruikt om een ​​taal te selecteren. Wanneer gebruikers op het optiemenu klikken, zien ze een lijst met beschikbare talen en kunnen ze de gewenste taal selecteren. Het optiemenu kan landpictogrammen of vlaggen bevatten als taalindicatoren, evenals taalnamen in de tekst.

Het keuzemenu is behoorlijk anders dan de taalknop, dit type is complexer dan alleen een knop. Zoals onderstaand voorbeeld dat afkomstig is van de website van Porsche.

Ze bieden een taalkiezerwebsite waar gebruikers direct hun taal of land van bestemming kunnen noteren.

Best practices voor het ontwerpen van de taalkiezer

Dropdown vs. lijst versus pop-up: welke werkt het beste?

Best practices voor het ontwerpen van de taalkiezer

Het kiezen van het juiste interactiemodel voor uw taalkiezer is cruciaal voor het leveren van een naadloze en intuïtieve gebruikerservaring. Elke methode-of het nu gaat om vervolgkeuzelijst, inline lijst of pop-up, biedt verschillende voordelen, afhankelijk van de lay-out van uw website, aantal ondersteunde talen en gebruikersgedrag. Hieronder is een vergelijking van de drie belangrijkste interactiemodellen voor taalselectie, gericht op UX, toegankelijkheid en implementatiecontext.

Type

Strenge

Beperkingen

Beste use case

Laten vallen

Compact, schoon, schaalbaar, met veel talen

Vereist interactie (klik/tik), is misschien niet duidelijk voor alle gebruikers

Websites met meerdere taal met ruimtebeperkingen

Tekstlijst

Zichtbaar zonder interactie, snellere toegang voor belangrijke talen

Kan rommel ui, niet schaalbaar voor veel talen

Sites met 2–4 primaire taalopties

Pop-up

Kan een zoekveld bevatten, flexibel UI -ontwerp

Kan de gebruikersstroom verstoren, heeft een duidelijke knop en toegankelijkheid nodig

Globale sites met meer dan 10 talen

Best practices en tips voor de taalkiezer

Best practices voor het ontwerpen van de taalkiezer

Het ontwerpen van een effectieve taalkiezer omvat het leveren van een naadloze ervaring op alle apparaten en het waarborgen van de toegankelijkheid voor gebruikers met verschillende achtergronden. Met een steeds meer wereldwijd publiek moet uw taalschakelaar intuïtief, toegankelijk en responsief zijn om ervoor te zorgen dat gebruikers comfortabel kunnen communiceren in hun voorkeurstaal.

Hieronder staan best practices die u kunt toepassen om ervoor te zorgen dat uw taalkiezer duidelijk, handig en toegankelijk is voor alle gebruikers.

Prioriteer het responsieve ontwerp

De meeste gebruikers hebben toegang tot websites van mobiele apparaten, dus uw taalkiezer moet responsief en mobielvriendelijk zijn. Zorg ervoor dat het knop of het menu eenvoudig is om op te tikken, dekt geen belangrijke inhoud en blijft zichtbaar op kleinere schermen.

De website van de taalkiezers ziet er bijvoorbeeld zo uit.

Screenshot van Linguise -website -weergave op computerscherm.

Wanneer u vanaf de mobiele kant kijkt, is de taalkiezer nog steeds gemakkelijk toegankelijk en is niet beweegt of verdwijnt.

Screenshot van Linguise -interface op mobiel apparaat. Gemakkelijke talen voor taalvertaling.

Gebruik vervolgkeuzemen of uitbreidbare menu's om de lay -out netjes te houden en zorg ervoor dat aanraakdoelen voldoende afstand hebben voor comfortabele interactie. Dit helpt gebruikers hun voorkeurstaal gemakkelijk te selecteren zonder frustratie veroorzaakt door krappe of moeilijk te klikken elementen.

Doordachte plaatsing in de interface

Plaats de taalkiezer in zeer zichtbare, verwachte gebieden zoals de rechterbovenhoek van de koptekst of de onderste voettekst. Dit zijn intuïtieve locaties waar gebruikers meestal op zoek zijn naar taalopties.

Verberg de selector niet in dubbelzinnige pictogrammen of secundaire menu's. Houd de plaatsing consistent op alle pagina's, zodat gebruikers die vaak van talen veranderen, het op elk gewenst moment gemakkelijk kunnen vinden.

Gebruik toegankelijkheidskenmerken (ARIA)

Om ervoor te zorgen dat uw taalkiezer toegankelijk is voor gebruikers met een handicap, gebruikt u ARIA-attributen (toegankelijke rijke internettoepassingen) zoals Aria-Label, Aria-Haspopup en ARIA-uitgereikt. Deze helpen bij het helpen van assistieve technologieën zoals schermlezers begrijpen de rol en functionaliteit van het element.

Afbeelding dat het belang van aria-label illustreert voor toegankelijkheid

Het implementeren van toegankelijkheid voldoet aan WCAG -normen en zorgt ervoor dat uw site inclusief en bruikbaar is door een breder publiek. Inclusieve ontwerp komt iedereen ten goede, niet alleen gebruikers met specifieke behoeften.

Gebruik duidelijke en herkenbare taallabels

Geef elke taaloptie weer met behulp van het native label, bijvoorbeeld "Español" in plaats van "Spaans" of "Deutsch" in plaats van "Duits". Hierdoor kunnen gebruikers snel hun voorkeurstaal herkennen, zelfs als ze de huidige sitetaal niet begrijpen.

Native -labels zijn meer inclusief en verminderen de cognitieve belasting, vooral voor internationale gebruikers. Vermijd het gebruik van obscure afkortingen of taalcodes, tenzij uw publiek ze kent.

Vermijd overbelasting met te veel opties

Te veel taalopties tegelijk laten zien, kan de interface rommelig maken en gebruikers verwarren. Geef eerst alleen de meest relevante of veelgebruikte talen weer en plaats de rest in een vervolgkeuzemenu of onder een gedeelte "meer talen".

Dit houdt de interface schoon en verbetert de bruikbaarheid, vooral op mobiel. Gebruik websiteverkeersanalyses om te beslissen welke talen prioriteit moeten hebben of verborgen moeten worden.

Gebruik geschikte pictogrammen en visuele aanwijzingen (zonder op vlaggen te vertrouwen)

Visuele aanwijzingen zoals globe -pictogrammen (🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐 🌐) Vermijd het gebruik van nationale vlaggen echter om talen te vertegenwoordigen, omdat in meerdere landen één taal kan worden gesproken.

Een globe -pictogram dat taal en vertaling vertegenwoordigt, die globale communicatie symboliseert.

Vlaggen kunnen ook culturele of politieke implicaties hebben. Als u visuals gebruikt, koppelt u ze met tekstlabels om duidelijkheid te garanderen en pictogrammen consistent en cultureel neutraal te houden in uw ontwerp.

Blijf consistent met websiteontwerp en branding

Uw taalkiezer moet visueel afstemmen op de algemene stijl van uw website. Of het nu gaat om knoppen, tekstlinks of pictogrammen, zorg ervoor dat typografie, kleuren en hoverstaten overeenkomen met uw branding. Dit verbetert het vertrouwen en versterkt de gebruikerservaring.

Als u een aangepaste selector bouwt, test u deze op verschillende browsers en apparaten om ervoor te zorgen dat deze werkt zoals bedoeld. Consistente ontwerp- en betrouwbare functionaliteit dragen bij aan een naadloze meertalige gebruikersreis.

Doorbreek taalbarrières
Zeg vaarwel tegen taalbarrières en hallo tegen grenzeloze groei! Probeer vandaag nog onze automatische vertaalservice.

Een taalkiezer instellen met Linguise in 7 stappen

Op dit punt kent u de best practices voor taalkiezers. Deze vertaling kan worden uitgevoerd nadat u de websitevertaalservice heeft gebruikt. Niet alle vertaaldiensten bieden echter flexibiliteit in de taalkeuze-instellingen.

Maar maak je geen zorgen, want zo is Linguise niet. Linguise is een automatische vertaalservice waarmee de taalwisselaar door de gebruiker kan worden aangepast. Enkele van de voordelen die u krijgt als u Linguise gebruikt, zijn onder meer:

  • Linguise kan worden gebruikt en geïntegreerd in meer dan 40 CMS ( WordPress , Joomla , Drupal , enz.).
  • De vertaling naar verschillende talen gebeurt automatisch binnen enkele seconden nadat u de taal hebt toegevoegd aan de taalwisselaar op de website.
  • Er zijn meer dan 80+ talen beschikbaar die aan de taalkiezer kunnen worden toegevoegd.
  • Linguise bereidt automatisch een unieke URL voor op basis van de taal van de vertalingsbestemming. Bijvoorbeeld de URL linguise .com/de/ voor een pagina die naar het Duits wordt vertaald.
  • Er wordt automatisch een canonieke URL gemaakt om dubbele inhoud in zoekmachines te voorkomen als er taalvariaties op een pagina voorkomen.
  • U kunt de taalwisselaar flexibel instellen op basis van de websitebehoeften, beginnend bij het pictogram en de kleur tot aan de taalnaam.
  • U kunt de weergavestatistieken van bezoekerspagina's per taal bekijken, voor elke taal die aan de taalkiezer is toegevoegd.

In deze tutorial gebruiken we WordPress als voorbeeld van het gebruikte CMS.

Stap 1: Registratie van een gratis Linguise account

Om toegang te krijgen tot de taalwisselaar op Linguise , moet u eerst een account registreren op Linguise . Linguise biedt ook een gratis proefperiode van één maand, die een verscheidenheid aan functies omvat waarvan u kunt profiteren.

Stap 2: Voeg een domein toe aan uw meertalige website

De tweede stap is het toevoegen van het websitedomein in Linguise waarvan u al eigenaar bent, aan het Linguise dashboard. Er zijn verschillende dingen die u moet invullen, beginnend bij.

  • Rekening
  • URL's
  • Platform
  • Taal
  • Vertaaltaal
  • Vertaal URL
Best practices voor het ontwerpen van een taalkiezer-add-domein

Daarna moet u de API-sleutel activeren en de taal-URL instellen. Voor een complete handleiding voor het toevoegen van een websitedomein kunt u de documentatie lezen, terwijl u deze WordPress de automatische vertaling van Linguise WordPress te installeren of door de onderstaande video-tutorial te bekijken.

Stap 3: Installeer de plug-in Linguise

Nadat u succesvol een website heeft toegevoegd, opent u vervolgens het WordPress dashboard en installeert u de Linguise plug-in, doe dit via Plug-ins > Nieuw toevoegen > Linguise > Installeren > Activeren.

Als de plug-in al is geïnstalleerd, ga dan naar het Linguise dashboard en kopieer de API-sleutel.

Best practices voor het ontwerpen van de Taalkiezer: haal de API-sleutel op

Open vervolgens de Linguise plug-in en plak de API-code die u van het Linguise dashboard heeft gekregen in de volgende kolom.

Best practices voor het ontwerpen van de taalkiezer

Stap 4: Hoofddisplay instellen

Om een ​​taalwisselaar te configureren of taalvlaggen weer te geven, voert u de stappen uit via het Linguise dashboard in het menu Instellingen > Taalvlaggen weergeven.

Tijdens de eerste installatie zullen we aanpassingen maken aan het hoofddisplay, rekening houdend met de verschillende componenten.

Een eerste overweging is de configuratie van het weergaveformaat van de talenlijst, dat drie opties biedt waaruit u kunt kiezen: naast elkaar, vervolgkeuzelijst of pop-up. Aan de linkerkant bevindt zich voor elk formaat een voorbeeldweergave.

Het eerste formaat, zoals hieronder weergegeven, is een zij-aan-zij-indeling.

Best practices voor het ontwerpen van de taalkiezer

Het volgende formaat gebruikt een vervolgkeuzelijst, zoals weergegeven in de onderstaande afbeelding.

Best practices voor het ontwerpen van een vervolgkeuzelijst voor taalkiezers

Ten slotte hebben we het pop-upformaat als laatste optie.

Best practices voor het ontwerpen van de taalkiezer

Vervolgens gaan we verder met de volgende stap, waarbij we de positie van de taalwisselaar configureren. U heeft de flexibiliteit om uit verschillende positieopties te kiezen, dus het is belangrijk om een ​​positie te selecteren die gemakkelijk zichtbaar is voor bezoekers.

Ten slotte moet u beslissen over de combinatievoorkeur voor het weergeven van de taalopties. U kunt kiezen tussen opties zoals vlag + taalnaam, vlag + korte naam, of eenvoudigweg alleen de vlag weergeven. Deze beslissing zal afhangen van uw specifieke ontwerpvoorkeuren en de voorkeuren van uw doelgroep.

Stap 5: Stel het vlagontwerp in

Daarna zult u onder het hoofddisplaygedeelte ontwerpconfiguraties tegenkomen die specifiek voor de vlag zijn bedoeld. De onderstaande afbeelding toont enkele van de beschikbare instelopties.

  • Weergave taalnaam : u heeft de mogelijkheid om de taalnaam weer te geven op basis van het land of de taal zelf. U kunt er bijvoorbeeld voor kiezen om ‘Duits’ of ‘Deutsch’ weer te geven.
  • Engelse vlagtype: Deze optie is van toepassing bij talen die meerdere varianten hebben, zoals 'Engels VS' of 'Engels Groot-Brittannië'. Soortgelijke keuzes kunnen worden gemaakt voor talen als Spaans, Taiwanees, Duits en Portugees.
  • Vlagstijl: Met deze instelling kunt u de vorm van het vlagpictogram definiëren, of deze rond of vierkant (rechthoekig) moet zijn.
Best practices voor het ontwerpen van een taalkiezersetvlag

Stap 6: Stel de kleur en grootte van de vlag in

Zodra het vlagontwerp is ingesteld, bestaat de volgende stap uit het aanpassen van kleuren, grootte en diverse andere elementen. In de volgende interface vindt u talloze aanpasbare instellingen, waaronder:

  1. Randradius vlag: Hiermee kunt u de randradius in pixels personaliseren wanneer u een rechthoekige vlag gebruikt.
  2. Kleur taalnaam: U kunt de standaardtekstkleur voor de taalnaam selecteren.
  3. Kleur pop-uptaal: Deze instelling bepaalt de kleur van de taaltitel in de pop-up- of vervolgkeuzelijsten.
  4. Vlaggrootte: U heeft de mogelijkheid om de grootte van de vlag aan te passen aan uw voorkeuren.
  5. Zweefkleur taalnaam: Deze instelling bepaalt de tekstkleur wanneer u met de muis over taalnamen beweegt.
  6. Kleur van de pop-uptaal: op dezelfde manier bepaalt deze instelling de tekstkleur wanneer u met de muis over de taaltitel in de pop-up of vervolgkeuzelijst beweegt.
Best practices voor het ontwerpen van de taalkiezer

Stap 7: Stel de vlagvakschaduw in

In de laatste fase heb je de mogelijkheid om de schaduwinstellingen voor de vlag aan te passen. Met de initiële instelling kunt u een schaduw opgeven voor elke vlag die op uw website wordt weergegeven, terwijl de volgende instelling betrekking heeft op het schaduweffect wanneer u over de taalvlag zweeft.

Opslaan te klikken om de aanpassingsinstellingen die u voor de taalwisselaar hebt gemaakt, te behouden. Dit zorgt ervoor dat uw geselecteerde configuraties voor de schaduweffecten worden geïmplementeerd en opgeslagen voor toekomstig gebruik.

Best practices voor het ontwerpen van de schaduw van het taalselectievlagvak

Nadat alle configuraties zijn uitgevoerd, is hier een voorbeeld van de weergave van de taalkiezer met behulp van een pop-up, geplaatst in de rechterbovenhoek, en met initialen. Dit is slechts een voorbeeld, de rest kunt u naar wens aanpassen aan de behoeften van de website.

Best practices voor het ontwerpen van een voorbeeld van een taalkiezer

Naast WordPress CMS kunt u ook andere websiteplatforms gebruiken en de gedetailleerde handleiding volgen, zoals de setup-switcher voor OpenCart , de taalswitcher voor Drupal en de setting-switcher voor PrestaShop .

Klaar om nieuwe markten te verkennen? Probeer onze automatische vertaalservice gratis met onze risicovrije proefperiode van 1 maand. Geen creditcard nodig!

Ontwerp uw taalkiezer voor een naadloze meertalige ervaring met Linguise!

Hier heeft u inzicht gekregen in best practices voor het ontwerpen van taalkiezers en hoe u dit kunt doen met Linguise! Geloof me, het creëren van een taalwisselaar kan veel voordelen bieden en optimalisatie garanderen op basis van de hierboven genoemde punten.

Zorg er bij het maken van een taalkiezer voor dat u de tips en best practices volgt die we hierboven hebben uitgelegd, vanaf het gebruik van pictogrammen en het selecteren van relevante talen tot de positionering.

Registreer nu Linguise account , voeg uw website toe en verfijn de taalkiezer om een ​​betere gebruikerservaring te bieden. Vergeet niet de gratis proeffunctie van 1 maand uit te proberen om te profiteren van de superieure functies van Linguise

Misschien ben je ook geïnteresseerd in lezen

Mis het niet!
Abonneer op onze nieuwsbrief

Ontvang nieuws over automatische vertaling van websites, internationale SEO en meer!

Invalid email address
Probeer het eens. Eén keer per maand en je kunt je op elk moment uitschrijven.

Ga niet weg zonder je e-mailadres te delen!

We kunnen niet garanderen dat u de loterij wint, maar we kunnen wel interessant informatief nieuws over vertalingen en incidentele kortingen beloven.

Mis het niet!
Invalid email address