Ein Update auf das so lange gewartet wurde und endlich ist es so weit: Webflow stellt seine native Lösung für mehrsprachige Websites vor. Aber hier hört das Update rund um die sogenannte Lokalisierung (oder englisch: Localization) nicht auf.
Warum ist Webflow Lokalisierung so wichtig?
Langjährige Webflow User kennen den Pain mit Sicherheit: Die eigene Website soll international werden. Na gut, der erste Schritt wäre erstmal weitere Sprachen hinzuzufügen. Aber so einfach war es lange nicht. Entweder mussten externe Tools so wie Weglot hinzugezogen werden (was schnell teuer wurde) oder aber alle Pages wurden dupliziert und in einen Unterordner (z.B. /en/) gepackt. Das Problem an diesem Workaround: Änderungen an der deutschen Website, mussten 1:1 auf der englischen Seite nachgezogen werden. Hierdurch verdoppelte sich der Arbeitsaufwand.
Damit ist jetzt Schluss. Webflow Localization erlaubt es dir nativ in Webflow weiteren Sprachen hinzuzufügen und den Content für alle sogenannten “Locales” granular zu bearbeiten. So wird es beispielsweise möglich nicht nur Texte zu übersetzen, sondern auch Bilder für Sprachen auszutauschen oder die SEO Meta Daten deiner Website für andere Sprachen zu manipulieren.
Was kann Webflow’s Localization im Detail?
Nimmt man das neue Webflow Update mal genau unter die Lupe, fallen folgende Features auf:
- Mehrsprachigkeit deiner Website (inklusive automatische Übersetzungen)
- Anpassbarkeit der Sichtbarkeit von Elementen für verschiedene Locales
- Automatischer Redirect für Besucher auf ihre Browsersprache
- Anpassbarkeit von Styles für verschiedene Sprachen
- Lokale Meta-Daten wie Meta Title und Description
- Lokalisierung von Bildern und Alt-Texts für Bilder
- Lokales Styling für statische und CMS Pages
- Lokale URLs und Unterverzeichnisse
- Individuelle Sitemaps für alle Locales
Achtung: Es kann sein, dass einige Features nur in höheren Pricing-Paketen verfügbar sind. Prüfe daher genau, ob die von dir gewünschten Features in deinem Plan enthalten sind.
1. Mehrsprachigkeit deiner Webflow Website
Für die meisten Websites sicherlich das Core-Feature: die einfache Erstellung von mehreren Sprachen auf denen die Website für Besucher verfügbar ist. Webflow bietet hier zudem die Möglichkeit Texte automatisch von einer in die andere Sprache übersetzen zu lassen und/oder diese manuell einzupflegen. Das öffnet die Tür für viele Internationalisierungsstrategien, ist aber erst der Anfang des Features.
Selbstverständlich lassen sich aber nicht nur Texte statischer Seiten auf mehreren Sprachen anzeigen. Besonders interessant wird es, wenn große CMS Collections (wie z.B. Blog Posts) auf mehreren Sprachen verfügbar sind und so die Reichweite des eigenen Contents massiv zunimmt.
2. Individuelle Sichtbarkeit und Styles von Elementen
Mehrsprachigkeit ist cool, allerdings wird Localization erst dann richtig stark, wenn nicht nur Texte, sondern auch Grafiken / Bilder oder ganze Sections spezifisch auf anderen Sprachen oder Ländern angepasst werden können. Webflow bietet hier die Möglichkeit, mit Tags (ähnlich dazu, wenn man den Hover State eines Buttons definiert) zu definieren, ob sich Bilder verändern sollen. Durch individuelles Ein- und Ausblenden basierend auf der durch den User gewählten Sprache, werden Websites individuell anpassbar auf Gegebenheiten in anderen Märkten.
Ein Beispiel vom VE Team: Durch das individuelle Styling können bspw. deutsche Testimonials für die Sprache Deutsch und französische Testimonials für die Sprache Französisch angezeigt werden.
3. Automatischer Sprach-Redirect
Der native Language-Switcher ist praktisch und zu 100% in Webflow stylebar. Allerdings lässt sich die Localization deiner Website auch zu konfigurieren, dass Besucher automatisch auf die Sprache ihres Browsers weitergeleitet werden. Hat deine Website diese Sprache gar nicht definiert, lässt sich durch eine Fallback-Sprache (z.B. englisch) definieren, wohin Besucher dann weitergeleitet werden. Ein Umschalten der Sprache ist nach dem automatischen Redirect natürlich weiterhin möglich.
4. Lokale Meta Daten (Title und Description) und Alt-Tags
Ein großer Anreiz, die eigene Website auf mehreren Sprachen anzuzeigen, ist einerseits natürlich die Usability für internationale User, aber andererseits auch die zunehmende Reichweite (und SEO-Verbesserung) des eigenen Contents. Diese wird dadurch weiter verstärkt, dass sich selbst kleinste Einstellungen wie SEO-Meta-Title und -Description sowie Bild Alt-Tags für verschiedene Sprachen anpassen lassen. Hierdurch wird die Sichtbarkeit und Indexierung deiner Locales stark verbessert.
5. Lokale URLs, Unterverzeichnisse und Sitemaps
Ein bisschen die Kirsche auf der Torte ist die Anpassbarkeit der URLs für alle Sprachen, sowie die Erstellung individueller Sitemaps für alle erstellten Locales. So wird aus virtual-entity.com/kontakt → auf englisch virtual-entity.com/en/contact und dadurch viel besser verständlich für internationale User. Durch die Definition von Unterverzeichnissen (wie im Beispiel: /en/) lässt sich zudem granular bestimmen, wie die URLs anderer Sprachen konfiguriert werden sollen.
Durch die native Integration der hreflang Tags verstehen Suchmaschinen zudem, wie die einzelnen Unterseiten miteinander verknüpft sind und indexieren deine Seite optimal. Durch die automatisch erstellte XML-Sitemap, die sich auch automatisch updated, musst du dir dann keine Gedanken mehr über die Indexierung bei Google und Co. machen.
Was kostet Webflow Localization?
Webflow geizt bei den Preisen für Localization nicht. Überlegt man sich den Funktionsumfang und guckt sich die Alternativen an, ist Webflow Localization aber definitiv einen zweiten Blick wert. Im Detail gibt es 3 Pricing-Pläne, die sich monatlich oder jährlich bezahlen lassen und auf die Hosting-Gebühren deiner Website aufgeschlagen werden:
- Essential
- Kosten 9$ / Locale / Monat
- bis zu 3 Locales erstellbar
- CMS Lokalisierung
- Statische Seiten Lokalisierung
- SEO Lokalisierung
- Advanced
- Kosten 29$ / Locale / Monat
- bis zu 5 Locales
- Automatische Übersetzungen
- CMS Lokalisierung
- Statische Seiten Lokalisierung
- SEO Lokalisierung
- Asset Lokalisierung
- Individuelle URLs
- Besucher-Redirect
- Enterprise
- Kosten müssen mit Sales verhandelt werden
- kommt zusätzlich mit lokalen Styles, Element Visibility, volle Integration mit Webflow Enterprise
Was uns hier überrascht ist, dass lokale Styles und Element Visibility nur im Enterprise-Plan verfügbar sind. Unserer Einschätzung nach, dürften aber auch Essential und Advanced zukünftig mit weiteren Features rechnen.
Welche Alternativen zu Webflows nativer Mehrsprachigkeit habe ich?
Den Pain-Point, dass Webflow keine native Lösung für Mehrsprachigkeit der eigenen Website anbietet (bzw. angeboten hat), haben natürlich auch anderen SaaS-Unternehmen identifiziert und eigene Lösungen für das Problem entwickelt, die sich als Plugin (meistens durch Code Embed) einbinden lassen.
Die wohl bekannteste Alternative ist Weglot. Das Unternehmen aus Frankreich bietet seit einigen Jahren ein starkes Übersetzungstool für Webflow an und bietet einige coole Features, die wir in diesem Beitrag genauer erläutern: Wie du deine Webflow Website mehrsprachig mit Weglot machst
Im Detail bietet Weglot:
- schnelles und einfaches Setup ( < 5 Minuten, ohne Entwickler möglich)
- hohe Skalierbarkeit durch die Auswahl aus über 50 internationalen Sprachen
- Automatische Erkennung und Übersetzungen für neue Sprachen
- Hohe Übersetzungsqualität, da AI basiert (z.B. Deepl oder Google Translate)
- Individuelle Anpassungen der übersetzten Texte
- 1-Click hinzufügen von weiteren Sprachen
- Anpassungen der Texte im Glossar oder über den praktischen Visual Editor
- Individuelle URLs für Sprachen
- Automatische Weiterleitung von Websitebesuchern auf ihre bevorzugte Sprache
- Top Kundenservice und schnelle Hilfe
“Problematisch” wird es bei Weglot erst, wenn es um individuelle Inhalte für einzelne Sprachen geht. Hier muss dann schnell mit Custom Code gearbeitet werden, was viele Teams abschreckt und dadurch Potenzial bei der Lokalisierung verloren geht. Der visuelle Editor von Weglot ist zwar ein starkes Feature, allerdings muss sich erst noch zeigen, ob er mit der nativen Integration von Locales im Webflow Designer mithalten kann.
Unsere Einschätzung zu Webflow Localization und Alternativen
Da die Webflow Localization erst diesen Monat vorgestellt wurde und erst in den kommenden Wochen für nicht-enterprise Kunden freigeschaltet wird, muss sich der wahre Use-Case von Webflow Localization erst noch zeigen. Die Features und vor allem die native und nahtlose Integration in den Webflow Designer machen das Add-On aber interessant. Durch das Eliminieren von externen Tools, sollte sich zudem die Page-Performance verbessern und die Anfälligkeit für Fehler durch externen Code wird minimiert.