Webflow MCP 2.0 für die Erstellung und Verwaltung von Websites mit KI-Agenten

Webflow MCP 2.0: Websites mit KI-Agenten erstellen und verwalten

Webflow MCP 2.0 ist die neueste Version des Model Context Protocol Servers von Webflow. Die wichtigste Änderung besteht darin, dass die meisten Vorgänge an Elementen, Komponenten, Stilen und Variablen keine offene Designer-Sitzung mehr erfordern. Durch den Wegfall dieser Anforderung können Agenten wie Claude, Cursor und ChatGPT nun direkt Websites in Produktion erstellen und verwalten – unter Einhaltung der Workspace-Berechtigungen und mit vollständiger Protokollierung.

‍

Was sich mit Webflow MCP 2.0 geändert hat

Der MCP-Server von Webflow nutzte schon immer zwei separate Zugangswege zu einer Website: die Data API für CMS-Inhalte, Seiten und Assets sowie die Designer API für die Arbeitsfläche selbst, also Elemente, Komponenten, Stile und Variablen. Die Data API funktionierte schon immer ohne einen geöffneten Designer.

Der alte Flaschenhals: die Bridge App

Die Designer API erforderte, dass jemand die Website physisch im Webflow Designer öffnete, die Bridge App über das Apps-Panel startete und diese Sitzung aktiv hielt, während der Agent arbeitete. Jede noch so kleine Textänderung an einem Button war davon abhängig, dass ein Mensch am Computer saß.

Für Agenturen, die Agenten über Nacht oder in Stapelverarbeitung für Dutzende von Seiten einsetzen wollten, war dies kein bloßes Ärgernis, sondern ein massives Hindernis.

Was jetzt ohne Sitzung funktioniert

In Webflow MCP 2.0ist dieses Hindernis für den Großteil der Designer API beseitigt. Ohne eine offene Sitzung können Agenten nun mit Folgendem arbeiten:

• Dem vollständigen Elementbaum, Texten, Stilen, Links, Bildern, Attributen, Tags, Sichtbarkeit und Anzeigenamen
• Komponenten, einschließlich Instanzen, Props, Slots und Varianten
• Stilen und Combo-Klassen, einschließlich stilbezogener Variablen-Modi
• Variablen, Farben, Schriftfamilien, Zahlen, Prozentwerten, Größen und deren Sammlungen

Agents können zudem ganze Seitenelemente auf Basis eines Schemas erstellen oder direkt rohen HTML- und CSS-Code einfügen. Wer die Entwicklungen im Bereich No-Code-Integrationenverfolgt, weiß, dass dies die wichtigste Neuerung ist – wichtiger als jedes einzelne neue Tool. Denn sie macht MCP von einer reinen Assistenzschicht zu einer echten Build-Schnittstelle.

Was ist die größte Neuerung in Webflow MCP 2.0? Der entscheidende Fortschritt ist, dass für Elemente, Komponenten, Styles und Variablen keine aktive Designer-Sitzung mehr erforderlich ist. Agents arbeiten direkt über die Data API, was echte Automatisierung ermöglicht, anstatt von einer manuell geöffneten Sitzung abhängig zu sein.

Laut der offiziellen Dokumentation von Webflowwurden zudem einige Tools umbenannt; so heißt set_id jetzt beispielsweise set_dom_id. Teams, die ältere Skill-Dateien verwenden, sollten diese an die neue Namensgebung anpassen.

‍

Die fünf neuen Funktionsbereiche

Neben dem Wegfall der Designer-Sitzung erschließt MCP 2.0 fünf völlig neue Bereiche einer Website, die alle ohne aktive Sitzung funktionieren.

Analyse-Reporting

Agents können per Chat Traffic-Daten für einen bestimmten Zeitraum abrufen, die Top-Seiten einer Website auflisten, Dimensionen wie Land oder Traffic-Quelle aufschlüsseln und die Verweildauer analysieren. Dies ist nur für Websites mit aktiviertem Webflow Analyze verfügbar.

Formulare und Einsendungen

