Die neuesten Webflow-Updates 2023 im Überblick

Webflow durchläuft seit Anfang Januar eine Reihe kontinuierlicher Updates, und diese positive Dynamik zeigt keine Anzeichen einer Verlangsamung für den Rest des Jahres. Das Unternehmen ist bestrebt, diese Aufwärtsentwicklung mit aufregenden Plänen für vier Entwicklerkonferenzen, die später in diesem Jahr stattfinden sollen, fortzusetzen.

Nicht alle der in der jüngsten Online-Streaming-Ankündigung vorgestellten Webflow-Updates sind völlig neu, da einige bereits früher in diesem Jahr eingeführt wurden, aber sie sind bedeutend und verdienen eine genauere Betrachtung. Webflow nutzte die Gelegenheit dieser Update-Ankündigung, um diese kleinen, aber wichtigen Updates ins Rampenlicht zu rücken, die Aufmerksamkeit des Publikums zu gewinnen und ihre Relevanz zu betonen.

Im weiteren Verlauf dieses Artikels werden wir die angekündigten Updates in drei Kategorien einteilen: kürzlich hinzugefügte Updates, Mai-Updates und Updates, die noch in diesem Jahr kommen werden!

Kürzlich hinzugefügte Updates

In unserem schnelllebigen Alltag und bei begrenzter Freizeit ist es üblich, die Umgebung aus dem Blick zu verlieren, insbesondere wenn wir in ernste Arbeit vertieft sind und den Druck verspüren, Deadlines einzuhalten. Daher können uns manchmal wichtige Neuigkeiten entgehen. 

Genau deshalb hat Webflow diese Ankündigung genutzt, um eine kurze Einführung in die Updates zu geben, die seit Jahresbeginn veröffentlicht wurden – auch wenn du einige davon vielleicht übersehen hast –, und gleichzeitig die neuen vorzustellen.

Hier sind die aktuellen Webflow-Features und Verbesserungs-Updates, die seit Anfang dieses Jahres in der Reihenfolge ihres Erscheinens veröffentlicht wurden:

1. Verbesserungen am Page Branching

Webflow hat neue Verbesserungen am Page Branching eingeführt, die großen Teams mehr Kontrolle, Leistung und Übersicht bieten. 

Die Verbesserungen umfassen die folgenden Möglichkeiten:

• Klassen und Seiteneinstellungen in Branches ändern, 
• Klassenkonflikte überprüfen und lösen zwischen einem Branch und der Hauptseite
• Branch-Aktivitäten verfolgen im Site-Aktivitätsprotokoll
• Interaktionen mit vorgefertigten Animationen erstellen. 

Diese Webflow-Updates sollen die kollaborative Website-Entwicklung erleichtern und es Teams ermöglichen, gleichzeitig an derselben Website zu arbeiten. Enterprise-Kunden und Enterprise-Partner haben Zugang zu diesen Webflow-Features.

2. Webflow Editor-Verbesserungen für große Websites

Webflow hat im Editor erhebliche Performance-Verbesserungen speziell für große Websites eingeführt, die ein flüssigeres Bearbeitungserlebnis bieten. 

Zu den Verbesserungen gehören:

• Bis zu 15-mal schnelleres Laden von Projekten
• 5-fach reduzierter RAM-Verbrauch beim Bearbeiten und Zugreifen auf Collection-Daten
• Speicherdruck um bis zu 6-fach reduziert
• 86-fach niedrigere Bandbreitenanforderungen.

Darüber hinaus wurden kleinere UX-Verbesserungen bei der Filterung und dem Durchsuchen vorgenommen, die es ermöglichen, Elemente in einer Collection zu verfeinern und durch sie zu blättern, sobald 100 Datenpunkte vorab geladen wurden.

3. Updates zur Google Analytics-Integration

