Webflow CMS 101 - Eine Einführung in das Webflow CMS

Tools und Anwendungen

Philip Schenk
Philip Schenk
Co-Founder
Stand:
05/2021

Webflow ist nicht nur ein mächtiges Werkzeug zur Erzeugung von statischen und klassischen Webseiten, sondern kann auch als Content-Management-System verwendet werden. Wir möchten Ihnen das Webflow CMS und seine Vorteile umfangreich vorstellen, Ihnen die verschiedenen Möglichkeiten der einfachen Nutzung präsentieren und eine umfangreiche Einführung in das Thema geben.

Was ist das Webflow CMS überhaupt?

Der Web-Editor Webflow ist nicht nur in der Lage statische Webseiten der unterschiedlichen Größe einfach zu erstellen, sondern bietet Ihnen auch die Möglichkeit als Content-Management-System genutzt zu werden. Somit können Sie nicht nur die Inhalte unabhängig vom Design erstellen, sondern auch mit mehreren Autoren an einer Website arbeiten, ohne dass die anderen Autoren das Design der Beiträge verändern können. Besonders für Blogs, aber auch für Nachrichten-Seiten ein erheblicher Vorteil. Dank der intuitiven Bedienung und der Festlegung der einzelnen Inhaltsfelder durch den Administrator behalten Sie jederzeit die volle Kontrolle über alle Inhalte und das gesamte Design der Website.

Welche Vorteile bietet das Webflow CMS?

Während die meisten am Markt erhältlichen CMS Systeme den Nutzern nur innerhalb bestimmter Grenzen Freiheiten einräumen und oftmals komplex im Design sind, geht Webflow CMS einen anderen Weg. Da Webflow auch zur Gestaltung statischer Webseiten, Funnels und Landingpages genutzt werden kann, bietet die Erweiterung mit Webflow CMS somit maximale Freiheit in Design und inhaltlicher Ausgestaltung. Zudem müssen Sie nur ein System einmal lernen und können somit mit Webflow alle Seiten Ihrer Wahl erstellen. Da Webflow CMS zudem mit einem visuellen Editor arbeitet, können Sie die Erstellung der Inhalte und des Designs intuitiv durchführen und sehen sofort alle Änderungen auf einen Blick. Optimal, wenn man nicht tief in die Bereiche HTML und CSS einsteigen, aber dennoch eine professionell programmierte Webseite haben möchte. Mit Webflow CMS erstellen Sie flexibel Ihre Webseiten der Wahl und können anderen Usern erlauben neue Inhalte exakt nach Ihren Design-Vorgaben zu erstellen. Denn dank des einfachen Rechte-Managements bleiben Änderungen am Design der Seite und am gesamten Erscheinungsbild Ihnen vorbehalten.

Sauber programmiert, ohne Programmierkenntnisse

Eine Seite selbst zu programmieren ist mit erheblichem Aufwand verbunden. Viele Fallstricke können hier zu Problemen führen. Ein bereits bestehendes CMS zu nutzen, schränkt allerdings aufgrund fehlender Funktionen oder Designs häufig ein. Mit Webflow CMS steht die optimale Lösung zur Verfügung. Denn über den einfachen visuellen Editor lässt sich eine Seite oder ein Design einfach und ohne großen Aufwand erstellen und anschließend an die verschiedenen Seiten übertragen. Wichtig ist vor allem, dass Webflow CMS einen validen HTML- und CSS-Code erzeugt, welcher unter anderem auch von den Crawlern der Suchmaschinen sauber ausgelesen werden kann. Dies bietet vor allem bei der Suchmaschinenoptimierung enorme Vorteile und kann helfen das Ranking nachhaltig zu verbessern. Wer keine Programmierkenntnisse besitzt, kann dennoch mit Webflow CMS effektive und gut nutzbare Seiten erstellen. Wer zusätzlich noch in HTML und CSS programmieren kann, öffnet mit Webflow CMS nochmals weitere Türen und kann viele Funktionen noch feiner einstellen und optimieren. Webflow CMS ist ein vollständiges Content-Management-System mit allen notwendigen Facetten.

Direkte Visualisierung im laufenden Prozess