Agents können Formulare und deren Schemata einer Website auslesen, Einsendungen gefiltert auflisten und abrufen, versteckte Felder aktualisieren sowie Einsendungen löschen. Dies ist besonders nützlich für Teams, die Formulare mit einem CRM verknüpfen.

Benutzerdefinierte Schriftarten

Agents können Schriftdateien auflisten, hochladen, ersetzen und entfernen. Die Einschränkung: Dies gilt nur für manuell hochgeladene Dateien, nicht für extern gehostete Google- oder Adobe-Schriftarten.

Sitemap-Indexierung

Agents können die Sitemap-Indexierung für CMS-Elemente und statische Seiten lesen, aktualisieren und in Massen bearbeiten. Bei Websites mit einer großen Anzahl an CMS-Elementen lassen sich so Indexierungsregeln für Hunderte von Einträgen gleichzeitig anwenden.

Agent-Anweisungen

Dies ist konzeptionell die bedeutendste Neuerung. Agent-Anweisungen sind Markdown-Regeln, die direkt auf der Website hinterlegt sind und auf die eigenen Variablen, Styles und CMS-Daten der Website verweisen – diese Referenzen werden sofort aufgelöst. Über Shared Libraries lassen sich diese Regeln im gesamten Workspace verteilen.

Was sind Agent-Anweisungen in Webflow MCP 2.0? Agent-Anweisungen sind Markdown-Regeln und Skill-Definitionen, die direkt auf der Website hinterlegt sind und auf deren Variablen, Stile, Komponenten und CMS-Daten zugreifen. Agenten erhalten diese automatisch und können sie direkt durchsuchen, lesen und bearbeiten, sodass Markenrichtlinien ohne manuelle Aktualisierungen stets mit dem Agenten mitwandern.

Neben diesen fünf wurden auch bestehende Tools erweitert:

• Seiten, Massenaktualisierungen von Einstellungen und Schema-Bearbeitung
• Assets, vollständige Ordnerverwaltung und Komprimierung
• Benutzerdefinierter Code, direkter Lese- und Schreibzugriff auf Website- und Seitenebene

‍

Was weiterhin eine aktive Designer-Sitzung erfordert

Einige Aktionen sind weiterhin nur im Designer möglich:

• Element-Snapshots, das Erfassen eines visuellen Zustands zur Überprüfung der Arbeit vor der Veröffentlichung
• Auswahl und Canvas-Navigation, das Auswählen eines Elements sowie das Auslesen von Seite, Modus und Branch
• Hochladen eines Bildes über eine URL

Diese drei Funktionen sind untrennbar mit dem verbunden, was ein Mensch gerade auf dem Bildschirm sieht, daher ist es sinnvoll, dass sie an eine aktive Sitzung gebunden bleiben.

Was erfordert in Webflow MCP 2.0 noch eine Designer-Sitzung? Element-Snapshots, Auswahl und Canvas-Navigation sowie das Hochladen eines Bildes über eine URL erfordern weiterhin eine geöffnete Designer-Sitzung über die Bridge App. Für vollständig unabhängiges Arbeiten kann ein Agent auf einer Staging-Domain veröffentlichen und das Ergebnis dort überprüfen, anstatt sich auf einen Snapshot zu verlassen.

‍

Wer sollte Webflow MCP 2.0 nutzen?

Die Nutzung sieht nicht für jedes Team gleich aus. Was ein Team daraus gewinnt, hängt davon ab, wer den Agenten steuert.

Marketing- und Content-Teams

Marketing-Teams profitieren am meisten von Analyze-Berichten und Agent-Anweisungen. Anstatt auf einen Entwickler zu warten, der einen Bericht erstellt, können sie einen Agenten direkt nach Traffic, Top-Seiten und Conversions fragen, während Agent-Anweisungen sicherstellen, dass Tonalität und Markenrichtlinien konsistent bleiben, selbst wenn drei verschiedene Personen denselben Agenten steuern.

Entwickler- und Agentur-Teams

Für Entwickler und Agenturen liegt der größte Vorteil darin, dass ein Agent ohne geöffneten Designer am Design-System, an Komponenten und Variablen arbeiten kann. Das bedeutet, dass Stapelverarbeitungen, Stil-Refactorings oder Massenaktualisierungen von Komponenten als Hintergrundaufgabe laufen können, anstatt eine Sitzung zu erfordern, die jemand live überwachen muss.

