Wussten Sie, dass 3 von 4 Online-Käufern Produkte mit Informationen in ihrer Muttersprache kaufen möchten? (Quelle). Eine mehrsprachige Website hat ihre eigenen Vorteile, wie zum Beispiel:
- Bieten Sie eine personalisierte Benutzererfahrung.
- Steigern Sie den Umsatz durch lokalisierte Informationen.
- Erreichen Sie ein größeres Publikum ohne geografische Einschränkungen.
- Verbessern Sie Ihr Markenimage, indem Sie sich als globales Unternehmen präsentieren.
- Sehen Sie eine Steigerung der Konversion und eine Verringerung der Absprungraten.
Aber viele Unternehmen wissen nicht, wie man mehrsprachige Websites auf die richtige Weise erstellt!
Deshalb finden Sie hier 18 praktische UX-Tipps, die wir empfehlen, wenn Sie Ihre mehrsprachige Website entwerfen.
18 UX-Tipps für eine mehrsprachige Website
Bei der Gestaltung einer mehrsprachigen Website ist es wichtig, verschiedene Faktoren zu berücksichtigen, um eine nahtlose Benutzererfahrung über verschiedene Sprachen und Kulturen hinweg zu gewährleisten. Hier sind die 18 besten UX-Tipps für mehrsprachige Websites.
Planung und Struktur
Bevor Sie mit der Gestaltung Ihrer mehrsprachigen Website beginnen, müssen Sie einige Dinge planen und festlegen.
1. Zielsprachen identifizieren
Um die besten Sprachen für Ihre mehrsprachige Website auszuwählen, analysieren Sie zunächst den Standort und die Demografie Ihrer Zielgruppe. Sehen Sie sich Ihren aktuellen Website-Traffic und Ihre Kundendaten an, um festzustellen, welche Sprachen und Standorte am häufigsten sind.
Ermitteln Sie die in Ihren Zielmärkten gesprochenen Sprachen anhand von Volkszählungsdaten, Marktberichten und Wettbewerbsanalysen.
Zum Beispiel ist laut dem United States Census Bureau Spanisch die zweithäufigste gesprochene Sprache in den Vereinigten Staaten. Wenn US-Kunden Ihre Zielgruppe sind, ist es also sehr sinnvoll, eine spanische Version Ihrer Website neben einer englischen Version zu haben.
Beginnen Sie mit den am weitesten verbreiteten Sprachen und erweitern Sie Ihre Website, wenn sie wächst. Durch die Analyse Ihrer Zielgruppendaten und die Ausrichtung Ihrer Sprachwahl an Ihren Geschäftsziele können Sie die relevantesten Sprachen für Ihre mehrsprachige Website auswählen.
2. Verwenden Sie eine klare URL-Struktur
Eine klare URL-Struktur ist entscheidend für eine mehrsprachige Website. Sie verbessert die SEO, da Suchmaschinen verschiedene Sprachversionen Ihrer Site leicht indizieren und bewerten können, wodurch die Sichtbarkeit in lokalen Suchen erhöht wird.
Die Unterverzeichnisstruktur ist die am häufigsten verwendete und empfohlene Methode. Jede Sprache erhält ihr eigenes Unterverzeichnis unter der Hauptdomäne, wie www.example.com/de/ für Deutsch, www.example.com/es/ für Spanisch und www.example.com/fr/ für Französisch.
Wählen Sie eine Struktur, die Sie auf Ihrer Website konsistent beibehalten können. Vermeiden Sie das Mischen verschiedener Strukturen. Verwenden Sie ISO 639-1-Sprachcodes (wie “de” für Deutsch und “es” für Spanisch), um Klarheit und Standardisierung zu gewährleisten.
Verwenden Sie kanonische Tags, um die bevorzugte Version einer Seite für Suchmaschinen anzugeben, insbesondere wenn Sie ähnliche Inhalte in verschiedenen Sprachen haben. Implementieren Sie hreflang-Tags in Ihrem HTML, um Suchmaschinen dabei zu helfen, die Sprache und regionale Ausrichtung Ihrer Seiten zu verstehen.
3. Globale Vorlagen verwenden
Wenn ein Website-Besucher eine andere Sprache wählt, darf er nicht auf einer völlig anderen Website landen. Verwenden Sie dieselbe Website-Vorlage für alle übersetzten Webseiten.
Hier ist ein Beispiel für Canva. Wenn die Website von Englisch auf Spanisch übersetzt wird, bleiben der Abstand zwischen den Überschriften und Absätzen, die Schaltflächenplatzierung, das Menü und die Symbole, das Format des Preisplans und alles andere gleich.
Eine globale Vorlage hilft bei konsistenter Markenführung und bietet eine nahtlose Benutzererfahrung, unabhängig davon, in welche Sprache gewechselt wird. Stellen Sie sicher, dass Ihre Benutzer das gleiche Layout, Designelemente, Branding und Farben sehen, wenn sie von der Standardsprache wechseln.
Wenn Sie ein Content Management System (CMS) wie WordPress mit Linguise verwenden, ist die Erstellung einer mehrsprachigen Markenwebsite ein Kinderspiel. Linguise integriert sich tief in das Theme Ihrer Website und übersetzt Ihre Inhalte automatisch ohne zusätzliche Datenbankanfragen oder übermäßige Serverlast. Auf diese Weise wird die Leistung Ihrer Website nicht beeinträchtigt.
Wenn Sie ein eCommerce-Plugin wie WooCommerce verwenden, Linguiseaktualisiert automatisch die Hauptseite und die übersetzten Seiten bei jeder Produktaktualisierung.
4. Berücksichtigen Sie den Platzbedarf für die Textausdehnung
Einer der wichtigsten UX-Tipps beim Designen einer mehrsprachigen Website ist, die Textausdehnung zu berücksichtigen. Jede Sprache hat unterschiedliche Schreibstile und Wortlängen, die berücksichtigt werden müssen.
Sehen Sie sich dieses Beispiel von Etsy an. Links sehen Sie den Website-Inhalt auf Japanisch und rechts den gleichen Inhalt auf Deutsch.
Einige Sprachen benötigen mehr Platz, während andere weniger Platz benötigen. Ihr Webseitenlayout muss in der Lage sein, den Abstand anzupassen, um sicherzustellen, dass der übersetzte Inhalt lesbar bleibt.
Hier ist eine Demonstration, wie ein Text in verschiedenen Sprachen expandiert oder kontrahiert wird. Laut W3C hat das Wort “Ansicht” eine 300% Expansion vom Englischen zum Italienischen!
Berücksichtigen Sie auch die Zeilenhöhe und den Zeichenstil. Einige Sprachen haben höhere Zeichen als andere, während einige Skripte mehr Abstand benötigen als andere Skripte.
Zum Beispiel benötigt das arabische Skript mehr vertikalen Raum zwischen den Zeilen als Latein.
5. Halten Sie Inhalte und Design getrennt
Halten Sie Text von Multimedia-Elementen getrennt für einfachere Aktualisierungen und Übersetzungen.
Textinhalte innerhalb von HTML-Elementen wie
,
und belassen. CSS für das Styling verwenden, um sicherzustellen, dass Designänderungen den Inhalt nicht beeinflussen. Textstrings in separaten Sprachdateien wie JSON, XML oder PHP speichern.
Dies ermöglicht einfache Aktualisierungen und Übersetzungen, ohne den Hauptcode zu berühren. Verwenden Sie Lokalisierungsbibliotheken wie i18next für JavaScript, um Übersetzungen dynamisch zu verwalten.
Halten Sie Design und Inhalt getrennt, damit das Layout nach der Übersetzung weniger wahrscheinlich durcheinander gerät.
6. Bieten Sie Optionen zum Sprachwechsel an
Das Bereitstellen klarer und zugänglicher Sprachauswahlmöglichkeiten ist unerlässlich für eine mehrsprachige Website. Platzieren Sie den Schalter in der oberen rechten Ecke für einen einfachen Zugriff und verwenden Sie kontrastierende Farben und eine klare Typografie, damit er hervorsticht. Zur Verdeutlichung geben Sie den Sprachnamen in der jeweiligen Landessprache an (z. B. „Español“ für Spanisch).
Ein Dropdown-Menü kann mehrere Sprachoptionen effizient anzeigen, ohne zu viel Platz zu beanspruchen. Die Verwendung von Flaggen kann einen visuellen Hinweis geben, aber seien Sie vorsichtig, da Flaggen manchmal irreführend sein können.
Zum Beispiel kann eine Flagge eine Sprache darstellen, die in mehreren Ländern gesprochen wird. Es ist oft am besten, Flaggen mit Sprachbezeichnungen zu kombinieren, um Klarheit zu schaffen.
Zeigen Sie die ausgewählte Sprache deutlich mit einer anderen Farbe oder fetter Schrift an. Verwenden Sie Techniken wie AJAX, um sicherzustellen, dass die Auswahl einer Sprache den Inhalt sofort ändert, ohne die Seite zu aktualisieren. Machen Sie den Sprachumschalter responsiv für mobile Geräte und testen Sie seine Benutzerfreundlichkeit mit Muttersprachlern.
Inhalt und Übersetzung
Hier sind einige Tipps zu Inhalten und Übersetzungen für eine bessere Benutzererfahrung.
7. Vermeiden Sie Idiome und Slang
Nicht alle Slang-Ausdrücke sind universell akzeptabel. Tatsächlich gelten einige Slang-Ausdrücke in einigen Ländern als akzeptabel und in anderen als äußerst anstößig. Sie sollten immer klare und einfache Sprache verwenden, die sich gut über verschiedene Kulturen hinweg übersetzen lässt.
Zum Beispiel gibt es ein beliebtes russisches Idiom – Хоть кол на голове теши. Dieses Idiom bedeutet auf Russisch „Er ist eine sehr sture Person.“
Die wörtliche Übersetzung des Idioms lautet jedoch: „Man kann mit einer Axt auf dem Kopf schleifen.“ 😂
Hier ist ein weiteres Beispiel dafür, wie ein häufiges englisches Wort bei automatischer Übersetzung mit Mäßigung katastrophal sein kann. Das englische Wort Salsa klingt im Koreanischen wie 설사 (seolsa), was “Durchfall” bedeutet.
Deshalb empfehlen wir, Slang oder Idiome zu vermeiden, die nur für eine bestimmte Kultur oder Demografie relevant sind. Verwenden Sie stattdessen eine einfache Sprache, die leicht in andere Sprachen übersetzt werden kann.
8. Verwenden Sie kulturell angemessene Bilder und Symbole
Passen Sie Inhalte, Bilder, Symbole und andere Multimedia an, um lokale Bräuche und kulturelle Bezüge widerzuspiegeln.
Zum Beispiel zeigt Clarins, eine Hautpflegemarke, die ein globales Publikum anspricht, kaukasische Frauen in seinen europäischen Website-Versionen.
Auf der japanischen Version ihrer Website zeigen sie jedoch japanische Frauen, um eine bessere Verbindung zu lokalen Kunden herzustellen.
Verwenden Sie für Symbole, insbesondere für das Sprachumschalter-Symbol, ein Globus-Symbol, das universell aussieht. Zum Beispiel könnte das erste Symbol unten süd- und nordamerikanische Zielgruppen ansprechen, aber nicht afrikanische und asiatische Zielgruppen.
Das zweite Symbol könnte die afrikanische Zielgruppe ansprechen, aber nicht andere.
Um diese Verwirrung zu vermeiden, verwenden Sie das universelle Globus-Symbol, das jeden anspricht – das dritte. Es hebt keine bestimmte Region oder kein bestimmtes Land hervor und ist daher für eine mehrsprachige Website besser geeignet.
9. Bieten Sie Untertitel für Multimedia-Inhalte an
Verwenden Sie für Multimedia-Untertiteldateien für Videoübersetzungen, ohne das Video zu ändern. Stellen Sie sicher, dass Bilder und Multimedia-Elemente beschreibenden Alternativtext haben, der separat vom visuellen Inhalt übersetzt werden kann.
Hier ist ein weiteres Beispiel dafür, wie Übersetzung Ihnen helfen kann, ein breiteres Publikum zu erreichen. Wir sind begeisterte Zuschauer von Project Happiness, einem YouTube-Kanal, der von einem italienischen Reisenden namens Giuseppe betrieben wird.
Der Creator ist Italiener. Er nimmt auf Italienisch auf und synchronisiert seine Videos auf Englisch, aber sein Kanal wird aufgrund der Vielzahl von Untertiteln, die er anbietet, weltweit angesehen.
10. Übersetzungen regelmäßig aktualisieren
Linguise ermöglicht es Ihnen, Ihre übersetzten Seiten auf dem Frontend mit einer benutzerfreundlichen Oberfläche zu bearbeiten. Sie können die Übersetzungen selbst bewerten und Änderungen vornehmen, wenn Sie es für notwendig halten.
E-Commerce-Websites haben viele häufige Änderungen – Produkte gehen außer Lager, zeitlich begrenzte Angebote, Änderungen an Produktinformationen und mehr.
Aber mit Linguise wird die Aktualisierung übersetzter Inhalte erleichtert. Sein dedizierter Übersetzungsserver und Cachesystem beschleunigen den Übersetzungsprozess und zeigen die übersetzte Seite Ihrem Publikum an.
11. Beachten Sie Sprachen mit Leserichtung von rechts nach links
Die meisten Sprachen werden von links nach rechts geschrieben. Einige Sprachen wie Arabisch, Hebräisch und Persisch werden jedoch von rechts nach links geschrieben.
Hier ist ein Vergleich der englischen und arabischen Versionen der Instagram-Startseite. Wie Sie sehen, hat die arabische Version alles von rechts nach links gespiegelt, die Bilder, die Schaltflächen, den Text und sogar die Suchleiste.
Linguises Übersetzungsdienst unterstützt Sprachen von rechts nach links nativ und kann das Layout Ihrer mehrsprachigen Website anpassen, um sie unterzubringen.
Hier sind einige der verfügbaren Sprachen von rechts nach links:
- Arabisch (ar)
- Hebräisch (he)
- Persisch (fa)
- Paschtu (ps)
- Urdu (ur)
Wenn Sie diese Sprachen einbeziehen möchten, verwenden Sie ein Website-Layout, das solche großen Änderungen aufnehmen kann.
SEO und Leistung
Wir empfehlen dringend, Ihre mehrsprachige Website für internationale Suchmaschinen zu optimieren, um ihre Wirkung zu maximieren.
Führen Sie Keyword-Recherche in jeder Zielsprache durch, verwenden Sie hreflang-Tags für Sprach- und Regional-Targeting und überwachen Sie die Leistung.
12. Optimieren Sie für lokale SEO
Beginnen Sie mit lokalisierter Keyword-Recherche für jede Sprache und Region. Verwenden Sie Tools wie Google Keyword Planner, SEMrush oder Ahrefs, um relevante Schlüsselwörter zu finden, nach denen Ihre Zielgruppe sucht.
Berücksichtigen Sie regionale Dialekte und Variationen in der Terminologie. Zum Beispiel unterscheidet sich Spanisch in Mexiko von Spanisch in Europa, daher sollten Sie Ihre Schlüsselwörter entsprechend anpassen.
Erstellen Sie eindeutige Titel-Tags für jede Sprachversion Ihrer Seiten, indem Sie lokalisierte Schlüsselwörter einbeziehen. Halten Sie sie prägnant und relevant, idealerweise unter 60 Zeichen.
Zum Beispiel auf Englisch: “Kaufen Sie Bio-Kaffee online | Beste Preise” und auf Spanisch: “Compra Café Orgánico en Línea | Mejores Precios.”
Schreiben Sie überzeugende Meta-Beschreibungen für jede Sprachversion, einschließlich lokalisierter Schlüsselwörter und eines klaren Aufrufs zum Handeln, und halten Sie diese unter 160 Zeichen.
Zum Beispiel auf Englisch: “Kaufe unsere Auswahl an biologischem Kaffee, der von den besten Höfen stammt. Kostenloser Versand bei Bestellungen über 50 $!” und auf Spanisch: “Compra nuestra selección de café orgánico, proveniente de las mejores fincas. ¡Envío gratis en pedidos superiores a $50!”
13. Verwenden Sie hreflang-Tags
Verwenden Sie hreflang-Attribute in Ihrem HTML, um Suchmaschinen über die Sprach- und Regional-Zielsetzung Ihrer Seiten zu informieren. Dies hilft, Probleme mit doppeltem Inhalt zu vermeiden und stellt sicher, dass Benutzer zur richtigen Sprachversion geleitet werden.
14. Leistung über Sprachen hinweg überwachen
Überwachen Sie die Leistung jeder Sprachversion mithilfe von Tools wie Google Analytics und Google Search Console. Analysieren Sie Traffic-Quellen, Benutzerverhalten und Keyword-Rankings, um Verbesserungspotentiale zu identifizieren.
Experimentieren Sie mit verschiedenen Schlüsselwörtern, Meta-Tags und Inhaltsstrategien, um zu sehen, was bei Ihrem Publikum in jeder Sprache am besten ankommt.
Wartung und Support
Es gibt auch Überlegungen anzustellen, wenn es um die Wartung und Unterstützung von Websites und Kunden geht.
15. Erstellen Sie einen Wartungsplan
Ein umfassender Wartungsplan für Ihre mehrsprachige Website stellt sicher, dass alle Sprachversionen konsistent, genau und aktuell bleiben.
Ein gut strukturierter Plan hilft Ihnen, Inhalte effektiv zu verwalten, Benutzerfeedback zu berücksichtigen und sich an veränderte Marktbedingungen anzupassen.
Führen Sie Inhaltsaudits durch, um die Relevanz und Genauigkeit bestehender Inhalte in allen Sprachen zu bewerten. Überprüfen Sie auf veraltete Informationen, defekte Links und Inkonsistenzen zwischen den Sprachversionen.
Testen Sie regelmäßig den Sprachumschalter, die Navigation und andere interaktive Elemente, um sicherzustellen, dass sie korrekt funktionieren.
16. Bieten Sie Kundensupport in mehreren Sprachen an
Die Bereitstellung von Kundensupport in mehreren Sprachen verbessert die Benutzererfahrung und schafft Vertrauen bei einem vielfältigen Publikum.
Stellen Sie Kundenservice-Mitarbeiter ein, die die Sprachen sprechen, die Sie unterstützen. Dies kann Vollzeitpersonal oder Teilzeitauftragnehmer umfassen.
Um zu verstehen, welche Sprachen priorisiert werden sollten, können Sie Ihren Website-Traffic und Ihre Kunden-Demografie analysieren oder Umfragen oder Feedback-Formulare durchführen. Verwenden Sie die Ergebnisse, um die Sprachpräferenzen Ihrer bestehenden Kunden zu verstehen.
17. Feedback-Mechanismus
Erstellen Sie einfache, benutzerfreundliche Feedback-Formulare, die es den Nutzern ermöglichen, Probleme mit Übersetzungen oder Benutzerfreundlichkeit zu melden. Stellen Sie sicher, dass diese Formulare von jeder Seite aus zugänglich sind, idealerweise im Fußbereich oder über einen speziellen Support-Bereich.
Stellen Sie sicher, dass Feedback-Formulare in allen unterstützten Sprachen verfügbar sind, damit Benutzer Feedback in ihrer bevorzugten Sprache geben können.
Fügen Sie strukturierte Fragen hinzu, die Benutzer anleiten, spezifisches Feedback zu geben. Zum Beispiel:
- Bewerten Sie die Genauigkeit der Übersetzung (Skala 1-5).
- Welche Probleme hatten Sie mit der Übersetzung?
- Wie einfach war es, die Website in Ihrer Sprache zu navigieren?
Für diejenigen, die nicht daran interessiert sind, das Feedback-Formular auszufüllen, implementieren Sie schnelle Feedback-Buttons (z.B. Daumen hoch/Daumen runter) auf übersetzten Inhalten. Dies ermöglicht es den Benutzern, leicht anzugeben, ob die Übersetzung hilfreich oder genau war.
18. Verwenden Sie eine Staging-Website für Updates
Testen Sie neue Inhalte und Updates in einer Staging-Umgebung, bevor Sie live gehen, um Störungen zu vermeiden. Sie können einen AI-Website-Builder wie ZipWP verwenden, um eine vollständige Website in Sekunden zu erstellen.
Die Website wird alle wesentlichen Seiten, relevante Bilder, ansprechende Website-Texte und eingebettete CMS- und SEO-Funktionalitäten enthalten.
Ready To Reach a Global Audience?
Diese 18 UX-Tipps für mehrsprachige Websites helfen Kunden, Ihre Website besser zu navigieren und sich mit Inhalten in ihrer bevorzugten Sprache auseinanderzusetzen.
Gutes multilinguales UX-Design kann die Benutzerbindung und das Konversionspotenzial erheblich steigern. Die Erstellung einer multilingualen Website mit einer nahtlosen Erfahrung erfordert jedoch Zeit und Mühe.
Hier kann Linguise helfen!
Linguise integriert sich nativ in über 40 CMS, wie z.B. WordPress, Shopify, Webflow, Squarespace und andere. Es unterstützt über 80 Sprachen und 10.000 Sprachpaare, um das beste mehrsprachige Website-Erlebnis zu bieten.
Alle Übersetzungen sind SEO-optimiert und erschwinglich und kosten 10% eines manuellen Übersetzungsdienstes.
Sind Sie bereit, mit Linguiseglobal zu gehen?