Webflow hat Anfang dieses Jahres seine Google Analytics-Integration aktualisiert, um den bevorstehenden Übergang von Universal Analytics zu Google Analytics 4 zu unterstützen. Nutzer können über die Integration jetzt ausschließlich Google Analytics 4-Mess-IDs verwenden. 

Nutzer mit Universal Analytics-Mess-IDs werden aufgefordert, diese zu ersetzen, während Nutzer mit Google Analytics 4-Mess-IDs ihre Websites neu speichern und veröffentlichen müssen, damit die Verfolgung weiterhin funktioniert. Umschalter für IP-Anonymisierung und gtag.js wurden ebenfalls entfernt, da diese nun verpflichtende Konfigurationen in Google Analytics 4 sind.

4. Standard-Workspace für das Dashboard festlegen

Nutzer in Webflow können jetzt einen Standard-Workspace festlegen, was die Navigation zwischen verschiedenen Teams für Agenturmitglieder und Freelancer erleichtert. Du kannst jetzt einfach deinen bevorzugten Workspace angeben, und er wird beim Öffnen des Dashboards automatisch geöffnet. 

Darüber hinaus wurden Design-Verbesserungen am Dropdown-Menü zum Wechseln von Workspaces vorgenommen, um eine übersichtlichere und reibungslosere Erfahrung zu gewährleisten.

5. Verbesserungen bei variablen Schriften

Ein weiteres Update von Webflow betrifft variable Schriften. Designer können jetzt benutzerdefinierte Achsen von variablen Schriften animieren, was ihnen mehr kreative Möglichkeiten bietet, und haben einfacheren Zugang zu benutzerdefinierten Schriften.

Darüber hinaus erleichtert ein neuer Indikator die Unterscheidung zwischen variablen und statischen Schriften, und Designer können bequemer auf Variationssteuerungen zugreifen. Nicht nur das, sondern die Anpassung von Variationen kann jetzt in einem einzigen Schritt erfolgen, wodurch das manuelle Hinzufügen entfällt. 

6. Workspace-Profil auswählen

Beim Übergang vom bisherigen Format zu einem schlankeren hat Webflow ein Update eingeführt, das es Nutzern ermöglicht, ihren Workspace-@handle und ihre Profil-URL zu wählen. Diese Änderung bietet ein verbessertes Branding für Profile und gibt Nutzern direkte Kontrolle über die Auswahl ihrer URL. 

Nutzer können zur Workspace-Einstellungsseite navigieren und das Feld „Workspace-Profil-URL" nutzen, um eine beliebige verfügbare URL ihrer Wahl auszuwählen. Alte URLs werden automatisch auf das neue Format weitergeleitet, um einen nahtlosen Zugang zum öffentlichen Profil des Nutzers zu gewährleisten.

7. CMS-Daten in benutzerdefinierten HTML-Blöcken verwenden

Nach vielen Nutzeranfragen hat Webflow das Update eingeführt, das es Nutzern ermöglicht, CMS-Daten in benutzerdefinierten Attributen zu verwenden, wodurch benutzerdefinierter Code und HTML-Attribute noch leistungsfähiger werden. Diese Verbesserung ermöglicht es Designern, CMS-Datenfelder oder Komponenteneigenschaften an benutzerdefinierte Attribute oder Element-IDs zu binden, wodurch die Abhängigkeit von benutzerdefiniertem Code für dynamische Daten reduziert wird.

Nutzer können jetzt die Zugänglichkeit der Website verbessern, Integrationen oder Widgets mit HTML-Datenattributen steuern, das Seiten-Styling basierend auf Feldwerten anpassen und vieles mehr. 

8. Unterstützung für dotLottie-Animationsdateien

DotLottie-Animationsdateien werden jetzt in Webflow unterstützt. Dies ermöglicht es Nutzern, Adobe After Effects-Animationen mit kleineren Dateigrößen und schnelleren Ladezeiten zu ihren Webflow-Websites hinzuzufügen. Mit dieser Integration können Nutzer interaktive Erlebnisse erstellen, indem sie diese Animationen mit Auslösern wie Seitenlade, Seiten-Scroll und Mausbewegung über Webflow Interactions verbinden. 