Durch den einfachen Editor können Sie alle Veränderungen im laufenden Prozess beobachten und bewerten. Das sorgt unter anderem dafür, dass Sie viel einfacher unterschiedliche Varianten eines Designs ausprobieren können, was unter anderem die Entscheidungsfindung deutlich beschleunigt. Denn eine Repositionierung von Elementen ist in Webflow CMS nicht mit großem Aufwand verbunden, sondern kann mit wenigen Mausklicks durchgeführt werden. Da das Webflow CMS zudem streng logisch aufgebaut ist, können alle Elemente intuitiv erlernt werden. Mit ein wenig Übung geht die Gestaltung in Webflow CMS beinahe von selbst.

Individuell anpassbar an jedes Design

Sie können bei Webflow CMS nicht nur das Design beliebig anpassen, sondern es auch ganz einfach ändern und variieren. Diese Änderungen werden an alle damit verbundenen Unterseiten weitergeleitet, sodass die gesamte Website weiterhin wie aus einem Guss wirkt. Egal ob Sie über Webflow CMS ein Nachrichtenportal erstellen, einen Blog für Ihr Unternehmen ins Leben rufen oder Ihr Portfolio präsentieren möchten. Passen Sie mit Webflow CMS alles an neue technische Lösungen oder eine veränderte Marktumgebung an und sorgen Sie somit für die notwendige Variabilität. Dank des enorm breitgefächerten Funktionsumfangs von Webflow CMS und auch dank der regelmäßigen Updates und Neuerungen bleiben Sie mit Ihrer Webseite technisch immer auf dem neuesten Stand.

Das Webflow CMS - weg von statischen Seiten

Statische Seiten können sinnvoll und hilfreich sein, wenn nur einzelne Inhalte angezeigt werden sollen, welche sich kaum verändern. Landingpages sind beispielsweise typische Seiten. Auch Mikrowebsites und digitale Visitenkarten sind in der Regel eher statisch. Mit Webflow CMS steht Ihnen jedoch ein Werkzeug zur Verfügung, mit dem Sie sowohl statische als auch dynamische Seiten und Inhalte erstellen können. Der Vorteil liegt vor allem darin, dass Sie sich nicht an eine neue Entwicklungsumgebung gewöhnen müssen, sondern in Webflow CMS alle Funktionen in einem Dashboard finden. Dank des eingängigen "What you see is what you get"-Prinzips profitieren Sie auch ohne technisches Wissen von den vielen Vorteilen bei Webflow CMS.

Warum auf das Webflow CMS setzen?

Selbstverständlich gibt es viele verschiedene Content Management Systeme auf dem Markt. Doch wer neben solchen Seiten auch statische Seiten aufbauen möchte, muss dann weitere Programme an die Hand nehmen und sich gegebenenfalls neu einarbeiten. Ganz im Gegensatz dazu bietet Webflow CMS alle Möglichkeiten aus einer Hand. Über ein Dashboard können die verschiedenen Projekte erstellt, verändert und verwaltet werden. Je nach Nutzungsplan können auch mehrere Nutzer an einem Projekt arbeiten oder dieses nach Vorgaben mit Inhalten füllen. Zudem basiert Webflow CMS auf dem effektiven Prinzip eines Baukastens, welcher es dem Anwender erlaubt alle Details vollständig zu kontrollieren. Je affiner Sie in den Bereichen Grafikgestaltung und auch HTML-Programmierung sind, umso stärker werden Sie bemerken, wie praktisch die Herangehensweise bei Webflow CMS ist. Sie können jedes Element individuell anpassen und erhalten dennoch eine Seite mit einem klar lesbaren HTML- und CSS-Code, welche unter anderem für die SEO-Optimierung und die Crawler der Suchmaschinen optimiert ist. Sprechende URLs, eine klare Seitenstruktur und eine hohe Usability zeichnen die Seiten aus, welche mit Webflow CMS erstellt wurden.

Erste Schritte - so beginnen Sie mit dem Webflow CMS zu arbeiten

