Wenn du eine einzigartige Website mit originellen Ideen erstellen möchtest, stoßen Website-Baukästen wie Wix und Squarespace schnell an ihre Grenzen. Webflow ist ein bisschen ausgefeilter und verfügt über mehr Optionen und Funktionen als die klassischen Baukästen. Diese Extras sind allerdings auch etwas komplizierter. Wenn die Plattform neu für dich ist, benötigst du eventuell ein paar Webflow-Tutorials für Einsteiger, um loslegen zu können.

Wir haben unten die 9 besten Webflow-Tutorials (in englischer Sprache) aufgelistet, damit du alles über die Besonderheiten der Software lernen kannst. Doch lass uns zunächst darüber sprechen, was Webflow ist und ob es überhaupt das Richtige für dich ist.

Illustration: Laptop mit verschiedenen Blöcken und einer Figur zum Erstellen einer Website
Illustration von OrangeCrush

Was ist Webflow?

Webflow ist ein Tool zur Erstellung von Webseiten, bei dem man sich nicht um die Programmierung kümmern muss. Als User kann man per Drag-and-Drop die gewünschte Seite im Seiteneditor erstellen und wenn sie fertig ist, werden HTML, CSS oder Javascript automatisch von Webflow erzeugt.

Webflow setzt auf eine ähnliche Struktur wie Editoren wie Squarespace oder Wix, bietet allerdings mehr Optionen. Das ist der Vorteil, den Webflow gegenüber seinen einfacheren Cousins hat; Webflow bietet fortschrittlichere Funktionen und mehr Möglichkeiten zur Personalisierung, sodass du mit deiner Website neue Wege gehen und wahrlich originelle Seiten erstellen kannst. Wenn du eine bestimmte Idee im Sinn hast, wie deine Seite aussehen soll, kann Webflow dabei helfen, diese zum Leben zu erwecken.

Gif-Demonstration der Webflow-Plattform
Webflows Arbeitsablauf via Webflow Blog

Mehr Funktionen bedeuten natürlich auch eine steilere Lernkurve. Menschen, die zum ersten Mal eine Website erstellen, strömen in Scharen zu Seiten wie Wix oder Squarespace, weil sie schnell und praktisch sind; Webflow muss man erst ein wenig lernen, um das Meiste herauszuholen. Deshalb sind diese Webflow-Tutorials so praktisch. Wenn du irgendwann nicht mehr weiterkommst und Antworten brauchst, findest du sie in einem dieser 9 Tutorials unten.

1. „A Webflow Tutorial for Absolute Beginners“ (Torque Magazine)

Ein Webflow-Tutorial für absolute Anfänger. Nick Schaferhoffs Webflow-Tutorial für das Torque Magazine ist tatsächlich eines der besseren, um einen umfassenderen Überblick zu bekommen: Alles ist sauber nach Kategorien gegliedert, damit du das findest, was du benötigst, und es verliert sich nicht in technischen Einzelheiten. Die Idee hinter diesem Artikel ist, den Leuten zu zeigen, was es noch alles gibt, aber er ist erstaunlich unvoreingenommen und lobt Webflow immer dann, wenn es angebracht ist.

Screenshot des Webflow-Tutorial-Beispiels: Was ist Webflow? von Nick Schäferhoff

Es ist ein sehr umfassender Blick auf Webflow. Auch wenn im Artikel ein paar Dinge zur Benutzeroberfläche erklärt werden und was man damit tun kann, ist er keine wirkliche Anleitung. Stattdessen handelt es sich eher um eine Einführung in Webflow für alle, die mehr darüber erfahren wollen, was mit Webflow möglich ist.

Preis:

  • kostenlos

Empfohlen, wenn:

  • du absolut nichts über Webflow weißt
  • du dich noch nicht entschieden hast, ob du Webflow oder eine andere Plattform nutzen möchtest

2. „Learning Webflow“ von Jen Kramer (LinkedIn Learning)

Screenshot of Webflow tutorial example: Learning Webflow from Jen Kramer

Webflow lernen. Die ehemalige Freelancerin Jen Kramer teilt in ihrem Kurs „Learning Webflow“ auf LinkedIn Learning ihr Branchenwissen. Dieser Kurs ist eine genaue Anleitung dazu, wie Webflow funktioniert, und dauert 1:46 Stunden.

Es handelt sich um eine grundlegende Zusammenfassung für Einsteiger, vom Beginn eines Projekts bis hin zur Veröffentlichung einer fertigen Seite. Kramer erklärt, wie man die Benutzeroberfläche von Webflow verwendet sowie alle benötigten Elemente hinzufügt, und zeigt uns insbesondere, wie man einzelne Seiten wie Home oder Kontakt erstellt.

Da es sich um LinkedIn Learning handelt, benötigst du ein Abo, um den Kurs sehen zu können. Wenn du bereits ein Abo für LinkedIn Learning hast, kannst du ihn kostenlos anschauen, ansonsten musst du dich anmelden.