9. Filter für das Site-Aktivitätsprotokoll

Die Einführung von Filtern für das Site-Aktivitätsprotokoll erleichtert großen Teams das schnelle und effiziente Auffinden der gewünschten Informationen. Mit diesen Filtern können Webflow Enterprise-Kunden und Enterprise-Partner die Aktivitätstypen anpassen, die sie sehen möchten, wie z. B. Klassen, benutzerdefinierten Code und Branch-Ereignisse. 

Nutzer können auch nach Autor filtern und Ergebnisse von allen Autoren oder bestimmten Personen anzeigen lassen. Außerdem enthalten Klassen-geändert-Ereignisse jetzt ein anklickbares „Liste"-Symbol, das schnellen Zugriff auf Elemente und Seiten bietet, die von Klassenänderungen betroffen sind. Diese Verbesserungen vereinfachen den Prozess der Verfolgung und Lösung von Website-Problemen und verbessern die Zusammenarbeit und Produktivität von Teams.

10. Elemente in Div-Blöcke einwickeln

Was zuvor mehrere Schritte erforderte, ermöglicht Webflow mit der Einführung neuer Tastenkürzel und Canvas-Kontextmenüoptionen Designern jetzt, Elemente viel einfacher in einen Div- oder Link-Block einzuwickeln.

11. CSS Dynamic Viewport-Unterstützung für neue Einheiten

Um Designern mehr Flexibilität bei der Erstellung responsiver Designs für mobile Browser zu bieten, hat Webflow neue CSS-Viewport-Breiten- und Höheneinheiten eingeführt.

Diese neuen Einheiten (klein, groß und dynamisch) beheben das Problem dynamischer Toolbars auf mobilen Geräten und stellen sicher, dass fixierte Elemente nicht abgeschnitten werden, was das Gesamterlebnis für Besucher verbessert. Sie können im Style-Panel des Webflow Designers verwendet werden. 

12. Verbesserungen am Figma-Plugin

Als Reaktion auf eine häufige Anfrage aus der Community zur Verbesserung der Klassenbenennung hat Webflow dies mit diesem Fix des Figma-Plugins umgesetzt. Das Update verbessert die Klassenbenennung beim Kopieren und Einfügen von Elementen aus Figma nach Webflow.

Was zuvor dazu führte, dass beim Kopieren und Einfügen von Elementen aus Figma nach Webflow duplizierte Klassen entstanden und ein unübersichtliches Klassensystem erzeugten, können Nutzer jetzt ohne diese Sorge einfügen. Sie können mit Webflow-Klassen einfügen oder Webflow-Klassen beim Einfügen aktualisieren. Beachte, dass beim ersten Einfügen der Zwischenablagezugriff für Webflow gewährt werden muss.

13. Einführung von Text-Stroke-Styling

Text-Stroke-Styling ist ein dringend benötigtes Feature, das die Notwendigkeit für Designer eliminiert, benutzerdefinierten Code oder Drittanbieter-Plugins zu verwenden. Das Feature ermöglicht es Nutzern, ihren Textelementen einfach einen Umriss oder Rahmen hinzuzufügen, und bietet mehr Flexibilität sowie eine Vereinfachung des Design-Prozesses.

14. Verbesserungen der SSO-Authentifizierung

Um den Bedürfnissen großer Unternehmen gerecht zu werden, wurden SSO-Verbesserungen für Teams mit mehreren Workspaces, Teams mit mehreren E-Mail-Domains und Authentifizierung auf Workspace-Ebene für verbesserte Sicherheit vorgenommen.

15. Usability-Updates für Komponenten