Enterprise-Teams mit mehreren Marken

Enterprise-Teams, die mehrere Marken oder Workspaces verwalten, profitieren am meisten von den Governance-Funktionen, benutzerdefinierten Rollen, Audit-Logs und der Arbeit mit Branches. Genau diese Mechanismen ermöglichen es ihnen, Agenten umfassendere Zugriffsrechte zu erteilen, ohne die Kontrolle darüber zu verlieren, wer welche Änderungen vornehmen darf. Die Zusammenarbeit mit einer erfahrenen Webflow-Designagentur bei der korrekten Einrichtung dieser Governance-Ebene von Anfang an erspart Teams die meisten Probleme, die sonst später auftreten.

‍

Beispiele für Agenten-Aufgaben nach Branche

Die Theorie hinter Berechtigungen und Branches wird erst durch konkrete Aufgaben wirklich greifbar. Hier ist ein Überblick, wie das bei drei verschiedenen Unternehmenstypen aussieht.

SaaS- und Software-Teams

Ein Software-Team, das häufig seine Preisseite anpasst oder neue Produktfunktionen hinzufügt, kann einen Agenten damit beauftragen, Komponenten der Funktionsliste auf einem Dutzend Seiten gleichzeitig zu aktualisieren – basierend auf einer einzigen Änderung in der CMS-Collection. Da diese Bearbeitung in einem isolierten Branch erfolgt, kann das Produktmarketing das Ergebnis vor der Veröffentlichung prüfen, ohne zu riskieren, dass die Preisseite während des laufenden Verkaufsbetriebs fehlerhaft wird.

Personalvermittlungs- und Zeitarbeitsagenturen

Personalagenturen synchronisieren oft Hunderte von Stellenanzeigen aus einem ATS in ein Webflow-CMS. Ein Agent kann Formulare und Einsendungen mit der Sitemap-Indexierung kombinieren, um Stellenanzeigen, die älter als ein bestimmtes Datum sind, automatisch aus der Sitemap auszuschließen und gleichzeitig versteckte Felder in den Einsendungen zu aktualisieren, um sie an den richtigen Recruiter weiterzuleiten.

E-Commerce und Produktkataloge

Bei Produktkatalogen mit Tausenden von Artikeln ermöglichen benutzerdefinierte Schriftarten und Analyse-Berichte einem Agenten, die Produktkategorien mit dem geringsten Engagement zu identifizieren und dann eine Änderung am Designsystem vorzuschlagen – zum Beispiel eine neue Variante für die Produktkarten-Komponente –, bevor diese Änderung auf den gesamten Katalog angewendet wird.

Ist Webflow MCP 2.0 für kleinere Websites sinnvoll? Ja, aber der größte Mehrwert zeigt sich bei Websites mit so vielen Seiten, CMS-Elementen oder Teammitgliedern, dass die manuelle Verwaltung zum Engpass wird. Bei einer Website mit fünf Seiten ohne CMS ist der Nutzen geringer als bei einer Seite mit Hunderten von CMS-Elementen und mehreren Bearbeitern.

‍

Agenten-Anweisungen in der Praxis

Agenten-Anweisungen sind dann am nützlichsten, wenn sie spezifisch sind, anstatt Offensichtliches zu wiederholen.

Was in die erste Anweisung gehört

Die erste Anweisung für jede Website sollte die grundlegende Markenstimme, zu vermeidende Begriffe und die bereits im Designsystem vorhandenen Komponenten abdecken. Eine gute erste Anweisung enthält in der Regel:

• Markentonalität und Sprachstil in zwei bis drei Sätzen, ergänzt durch konkrete Beispiele für zulässige und unzulässige Formulierungen.
• Eine Liste von Komponenten, die der Agent wiederverwenden sollte, anstatt sie von Grund auf neu zu erstellen.
• Eine Regel, die festlegt, wann der Agent vor dem Fortfahren eine Freigabe einholen muss.

Ein häufiges Problem: Veraltende Anweisungen

