dpi Design Projekt anfragen

WordPress, Webflow & Technik · Blog

Was ist Webflow? Designer, CMS und Hosting einfach erklärt

Webflow verbindet visuellen Designer, CMS und Hosting in einer Plattform. Was das bedeutet, was das Webflow CMS kann und für welche Unternehmen es passt.

Monitor mit Designsystem

Wer sich mit einer neuen Website beschäftigt, stößt schnell auf Webflow. Meist fallen dann Schlagworte wie No-Code, visueller Editor oder Website ohne Plugins. Dieser Artikel erklärt, was dahintersteckt: wie Webflow aufgebaut ist, was das Webflow CMS kann, wie Ihr Team Inhalte pflegt, wo die Stärken und Grenzen liegen und für welche Unternehmen sich das System eignet.

Was ist Webflow? Die kurze Antwort

Webflow ist eine Plattform, mit der Sie Websites erstellen, visuell gestalten, Inhalte in einem Content-Management-System verwalten und die fertige Website direkt veröffentlichen. Es ist also kein reines Design-Tool. Designer, CMS und Hosting stecken in einer Software, die im Browser läuft. Sie müssen nichts installieren und keinen Server einrichten.

Webflow ist Software as a Service des US-Unternehmens Webflow Inc. und seit 2013 am Markt. Anders als WordPress ist es kein Open-Source-System: Sie nutzen die Plattform im Abo und zahlen dafür Tarife. Die Grundfunktionen lassen sich kostenlos ausprobieren. Für eine Website mit eigener Domain brauchen Sie einen kostenpflichtigen Tarif.

Besonders ist, dass Sie im Designer mit denselben Konzepten arbeiten wie bei handgeschriebenem Code, also mit Boxen, Abständen, Flexbox, Grid und CSS-Klassen. Webflow übersetzt das in HTML, CSS und JavaScript. Deshalb gilt Webflow als No-Code- oder Low-Code-Werkzeug für Profis und nicht als einfacher Baukasten nach dem Muster „Vorlage wählen, Text austauschen“.

Die Bausteine von Webflow

Webflow besteht aus mehreren Teilen, die ineinandergreifen. Jeder Teil richtet sich an andere Personen im Projekt:

BausteinAufgabeWer damit arbeitet
DesignerLayout, Gestaltung, Animationen, Anpassung an BildschirmgrößenWebdesigner, Agentur
CMSWiederkehrende Inhalte in Sammlungen mit eigenen FeldernAgentur richtet ein, Redaktion befüllt
BearbeitungsmodusTexte, Bilder und CMS-Einträge direkt auf der Seite ändernMarketing, Redaktion
HostingVeröffentlichung, Auslieferung über ein weltweites Netzwerk, SSLÜbernimmt Webflow
Apps und Custom CodeZusatzfunktionen und externe Tools anbindenEntwickler, Agentur
E-Commerce und Add-onsOnlineshop, Analyse, Tests, ÜbersetzungJe nach Bedarf

Der Designer: visuell arbeiten wie mit Code

Der Designer ist das Herzstück. Hier entstehen Seiten aus verschachtelten Elementen, deren Abstände, Größen und Anordnung Sie über das Box-Modell, Flexbox und Grid steuern. Gestaltungsregeln hinterlegen Sie in Klassen, die an vielen Stellen wiederverwendet werden. Ändern Sie eine Klasse, ändert sich das Aussehen auch an allen anderen Stellen. So lassen sich Entwürfe sehr genau und zugleich einheitlich umsetzen. Für Tablet und Smartphone legen Sie über Haltepunkte fest, wie sich das Layout anpasst. Dazu kommen Interaktionen und Animationen, etwa beim Laden einer Seite, beim Scrollen oder beim Klick.

Wiederkehrende Bereiche wie Navigation, Fußzeile oder ein Kontaktblock werden als Komponenten angelegt. So entstehen neue Seiten aus fertigen Bausteinen, und das Design bleibt einheitlich.

Der Bearbeitungsmodus für Redakteure