Die neuen Änderungen an Komponenten zielen darauf ab, das Bearbeitungserlebnis zu verbessern, indem zu einem früheren, flüssigeren und intuitiveren Verhalten zurückgekehrt wird. Nutzer können jetzt auf die Hauptkomponente doppelklicken, um sie zu bearbeiten, und Komponenteneigenschaften direkt auf der Arbeitsfläche bearbeiten. 

Klarere Beschriftungen und einfachere Menünavigation wurden ebenfalls implementiert. Diese Webflow-Features erleichtern es jetzt, Komponenten ohne unbeabsichtigte Änderungen zu aktualisieren.

16. Collection-Seiten in Ordnern verschachteln

Für mehr Kontrolle und Verwaltung des CMS-Inhalts hat Webflow dieses Update eingeführt, das es Nutzern ermöglicht, Collection-Seiten in Ordnern zu verschachteln, um die URL-Kontrolle zu verbessern. Mit diesem Feature können Nutzer ihre SEO optimieren, indem sie Collection-Elemente innerhalb eines URL-Unterverzeichnisses veröffentlichen. 

Nutzer können jetzt auch das Veröffentlichen von Template-Seiten für bestimmte Collections verhindern und Collection-Strukturen duplizieren, um die Erstellung von Content-Bibliotheken zu beschleunigen. 

‍

Webflow-Updates im Mai

Diese Liste enthält Webflow-Updates, die im Laufe des Monats Mai vor dem Video-Ankündigungs-Event veröffentlicht wurden!

1. Performance-Verbesserungen für den Designer

Dieses Webflow-Update richtet sich an große Websites mit 50 oder mehr Seiten und bietet Verbesserungen bei der Geschwindigkeit und Reaktionsfähigkeit verschiedener Designer-Funktionen, darunter das Öffnen des Designers, das Wechseln zwischen Seiten, das Navigieren im Seitenbereich, Elementeinstellungen, Navigator und Style Manager sowie die Arbeit mit Grid-Layouts. 

2. Schnell nach Swatches suchen

Die Suche nach Swatches im Style-Panel ist mit diesem Update schneller als je zuvor. Beim Auswählen einer Farbe im Farbeingabefeld erscheint eine Dropdown-Liste mit Swatches samt zugehöriger Farbe und Name, was das Finden und Auswählen von Farben erleichtert. 

Darüber hinaus können Nutzer Farbänderungen in Echtzeit in der Vorschau anzeigen, indem sie mit der Maus über die Swatches auf der Arbeitsfläche fahren. 

3. Aus einem Workspace austreten

Ein viel gewünschtes Feature, das sogar als erstes in der Video-Ankündigung erwähnt wurde, ermöglicht es Nutzern, einen Workspace zu verlassen, ohne die Hilfe eines Admins oder Kunden zu benötigen. 

Dazu kannst du das Workspace-Dropdown-Menü in deinem Dashboard öffnen, auf „Workspaces verwalten" klicken, die Auslassungspunkte für den gewünschten Workspace auswählen und die Option „Workspace verlassen" wählen.

4. Komponenten können jetzt in Collection-Listen verwendet werden

Das Ziehen von Komponenten in Collection-Listen und das Verbinden von CMS-Daten mit Komponenteneigenschaften ist mit diesem Webflow-Update jetzt möglich, was die Wiederverwendung gängiger Design-Muster über mehrere Instanzen hinweg ermöglicht. 

Nicht nur das, sondern jetzt können Elemente innerhalb von Collection-Listenelementen ebenfalls in Komponenten umgewandelt werden, ähnlich wie andere Elemente, was die Effizienz beim Design und bei der Synchronisierung von Layouts auf der Website verbessert.

5. Privates Staging

Mehr Privatsphäre und Sicherheit beim Überprüfen von Website-Änderungen vor ihrer öffentlichen Veröffentlichung wird durch dieses Feature ermöglicht, das Nutzern erlaubt, den Zugriff auf ihre webflow.io-Staging-Domain auf angemeldete Nutzer innerhalb ihres Workspaces zu beschränken.