Der häufigste Fehler bei Agentenanweisungen besteht darin, sie einmal zu verfassen und dann zu vergessen. Da sich Referenzen innerhalb der Anweisungen sofort auf die aktuellen Daten der Website beziehen, veralten sie technisch gesehen selten. Der Tonfall und die Regeln können jedoch veralten, wenn sich die Marke weiterentwickelt und niemand daran denkt, die Anweisungstexte entsprechend anzupassen.

‍

Webflow MCP 2.0 und Migrationen von WordPress zu Webflow

Eine Migration von WordPress zu Webflow ist der Moment, in dem Governance am wichtigsten ist, da sich innerhalb kurzer Zeit eine enorme Anzahl von Seiten ändert.

Warum Governance während einer Migration so wichtig ist

Während einer Migration arbeitet ein Agent oft in kurzer Zeit an hunderten von Seiten, Redirect-Mappings und CMS-Collections. Durch die Arbeit in Branches kann dieser gesamte Prozess isoliert ablaufen und überprüft werden, bevor eine einzige Seite live geht. Gleichzeitig bietet das Audit-Log eine klare Nachverfolgung, wer was geändert hat, falls Änderungen rückgängig gemacht werden müssen.

Ein Beispiel aus der Praxis

Als ein Franchise-Unternehmen eine neu gestaltete Webflow-Website mit strengen Vorgaben für strukturierte Daten und Redirect-Mappings startete, verzeichnete Broworks innerhalb von drei Monaten nach dem Launch ein organisches Traffic-Wachstum von 263 Prozent. Solche Ergebnisse hängen davon ab, dass kein Schritt der Migration unbemerkt bleibt – genau das bietet das Governance-Modell in MCP 2.0, wenn ein Agent einen Großteil dieser Arbeit übernimmt.

‍

Wie sich dies auf SEO- und AEO-Arbeiten auswirkt

Der Zugriff des Agenten auf Analysedaten und die Sitemap-Indexierung betrifft direkt die SEO- und AEO-Arbeit, nicht nur den reinen Aufbau der Website.

Schnellere Erkennung von SEO-Problemen

Anstatt dass jemand Berichte manuell einmal im Monat überprüft, kann ein Agent wöchentlich die wichtigsten Seiten und Engagement-Events kontrollieren. Er kann Seiten markieren, deren Traffic unter die Erwartungen gefallen ist, bevor sich dieser Rückgang zu einem schwer umkehrbaren Trend entwickelt.

Sitemap-Hygiene in großem Maßstab

Bei Websites mit einer großen Anzahl von CMS-Elementen erfolgt eine manuelle Bereinigung der Sitemap von veralteten oder inhaltlich schwachen Seiten selten konsistent. Ein Agent, der die Sitemap-Aufnahme basierend auf klaren Regeln wie dem Datum der letzten Bearbeitung oder der Wortanzahl in Massen aktualisiert, hält die Sitemap sauber, ohne dass dies zu einer monatlichen administrativen Last wird.

Die Verbindung zur AEO-Arbeit

Für Teams, die bereits daran arbeiten, von KI-Modellen zitiert zu werden, basiert die AEO-Arbeit von Broworks auf strukturierten Inhalten und präzisem Schema-Markup. Ein Agent, der über die erweiterten Pages-Tools Zugriff auf das Seiten-Schema hat, hilft dabei, diese Struktur über Hunderte von Seiten hinweg konsistent zu halten – und nicht nur bei den Seiten, die manuell überprüft werden.

‍

Sicherheitsaspekte für Enterprise-Teams

Für Teams mit strengeren Sicherheitsanforderungen bietet MCP 2.0 einige konkrete Garantien.

Audit-Trail für Compliance-Teams

Jede Aktion eines Agenten wird mit einer eindeutigen KI-Attribuierung im selben Audit-Log protokolliert, das auch für den Rest von Webflow verwendet wird. Das bedeutet, dass das Compliance-Team keinen separaten Bericht benötigt, da der Audit-Trail, den sie bereits für manuelle Bearbeitungen nutzen, auch die Änderungen durch Agenten abdeckt.

Einschränkung des Zugriffsbereichs