Preis:

  • Abo für LinkedIn Learning für 29,49 €/Monat

Empfohlen, wenn:

  • du bereits ein Abo für LinkedIn Learning hast
  • ein Einsteiger-Tutorial möchtest, um die Grundlagen zu lernen

3. „The Easiest Guide to Webflow for Beginners“ von Jan Losert

Screenshot des Webflow-Tutorial-Beispiels: The Easiest Guide to Webflow for Beginners von Jan Losert

Der einfachste Webflow-Guide für Anfänger. Abseits von Videos und kostenpflichtigen Kursen ist „The Easiest Guide to Webflow for Beginners“ von Jan Losert ein kostenloser Online-Artikel, der die grundlegende Funktionsweise von Webflow (und wo du die ganzen Buttons findest) erklärt. Begleitet von Screenshots und GIFs ist dieser Guide eine praktische Kurzanleitung für den Einstieg.

Er geht zwar nicht auf fortgeschrittenere Techniken ein, bietet aber Links zu anderen Quellen wie Vorlagenbibliotheken und UI-Kits. Der Artikel mag zwar wie eine Bedienungsanleitung aufgebaut sein, aber der freundliche Ton des Autors und die Emojis sorgen für eine positive Stimmung.

Preis:

  • kostenlos

Empfohlen, wenn:

  • du Anleitungen in Textform gegenüber Videos bevorzugst; du kannst in deiner eigenen Geschwindigkeit lernen und die hilfreichen Screenshots können ziemlich informativ sein

4. „Webflow for Beginners: A Masterclass in Webflow“ (Udemy)

Screenshot des Webflow-Tutorial-Beispiels: Udemy

Webflow für Anfänger: Eine Webflow-Meisterklasse. „Webflow for Beginners: A Masterclass in Webflow“ ist eine gute Einleitung für Einsteiger und bietet Videos mit einer Gesamtlänge von beinahe 5 Stunden, die in 36 Lektionen unterteilt sind. Dieses Tutorial zeigt dir, wie du die Benutzeroberfläche von Webflow verwendest, einzelne Elemente kreierst und eine Landingpage mit allem drum und dran erstellst. Der ganze Kurs kostet 44,99 €, manchmal gibt es jedoch auch Rabatt.

Du kannst dir auch „Use Webflow to build your web design business“ anschauen. Dies ist ein kostenloser Kurs, der sich speziell an Unternehmen mit Themen wie SEO und Verkaufsdaten richtet.

Preis:

  • „Webflow for Beginners: A Masterclass in Webflow“ für 44,99 €
  • „Use Webflow to build your web design business“ ist kostenlos

Empfohlen, wenn:

  • dir das Lernmodell von Udemy gefällt
  • du alles wissen möchtest, was man als Einsteiger über Webflow wissen muss

5. „How To Structure Websites Efficiently With Webflow“ (Flux)

 

So strukturierst du Websites effizient mit Webflow. Das Tutorial „How To Structure Websites Efficiently With Webflow“ beschäftigt sich damit, wie du deine Website strukturieren solltest und wie du das in Webflow richtig anstellst. Das ist ein Fehler, den Webflow-Einsteiger häufig machen. Vermeide also diesen Fehler und erspare dir spätere Kopfschmerzen, indem du dir dieses 8 Minuten lange Video ansiehst!

Flux ist der YouTube-Kanal des Designers Ran Segall, auf dem er und seine Mitstreiter relevante Branchenthemen besprechen, von Unternehmenstipps bis hin zu allgemeinen Techniken. Wenn du mehr von Flux sehen möchtest, kannst du dir ihre gesamte Playlist mit Webflow-Tutorials ansehen.

Preis:

  • kostenlos

Empfohlen, wenn

  • Webflow neu für dich ist und du ein paar Grundlagen zum Thema Struktur möchtest

6. „Build a full site in Webflow“ (Design+Code)

Screenshot des Webflow-Tutorial-Beispiels: Design+Code

Eine komplette Website mit Webflow erstellen. Design+Code bietet diesen kostenlosen, vollständigen Kurs zur Verwendung von Webflow mit 12 einzelnen Videos, die größtenteils zwischen 10 und 12 Minuten lang sind. Die Screenshares von Webflow im Videoformat erleichtern es dir, dich mit der Software vertraut zu machen und problemlos auch fortgeschrittenere Techniken zu lernen.

Da der Kurs in 12 einzelne Videos unterteilt ist, kannst du in deiner eigenen Geschwindigkeit lernen. Du kannst auch von Lektion zu Lektion springen und dir beispielsweise anschauen, wie man Parallax-Scrolling oder Lottie-Animationen erstellt, abhängig von deiner Lernkurve und deinem Interesse.

Preis:

  • kostenlos