Damit Sie die Webflow CMS-Funktionen nutzen können, müssen einige Schritte beachtet werden. Denn Webflow bietet Ihnen die Möglichkeit dynamische Inhalte in verschiedenen Bereichen zu nutzen. Sie können sich für Blogs, Portfolios und Nachrichten-Seiten eigene Designs und Vorlagen erstellen, welche im Anschluss dauerhaft von den Nutzern verwendet werden können. Wir zeigen Ihnen, welche Schritte notwendig sind, damit Sie in Zukunft schnell und einfach neue Inhaltsseiten in Ihrem Webflow CMS erstellen können. Dafür beginnen wir im Webflow Editor am unteren linken Rand, wo alle CMS-Inhalte aufgelistet sind. Egal ob Sie ein System für Blogposts, für Nachrichten oder für ein Portfolio erstellen möchten, hier nimmt alles seinen Ausgang. Und zwar mit dem Erstellen einer Kollektion.

Eine Kollektion erstellen - Sammelpunkt für CMS-Inhalte

Der erste Schritt zu dynamischen Inhalten sind sogenannte Kollektionen. Dies ist wichtig, da die Kollektion wie eine Sammlung arbeitet. Wir können für eine Kollektion ein festes Design anlegen und auch, welche Inhalte in dieser Kollektion angezeigt werden sollen. Dies ist wichtig, da einige Webseiten nicht nur einen Typ dynamischer Inhalte anzeigen möchten, sondern unterschiedliche. Somit können wir dies über die Kollektionen sehr einfach trennen und organisieren. Webflow CMS stellt und sogar Vorlagen für verschiedene Kollektionen zur Verfügung, die wir einfach anpassen können. Vorlagen gibt es in Webflow CMS unter anderem für Blogbeiträge, Speisekarten, Nachrichten oder Events. Wichtig ist, dass Sie jede einzelne Kollektion individuell benennen, um diese im späteren Verlauf leichter finden und zuordnen zu können.

In jeder Kollektion können Sie nun festlegen, welche Felder in der Kollektion im Editor angezeigt werden sollen und welche Felder beispielsweise verpflichtend ausgefüllt werden müssen. Somit können Sie unter anderem festlegen, welche Elemente später im Design in jedem Fall vorhanden sein müssen, damit das einheitliche Erscheinungsbild gesichert wird. Zudem können Sie zu den einzelnen Feldern Hilfe-Texte erstellen, was es neuen Nutzern Ihres Webflow CMS später einfacher macht, neue Inhalte im Editor zu erstellen. Sie haben in den Kollektionen die völlige Freiheit alle Einstellungen vorzunehmen. Von der Zeichenbegrenzung bis zu Pflichtfeldern. Nehmen Sie sich in jedem Fall ausreichend Zeit, da hier später zwar Änderungen möglich sind, diese aber nicht für ältere Beiträge automatisch erweitert werden. Daher ist es sinnvoll sich die notwendigen Felder und Vorgaben von Beginn an strukturiert aufzubauen.

Sind Sie mit allen Einstellungen einverstanden, können Sie mit einem Klick im oberen rechten Bereich des Webflow CMS diese Kollektion einfach erstellen. Diese kann nun im Menü auf der linken Seite angewählt werden.

Die eigentlichen Inhalte erstellen - nutzen Sie den Editor im Webflow CMS

Klicken wir nun auf die eben erstellte Kollektion, sehen wir alle vorhandenen Inhalte in dieser Kollektion aufgelistet. Anfangs sind noch keine zu finden. Diese können wir mit einem Klick auf "Neue Inhalte" einfach erstellen. Das Webflow CMS bietet uns zudem die Möglichkeit Beispielinhalte schnell und einfach zu generieren. Diese werden nach den Vorgaben mit Blindtext und Beispielbildern gefüllt, damit wir im Anschluss am eigentlichen Design arbeiten können. Diese Inhalte lassen sich auch bearbeiten oder nach Abschluss der Arbeiten löschen. Somit können Sie mittels Webflow CMS sehr schnell die Arbeiten durchführen, ohne selbst neue Inhalte zu Beginn generieren zu müssen. Optimal, wenn Sie nur das Design festlegen und beispielsweise Ihre Redaktion oder ihre Mitarbeiter später mit dem Einpflegen der Inhalte beauftragt werden.