Da jede Autorisierung genau einen Workspace umfasst, erfordert die Erweiterung des Agentenzugriffs auf weitere Marken oder Websites eine bewusste, separate Aktion und geschieht nicht durch die versehentliche Weitergabe eines einzelnen Tokens.

‍

Wie Webflow MCP 2.0 den Agentenzugriff steuert

Dies ist der Punkt, der MCP 2.0 von einem allgemeinen Code-Assistenten unterscheidet.

Berechtigungen und benutzerdefinierte Rollen

MCP setzt die bestehenden Berechtigungen des Workspaces durch. Wenn ein Benutzer im Designer eine bestimmte Aktion nicht ausführen darf, kann dies auch ein Agent, der im Namen dieses Benutzers handelt, nicht über MCP tun.

Audit-Log

Jede Änderung, die ein Agent vornimmt, wird mit einer klaren Kennzeichnung im Audit-Log der Website festgehalten, die ausweist, dass sie von einem Agenten und nicht von einem Menschen stammt.

Branch-basiertes Arbeiten

Agenten können auf einem isolierten Branch arbeiten, der vollständig von der Live-Version getrennt ist, und Änderungen erst dann zusammenführen, wenn sie überprüft wurden.

Was passiert, wenn mehrere Agents gleichzeitig arbeiten?

Wenn zwei verschiedene Agents – zum Beispiel einer für Inhalte und einer für das Design-System – an derselben Website arbeiten, verhindert die Arbeit mit Branches, dass sich ihre Änderungen gegenseitig überschreiben. Jeder Agent erhält einen eigenen Branch, und das Zusammenführen am Ende durchläuft denselben Review-Prozess wie jede andere Änderung, unabhängig davon, wie viele Agents beteiligt sind.

Ein Workspace pro Autorisierung

Jede Autorisierung gilt für einen Workspace. Agenturen, die mehrere Kunden betreuen, sollten die erneute Autorisierung als Routinevorgang einplanen, nicht als Ausnahme.

Wie setzt Webflow MCP 2.0 Governance für Agents durch? MCP 2.0 wendet die bestehenden Rollen und benutzerdefinierten Berechtigungen des Workspaces an, protokolliert jede Änderung durch einen Agent im Audit-Log der Website und unterstützt die Arbeit in isolierten Branches, bevor Änderungen auf der Live-Website veröffentlicht werden.

‍

Webflow MCP 2.0 im Vergleich zu KI-nativen Codegeneratoren

KI-native Codegeneratoren erstellen zwar schnell eine funktionierende Seite, verfügen jedoch meist über kein Konzept für Workspace-Rollen, keine Audit-Protokolle und keine Branches, um Änderungen vor der Veröffentlichung zu isolieren.

‍

‍

Webflow berichtet, dass mehr als 30 Prozent der Unternehmenskunden MCP nutzen, wobei die Nutzung seit Januar 2026 um mehr als das Vierfache gestiegen ist. Arkose Labs nutzte Claude Code über MCP, um eine zehn Jahre alte WordPress-Website in Tagen statt in Monaten neu aufzubauen.

‍

Bekannte Einschränkungen

Einige Grenzen sollten beachtet werden, bevor die Lösung flächendeckend eingeführt wird:

• Interaktionen (IX3) müssen weiterhin manuell im Designer erstellt werden
• Einige Upload-Prozesse erfordern einen zweistufigen Ablauf, der fehlschlagen kann, wenn das Netzwerk die ausgehende Anfrage blockiert
• Eine Autorisierung deckt nur einen Workspace ab
• Lokalisierte CMS-Elemente können nicht über MCP erstellt, sondern nur in sekundären Sprachen gelesen und aktualisiert werden

‍

Was das für Teams bedeutet, die bereits MCP 1.0 nutzen

Der Umstieg von der ersten Version ist nicht ganz reibungslos.

Überprüfung der Tool-Benennung

Da einige Aktionen umbenannt oder verschoben wurden, sollten alle Skill-Dateien oder Automatisierungen, die für MCP 1.0 geschrieben wurden, vor dem produktiven Einsatz anhand des Migrationsleitfadens überprüft werden.

Tests vor der erweiterten Freigabe