Empfohlen, wenn:

  • du Screenshares davon sehen möchtest, wie man Webflow verwendet; diese Videos zeigen nur die Webflow-Benutzeroberfläche in Aktion, was bestimmten Lerntypen helfen kann, herauszufinden, wo sich alles befindet und wie man gewünschte Dinge umsetzt.

7. „How to choose the right Webflow template“ (Pixel Geek)

 

So findest du das richtige Webflow-Template. Komme wegen der Webflow-Tutorials und bleibe wegen der Community! Pixel Geek ist eine bekannte Support-Gruppe für Designer und Designerinnen, die nicht programmieren, mit Coaching-Angeboten und Chat-Foren, um Einsteigern zu helfen. Der YouTube-Kanal von Pixel Geek wird von Nelson Abalos Jr. präsentiert.

How to choose the right Webflow template“ ist ein 38 Minuten langes Tutorial, in dem es um alles geht, was du über Webflow-Vorlagen wissen musst, was du bei der Wahl der Vorlagen beachten musst und natürlich wie du die beste Vorlage für dich auswählst.

Wenn du auf der Suche nach noch mehr Webflow-Tutorials bist, hat Pixel Geek zwei einzelne Playlisten: Webflow for beginners und Webflow for advanced users. Die Videos sind zwischen 5 und über 60 Minuten lang, aber dank des sympathischen Hosts kann man sie sich locker hintereinanderweg ansehen.

Preis:

  • kostenlos

Empfohlen, wenn

  • einen sympathischen, weniger distanzierten Lehrer möchtest
  • du ebenfalls Teil der Pixel Geek-Community sein möchtest

8. „Webflow for Entrepreneurs and UI/UX designers“ (Skillshare)

Screenshot des Webflow-Tutorial-Beispiels: Skillshare

Webflow für Unternehmer und UI/UX-Designer. Bei „Webflow for Entrepreneurs and UI/UX designers“ geht es um alles Wissenswerte zu Webflow, einschließlich CSS Grids und CMS (Content Management System). Du lernst alles von der Pike auf, daher musst du dir keine Sorgen machen, falls du über keinerlei Vorkenntnisse verfügst. Der Lehrer selbst war anfangs UI/UX Designer und hatte keine Ahnung, wie man programmiert oder eine Website entwickelt.

Wenn du eine Skillshare-Mitgliedschaft hast und ein paar Kurse für Experten möchtest, schau dir Webflow Advance & CMS an.

Preis:

  • 8 $/Monat (2,49 $/Monat bei jährlicher Zahlung)

Empfohlen, wenn

  • du bereits ein Skillshare Premium Abo hast

9. „Ultimate web design course“ (Webflow University)

Screenshot des Webflow-Tutorial-Beispiels: Webflow University

Der ultimative Webdesign-Kurs. Webflow University ist die erste Adresse in Sachen Webflow-Tutorials. Ihr Kurs „Ultimate web design“ behandelt alles von den Grundlagen bis hin zu fortgeschritteneren Themen, um zu lernen, wie man Webseiten in Webflow erstellt.

Er ist wie ein normaler Online-Kurs aufgebaut mit Kursen zu verschiedenen Webflow-Themen, wobei jeder Kurs in einzelne Videolektionen unterteilt ist, die zwischen 1 Minute und 20 Minuten lang sind.

Und falls das nicht genug ist, bietet Webflow University eine beeindruckende Themenvielfalt, einschließlich Kursen für Einsteiger, Fortgeschrittene und Profis. Sie gehen auch auf das Thema Programmieren ein. Das ist zwar optional, kann dir aber helfen, deine Seite wirklich nach deinen Wünschen anzupassen. Wenn du eine Seite für ein bestimmtes Unternehmen erstellen möchtest, zum Beispiel E-Commerce, haben sie auch dafür Kurse.

Preis:

  • kostenlos

Empfohlen, wenn

  • du in den anderen Webflow-Tutorials nicht gefunden hast, wonach du gesucht hast – bei diesem Kurs ist für jeden etwas dabei!

Wie du deine perfekte Website bekommst

Egal ob du Webflow-Tutorials im Videoformat oder als schriftliche Anleitung, als bezahlten Online-Kurs oder kostenlos bevorzugst, in der Liste oben findest du, was du brauchst. Diese Webflow-Tutorials eignen sich für alle Lernniveaus, von Experten, die ihr Können perfektionieren wollen, bis hin zu Leuten, die erst vor Kurzem erfahren haben, dass es Webflow überhaupt gibt.

Wenn du möchtest, dass dir professionelle Designer und Designerinnen dabei helfen, den perfekten Look für deine Website zu kreieren, haben wir genau die richtigen Leute, die deine Seite nach deinen Vorstellungen designen.

Du möchtest die perfekte Website für dein Unternehmen?
Dann arbeite mit unserer talentierten Design-Community.