Die Darstellung generieren - legen Sie das Design für alle Inhalte fest

Nachdem nun Kollektion und Inhalte erstellt sind, geht es darum diesen ein Design zu verpassen. Denn dies ist beim Webflow CMS der wichtigste Punkt. Sie können ein Design wie bei einer statischen Seite in Webflow CMS erstellen und diese dann mit dynamischen Inhalten füllen. Dafür nutzen Sie im Webflow CMS Sektionen und Container, um die verschiedenen Inhalte zu positionieren. Doch das wären erst einmal statische Inhalte. Um diese Inhalte im Webflow CMS dynamisch zu gestalten, müssen Sie bei den einzelnen Elementen angeben, welche Inhalte der Kollektion in diesen Feldern angezeigt werden sollen. Im Feld für die Überschrift wird also die Verknüpfung zum Überschriften-Feld in der Kollektion geschaffen.
Sie erstellen also im Webflow CMS ein Design für eine Kollektion, welches auf jeden Inhalt und jeden Eintrag innerhalb der Kollektion angewendet wird. Aus diesem Grund müssen Sie zu Beginn genau überlegen, welche Felder in der Kollektion vorhanden sein sollen, um diese alle in Ihrem Design unterzubringen. Schön ist, dass Sie auch im Nachhinein noch das Design verändern können und diese Veränderungen einfach auf alle Inhalte der Seite übertragen werden. Hier zeigen sich die enormen Vorteile von Webflow CMS nochmals deutlich.

Ob Landingpage, Verkaufsfunnel oder Blog - das Webflow CMS ist ein mächtiges Werkzeug

Im Gegensatz zu vielen anderen CMS-Systemen bietet Ihnen Webflow CMS den Vorteil, dass Sie nicht nur die Felder des Editors selbst anpassen können, sondern auch volle Kontrolle über das Erscheinungsbild der Einträge haben. Sie müssen also keine Templates übernehmen, anpassen und individuell zuschneiden, sondern können dank des intuitiven Systems schnell und einfach das Design bestimmen. Dabei stehen Ihnen sowohl grafische als auch mathematische Einstellungsmöglichkeiten zur Verfügung, welche es besonders einfach machen, Designs und Inhalte perfekt miteinander zu verbinden. Im Gegensatz zu einem üblichen Homepage-Baukasten erlaubt es Ihnen Webflow CMS alle Werte exakt einzustellen und diese mit einer sauberen und klar erkennbaren Programmierung zu hinterlegen. Egal ob Sie komplexe Menüs, besondere Design-Elemente oder interaktive Inhalte planen, im Webflow CMS können Sie alle Möglichkeiten mit nur wenigen Klicks ausloten.

Diesen Beitrag weiterempfehlen:
Über den Autor
Webflow CMS 101 - Eine Einführung in das Webflow CMS
Philip Schenk
Co-Founder

Philip ist Co-Founder von 02100 und schafft es, mithilfe von Low-Code, Unternehmen bis zu 75% produktiver zu machen. 02100 bietet Custom Web-App und Website Entwicklung mit Low-Code an.

Das könnte Sie auch interessieren