Ihr Team muss den Designer nicht beherrschen. Für die Pflege gibt es einen eigenen Bearbeitungsmodus (Edit Mode), in älteren Anleitungen oft einfach Editor genannt. Darin ändern Redakteure Texte und Bilder direkt auf der Seite und legen neue CMS-Einträge an. Das Layout ist dabei geschützt. Über Rollen und Rechte lässt sich festlegen, wer welche Inhalte bearbeiten und veröffentlichen darf. Zusätzliche Zugänge für Ihr Team kosten bei Webflow extra.

Hosting

Veröffentlichte Websites liegen auf der Infrastruktur von Webflow. Laut Webflow werden sie über die Content Delivery Networks von Amazon CloudFront und Fastly ausgeliefert und skalieren bei hohem Andrang automatisch. Ein SSL-Zertifikat ist enthalten. Jede Website bekommt außerdem eine Adresse auf webflow.io, die sich als Testumgebung nutzen lässt. Mit einem Site-Plan verbinden Sie Ihre eigene Domain. Server, Sicherheitsupdates und Software-Versionen verwaltet Webflow, Sie müssen sich darum nicht kümmern.

Apps, Integrationen und Custom Code

Plugins wie bei WordPress gibt es nicht. Viele Funktionen, für die WordPress Plugins braucht, sind eingebaut, zum Beispiel Formulare, SEO-Einstellungen und Sitemap. Für weitere Features gibt es Apps im Marktplatz von Webflow. Externe Tools wie Google Analytics, Newsletter-Dienste oder Terminbuchungen binden Sie per Integration oder per eingebettetem Code ein. Über eine Programmierschnittstelle (REST API) lassen sich Einträge im CMS automatisiert anlegen, ändern und löschen. Dazu kommen KI-Funktionen, die Webflow unter dem Namen Webflow AI in die Plattform integriert.

E-Commerce und Add-ons

Für Onlineshops gibt es eigene E-Commerce-Tarife, bei denen die Zahl der Artikel je Tarif begrenzt ist. Zusätzlich gibt es kostenpflichtige Add-ons, etwa Analyze für Besucherstatistiken, Optimize für A/B-Tests und Personalisierung sowie Localization für Sprachversionen. Die aktuellen Preise nennt Webflow auf seiner Preisseite.

Das Webflow CMS erklärt

Das Webflow CMS ist für wiederkehrende Inhalte gedacht, die immer gleich aufgebaut sind: Blogartikel, Referenzen, Stellenanzeigen, Teammitglieder, Standorte oder Veranstaltungen. Statt jede Seite einzeln zu gestalten, legen Sie eine Sammlung (Collection) an und bestimmen, welche Felder jeder Eintrag hat.

Ein Beispiel für eine Sammlung „Referenzen“:

  • Projektname als Textfeld
  • Branche als Auswahlfeld, damit sich Referenzen später filtern lassen
  • Titelbild und Galerie als Bildfelder
  • Beschreibung als formatierter Text
  • Leistungen als Verweis auf eine zweite Sammlung, die Ihre Leistungen enthält
  • SEO-Titel und SEO-Beschreibung als eigene Felder

Für die Sammlung gestalten Sie eine Vorlage. Jeder Eintrag bekommt damit automatisch eine eigene Seite im gleichen Design. Über Sammlungslisten (Collection Lists) zeigen Sie Einträge an beliebigen Stellen der Website an, gefiltert und sortiert, zum Beispiel die drei neuesten Referenzen aus einer Branche auf der passenden Leistungsseite. Seitentitel und Beschreibung für Suchmaschinen lassen sich aus den Feldern der Einträge befüllen.

Inhalte kommen auf verschiedenen Wegen ins CMS: von Hand, per CSV-Import oder über die API. Die Struktur der Sammlungen sollte vor dem Bau durchdacht sein. Felder und Verknüpfungen lassen sich später ändern, doch bei vielen Einträgen wird das aufwendig. Welcher Tarif das CMS enthält und wo die Grenzen liegen, zeigt die Preisseite von Webflow. Im einfachsten bezahlten Site-Plan ist das CMS laut Webflow nicht enthalten.