Dieses Webflow-Update ist besonders vorteilhaft für Enterprise-Kunden, die jetzt sicherstellen können, dass nur autorisierte Teammitglieder Zugang zur Staging-Umgebung haben. 

6. Combo-Klassen-Unterstützung für das Figma-Plugin

Webflow hat kürzlich auch die Combo-Klassen-Unterstützung für sein Figma-Plugin eingeführt und damit ein meistgewünschtes Feature umgesetzt. Mit diesem Update können Nutzer automatisch Webflow-Combo-Klassen erstellen, wenn sie Figma-Designs in Webflow einfügen. Um Combo-Klassen zu erstellen, müssen Nutzer ihre Figma-Layer mit der Klasse und der Combo-Klasse benennen, getrennt durch Schrägstriche. 

Um ein Beispiel zu nennen: Das Benennen eines Figma-Layers als „Primary Button / Dark" erstellt die Klasse „Primary Button" und die Combo-Klasse „Dark" in Webflow. 

7. Projekte aus dem Workspace eines Kunden präsentieren 

Früher war es für Webflow Experts schwierig, ihre Arbeit auf Made in Webflow und ihrem Webflow-Profil zu präsentieren, wenn die Website zum Workspace eines Kunden gehörte. Mit diesem Update können Website-Eigentümer jetzt Agenturen, Freelancer und andere Mitwirkende in den Creator Credits ihrer Website taggen.

Auf diese Weise können diese Ersteller ihre Arbeit auf Made in Webflow und ihrem Webflow-Profil präsentieren, ohne eine Kopie der Website in ihr eigenes Konto erstellen zu müssen. Website-Eigentümer, Workspace-Mitglieder und Gäste können bis zu drei weitere Webflow-Nutzer oder Workspaces über die Registerkarte „Allgemeine Einstellungen" zu den Creator Credits einer Website hinzufügen. Getaggte Ersteller können die Website präsentieren, auch wenn der Website-Eigentümer dies nicht in seinem eigenen Konto tut.

5 große bevorstehende Updates

Webflow hat 5 große Updates angekündigt, die noch in diesem Jahr kommen werden. Auch wenn wir einige davon erwartet hatten, gibt es viel, worauf wir uns freuen können. Diesmal werden wir sie nur kurz erwähnen, da wir später in diesem Jahr einen ausführlicheren Artikel veröffentlichen werden, wenn sie gelauncht werden!

Hier sind die 5 Webflow-Updates, auf die wir uns in diesem Jahr freuen:

• KI-Investitionen
• DevLink
• Kommentare & Zusammenarbeit
• Lokalisierung
• Spline-Integration 

Fazit

Webflow aktualisiert seine Plattform kontinuierlich und hat spannende Pläne für vier Entwicklerkonferenzen später in diesem Jahr. Die aktuellen Updates sind zwar nicht alle völlig neu, aber bedeutend und verdienen Aufmerksamkeit. 

Sie reichen von der Verbesserung der kollaborativen Website-Entwicklung über die Verbesserung der Editor-Performance, Google Analytics-Integration, Workspace-Management und vieles mehr. Die letzten angekündigten bevorstehenden Updates sind etwas, worauf wir uns freuen können, und halten uns alle in Aufregung. 

Webflows Engagement für die Optimierung der Nutzererfahrung ist in diesen Updates deutlich sichtbar und bietet Designern und Entwicklern mehr Leistung, Flexibilität und Effizienz.

Wenn du noch ein Anfänger auf dem Webflow-Weg des Webdesigns und der Webentwicklung bist, kannst du dir den Webflow 101-Kurs für eine ausführliche Einführung in alle Aspekte des Webdesigns ansehen, und vergiss nicht, unseren Blog auf die neuesten Webflow-Neuigkeiten und Updates zu überprüfen!

‍