Webflow lernen - Mit Schulungen die Webflow Hilfe optimieren
Für Unternehmen
Webflow Lernen - Warum Online-Schulungen für mehr Webflow Hilfe sorgen
Webflow lernen
Umzug von Wordpress zu Webflow - Worauf muss man achten?
Allgemein
Wer einen WordPress Umzug plant und zu Webflow wechseln möchte, sollte im Vorfeld ein paar Punkte beachten.
Wordpress Umzug
Hilfestellung: Webflow Agentur oder Webflow Freelancer?
Allgemein
Webflow Agentur oder Webflow Freelancer? Es gibt erhebliche Unterschiede, die es als Unternehmen zu beachten gilt.
Agentur oder Freelancer
Webflow Review & Test in 2021
Allgemein
Das Website-Design-Tool Webflow im Test. Review über Features, Funktionen und Kundenbewertung. Alles auf einen Blick und informativ aufbereitet.
Zum Webflow Review
Webflow - Erfahrungen von Nutzern, Admins und Anwendern
Tools und Anwendungen
Wir werfen einen Blick auf die Webflow Erfahrungen von allen Nutzern. Wir geben einen detaillierten Blick auf die verschiedenen Webflow Erfahrungen.
Mehr zu Webflow Erfahrungen
10 wichtige Fakten über Webflow
Allgemein
Webflow wird immer beliebter. 10 wichtige Fakten um mehr über Webflow zu lernen und das Tool besser zu verstehen
10 Fakten
Webflow Templates - Was Sie über den Einsatz der verschiedenen Templates wissen sollten
Tools und Anwendungen
Der Einsatz von Webflow Templates macht die Erstellung komplexer Websites deutlich einfacher. Dennoch ist die Hilfe einer Agentur von Vorteil.
Webflow Templates
Was ist Webflow? CMS oder Entwickler Software?
Für Unternehmen
Immer wieder stellt sich die Frage, ob Webflow ein CMS oder ob Webflow eine Entwickler Software ist. Diese Frage lässt sich nicht so einfach beantworten.
CMS oder Entwickler Software
Der große CMS-Vergleich - welche Webflow Alternative eignet sich für wen?
Allgemein
Mit Hilfe von Content-Management-Systemen wie Webflow, kurz CMS, lassen sich einfach und schnell Internetseiten erstellen - und das oft ohne Vorkenntnisse.
Webflow Alternativen
Was ist ein Citizen Developer?
Für Unternehmen
Citizen Developer sollen Abhilfe schaffen und die digitale Transformation der Unternehmen vorantreiben.
Mehr zum Thema Citizen Developer
Einführung in die Low-Code Entwicklung
Allgemein
Die Low-Code Entwicklung wird immer wichtiger und nimmt in der Realität vieler Unternehmen immer mehr Raum ein. Wir zeigen Ihnen, worum es sich bei der Low-Code Entwicklung handelt, wie die Zukunftsaussichten sind und welche Karrierechancen dieser Be
Low-Code Entwicklung
Low-Code vs. No-Code
Für Unternehmen
Low Code und No Code sind Entwicklungs-Ansätze in der IT, die mit wenig oder keiner Programmierung auskommen. Was unterscheidet die beiden Ansätze?
Mehr zu Low Code und No Code
Top 10 der Low-Code Tools
Tools und Anwendungen
Dank verschiedener Low-Code-Tools können kleine und mittelständische Unternehmen schneller passende Software-Lösungen erstellen.
Mehr zu Low Code Tools
Low-Code: Chancen und Möglichkeiten
Für Unternehmen
Die digitale Transformation ist ein herausfordernder Prozess, der besonders den Mittelstand vor hohe Anforderungen stellt. Low Code bietet neue Lösungen.
Erfahre alles über Chancen
Webflow vs. Wordpress
Allgemein
Webflow vs Wordpress - In diesem Webflow vs WordPress Vergleich lernst du alles was du wissen musst.
Mehr zum Webflow Vergleich
Webflow 101 - Der Webflow Designer
Recap Masterclasses
In diesem Artikel erfahren Sie alle Infos über die Kernfunktionalitäten des Webflow Designers.
Rund um den Webflow Designer
Webflow & Shopify - Buy Button Integration
Für Unternehmen
Durch die Integration von Shopify und Webflow können wir ganz neue Nutzererlebnisse schaffen und nachweislich mehr Umsatz für unsere Kunden erzeugen.
Mehr zu Webflow und Shopify
Vorstellung: Amazon Honeycode
Tools und Anwendungen
Hier erfahren Sie worum es dabei geht und wie man Honeycode am besten einsetzen kann.
Mehr zu Amazon Honey Code
Was ist Low-Code und wer kann es nutzen?
Allgemein
Was ist Low Code und welche Rolle spielen Webflow und andere Anbieter in der Digitalisierung.
Rund um Low Code

Weitere Themen und Artikel

Jetzt Kontakt aufnehmen
Vielen Dank! Wir haben deine Anfrage erhalten und melden uns bei dir.
Bitte fülle alle Felder aus um deine Anfrage zu senden.
Chat Icon
1
Close Icon
Unsere Erstberatung ist kostenlos!

Geschätzte Antwortzeit: innerhalb eines Tages