So entsteht eine Website mit Webflow

  1. Konto und Workspace

    Jede Website liegt in einem Workspace, dem Arbeitsbereich für Ihr Team oder Ihre Agentur. Ein kostenloser Workspace ist bei jedem Konto dabei.

  2. Struktur und CMS planen

    Seitenstruktur, Sammlungen und Felder werden festgelegt, bevor das Design entsteht.

  3. Gestalten im Designer

    Seiten, Vorlagen und Komponenten werden aufgebaut und für alle Bildschirmgrößen angepasst.

  4. Inhalte einpflegen

    Texte, Bilder und CMS-Einträge kommen in die Website, von Hand oder per Import.

  5. Testen auf webflow.io

    Die Website wird auf der Testadresse veröffentlicht und geprüft, bevor sie öffentlich wird.

  6. Site-Plan buchen und Domain verbinden

    Mit dem passenden Site-Plan geht die Website unter Ihrer Domain live. Danach pflegt Ihr Team Inhalte im Bearbeitungsmodus.

Stärken von Webflow

  • Individuelles Design ohne Theme-Grenzen: Entwürfe lassen sich sehr genau umsetzen, ohne dass ein fertiges Theme den Rahmen vorgibt.
  • Sauberer Code: Webflow erzeugt schlankes HTML und CSS statt verschachtelter Page-Builder-Strukturen.
  • Keine Plugin-Updates: Hosting, Sicherheitsupdates und SSL übernimmt die Plattform. Das senkt Pflegeaufwand und Angriffsfläche.
  • Pflege ohne Risiko für das Layout: Redakteure ändern Inhalte, ohne das Design zu beschädigen.
  • Schnell neue Seiten: Aus Komponenten und Vorlagen entstehen Landingpages, ohne dass jedes Mal ein Entwickler gebraucht wird.
  • SEO-Grundlagen eingebaut: Seitentitel, Beschreibungen, URLs, Weiterleitungen und Sitemap sind ohne Zusatzsoftware einstellbar.

Grenzen von Webflow

  • Bindung an die Plattform: Die Website läuft nur auf Webflow. Ein Code-Export ist laut Webflow mit kostenpflichtigen Workspace-Plänen möglich, dann funktionieren aber Formulare nicht mehr, und CMS-Inhalte müssen je Sammlung einzeln exportiert werden. Exportierten Code können Sie nicht wieder importieren.
  • Laufende Kosten: Für jede veröffentlichte Website fällt ein Tarif an, abgerechnet in US-Dollar. Für weitere Zugänge und Add-ons kommen Kosten dazu.
  • Lernkurve: Der Designer setzt Grundwissen über Webdesign und CSS voraus. Für Redakteure ist die Pflege dagegen einfach.
  • Weniger Erweiterungen: Das Angebot an Apps ist kleiner als die Plugin-Auswahl von WordPress. Sonderfunktionen brauchen oft externe Dienste oder eigenen Code.
  • Keine eingebauten Benutzerkonten mehr: Die Funktion für Benutzerkonten hat Webflow Anfang 2026 eingestellt. Mitgliederbereiche und Kundenportale brauchen externe Werkzeuge.
  • Onlineshop begrenzt: Die E-Commerce-Tarife begrenzen die Zahl der Artikel. Für große Sortimente oder Anbindungen an Warenwirtschaft ist WooCommerce flexibler.
  • Hosting-Standort nicht wählbar: Wo die Daten liegen, bestimmt Webflow. Fragen zum Datenschutz klären Sie mit Ihrem Datenschutzbeauftragten.
  • Support per E-Mail: Laut Webflow antwortet der Kundensupport in der Regel innerhalb von 48 Stunden. Dazu kommen Hilfecenter, Community und die Lernplattform Webflow University.

Für welche Unternehmen passt Webflow?

Webflow spielt seine Stärken aus, wenn eine Website oft wächst und sich verändert, aber keine komplexe Technik braucht.