Bevor Sie den Zugriff auf weitere Websites oder Workspaces ausweiten, ist es sinnvoll, einen Agenten zunächst auf einer weniger kritischen Website zu testen, sicherzustellen, dass sein Verhalten den alten Skill-Dateien entspricht, und erst dann das Rollout zu erweitern.

‍

Der Staging-Workflow im Detail

Für Teams, die möchten, dass ein Agent vollständig autonom arbeitet, ist eine Staging-Domain die praktische Lösung, die Webflow direkt empfiehlt.

Warum Staging Snapshots ersetzt

Ein Snapshot erfordert eine aktive Designer-Sitzung, da er den aktuellen Status der Arbeitsfläche ausliest. Eine Staging-Domain löst dasselbe Problem anders: Ein Agent veröffentlicht einen Branch auf einer Staging-URL und liest diese URL dann wie jede andere Seite aus, ohne dass jemand den Designer geöffnet lassen muss.

Was vor dem Mergen in den Live-Branch zu prüfen ist

Bevor ein Branch in die Produktion gemergt wird, sollten einige Punkte in der Staging-Version überprüft werden:

• Ob CMS-Bindungen nach der Änderung weiterhin korrekt angezeigt werden
• Ob Links nach dem Verschieben von Elementen weiterhin gültig sind
• Ob die Seite weiterhin einen grundlegenden Ladegeschwindigkeitstest besteht

‍

Was Broworks vor der ersten Agenten-Aufgabe empfiehlt

Bevor ein Kundenteam einen Agenten auf eine Produktions-Website loslässt, lohnt sich eine kurze interne Prüfung – und zwar nicht nur eine technische.

Wer im Team Zugriff auf den Connector erhält

Nicht das gesamte Marketing-Team benötigt vom ersten Tag an Zugriff auf den Connector. Es ist sicherer, wenn ein oder zwei Personen den Workflow zunächst testen, dokumentieren, was funktioniert hat und was nicht, und erst danach den Zugriff für den Rest des Teams freigeben.

So messen Sie den Erfolg bei der ersten Aufgabe

Die erste Aufgabe für den Agenten sollte nichts Kritisches sein, wie etwa die Bearbeitung der Preisseite. Eine bessere Wahl ist etwas Messbares und leicht Überprüfbares, wie das Aktualisieren von Alt-Texten bei zehn Bildern oder das Hinzufügen eines neuen CMS-Elements basierend auf einer bestehenden Vorlage. Der Erfolg bemisst sich daran, ob das Ergebnis auf dem Branch dem entspricht, was ein Mensch getan hätte, nicht an der Geschwindigkeit.

Wann es sinnvoll ist, eine Agentur hinzuzuziehen

Für Teams ohne internen Entwickler ist es sinnvoll, wenn eine Agentur wie Broworks die erste Runde der Agenten-Anweisungen und Rollen einrichtet, während das Kundenteam die tägliche Nutzung des Agenten übernimmt, sobald diese Regeln festgelegt sind. Dies ist dasselbe Übergabeprinzip, das Broworks bei regulären Webflow-Projekten anwendet: Das Ziel ist, dass der Kunde das System am Ende eigenständig betreiben kann.

‍

Wie Teams agentische Arbeit sicher in der Produktion einführen

1. Bilden Sie bestehende Rollen und Berechtigungen ab, noch bevor der Connector verbunden wird
2. Schreiben Sie Agenten-Anweisungen zu Stimme, Tonalität und Markenrichtlinien
3. Verbinden Sie den Connector nur mit dem Workspace, der getestet wird
4. Führen Sie die erste Aufgabe auf einem isolierten Branch aus, nicht auf der Live-Version
5. Verweisen Sie den Agenten bei unbeaufsichtigter Arbeit auf eine Staging-Domain
6. Überprüfen Sie nach den ersten Aufgaben das Audit-Protokoll

Ein Personalvermittlungskunde, den Broworks zu Webflow migriert hat, verzeichnete nach dem Launch ein organisches Traffic-Wachstum von 200 Prozent und fünfmal mehr Bewerbungen. Ein Governance-Modell wie dieses macht es sicher, eine solche Produktions-Website einem Agenten anzuvertrauen.