Webflow passt gut, wenn

  • Ihr Marketing Inhalte und Landingpages häufig selbst ändern möchte
  • Sie kein eigenes Entwicklerteam haben und keine Wartung betreiben wollen
  • das Design besonders wichtig ist, etwa nach einem neuen Branding
  • wiederkehrende Inhalte wie Blog, Referenzen oder Jobs gut ins CMS passen

Webflow passt weniger, wenn

  • Sie einen größeren Onlineshop mit vielen Produkten und Varianten planen
  • Schnittstellen zu Warenwirtschaft, CRM oder Buchungssystem wichtig sind
  • ein Mitgliederbereich oder ein Kundenportal nötig ist
  • Sie Hosting und Code vollständig selbst kontrollieren möchten

Der wichtigste Unterschied zwischen Webflow und WordPress

WordPress ist offene Software, die Sie bei einem Hoster Ihrer Wahl betreiben und mit Plugins beliebig erweitern. Dafür sind Sie für Updates, Backups und Sicherheit zuständig. Webflow nimmt Ihnen diese Aufgaben ab, bindet Sie aber an seine Plattform, seine Funktionen und seine Preise. Welches System für welchen Fall besser passt, zeigt der ausführliche Vergleich Webflow oder WordPress. Wie ein Umzug abläuft, lesen Sie im Artikel Von WordPress zu Webflow. Welche SEO-Einstellungen Webflow bietet, erklärt der Beitrag zu Webflow SEO.

Ist Webflow das richtige System für Sie?

Wir entwickeln WordPress-Websites mit eigenem Theme und bieten Webflow als zweites System an. Deshalb empfehlen wir Webflow nur, wenn es für Ihr Projekt besser passt. Im kostenlosen Erstgespräch klären wir das gemeinsam. Preis auf Anfrage: Innerhalb von drei Werktagen erhalten Sie ein Festpreisangebot. Mehr dazu auf der Seite Webflow-Agentur.

Häufige Fragen

Ist Webflow kostenlos?

Zum Ausprobieren ja. Mit dem kostenlosen Starter-Tarif können Sie Webflow unbegrenzt testen und auf einer webflow.io-Adresse veröffentlichen. Für eine Website mit eigener Domain brauchen Sie einen kostenpflichtigen Site-Plan.

Ist Webflow ein CMS?

Ja, aber nicht nur. Webflow verbindet ein Content-Management-System mit einem visuellen Designer und Hosting. Das CMS verwaltet wiederkehrende Inhalte wie Blogartikel oder Referenzen in Sammlungen mit eigenen Feldern.

Brauche ich Programmierkenntnisse für Webflow?

Für die Pflege von Inhalten nicht. Bei der Gestaltung im Designer helfen Kenntnisse in HTML und CSS deutlich, weil der Designer mit denselben Konzepten arbeitet. Sonderfunktionen oder strukturierte Daten erfordern teilweise eigenen Code.

Wo werden Webflow-Websites gehostet?

Auf der Infrastruktur von Webflow. Laut Webflow werden die Seiten über die Netzwerke von Amazon CloudFront und Fastly ausgeliefert. Ein eigenes Hosting wählen Sie nicht, SSL und Updates sind enthalten.

Kann ich mit Webflow einen Blog betreiben?

Ja. Blogartikel sind ein typischer Anwendungsfall für das Webflow CMS. Sie legen eine Sammlung mit Feldern wie Titel, Bild, Text und Kategorie an, jeder Artikel bekommt automatisch eine eigene Seite.

Ist Webflow Open Source?

Nein. Webflow ist eine kommerzielle Plattform der Webflow Inc. Der Quellcode der Software ist nicht frei verfügbar, und Websites laufen auf dem Hosting von Webflow.

Erzählen Sie uns von Ihrem Projekt.

Ein Gespräch von 30 Minuten, kostenlos. Danach wissen Sie, was Ihre Website braucht, was sie kostet und wie lange es dauert.

Dominik Plaszewski

Dominik PlaszewskiGeschäftsführer
02452 / 68 74 116 · info@dpi-design.de

Erstgespräch vereinbaren
Oranges Wählscheibentelefon neben einer Kappe mit dpi-Design-Logo auf einem Holztisch