digitalwerk icon
Header image of digitalwerk Webflow Expert certification on dark blue canvas
Image partially created by AI
06
Apr
2023

Wir beschäftigen uns seit geraumer Zeit intensiv mit Webflow. Hier dürfen wir euch unsere Erkenntnisse, Vor- und Nachteile sowie eine Einschätzung zur weiteren Entwicklung am Markt mitgeben.

Neue digitale Maßstäbe mit Webflow

Digitale Entwicklungen beobachten wir nicht nur, wir wollen sie aktiv mitgestalten. Besonders bemerkenswert ist der rasante Aufstieg von No-Code und Low-Code Plattformen wie Webflow.

Als Agentur erkennen wir ein Ziel, zerpflücken die Möglichkeiten und finden Lösungen. Dabei scheuen wir uns nicht davor, auch unbeschrittene Wege zu gehen. Das gilt auch für den Relaunch unserer eigenen Website, welchen wir im Zuge eines internen Markenprozesses letztes Jahr grundlegend überdacht haben. Mit der Umsetzung in Webflow konnten wir sowohl für uns – als auch in Folge für unsere Kunden – neue Möglichkeiten in Sachen Website identifizieren.

Was ist Webflow und für wen ist es geeignet?

Webflow ist eine No-Code Plattform, mit der responsive Websites in einem visuellen Programming-Canvas, dem Webflow Designer, erstellt werden können. Das Prinzip dabei ist einfach: Visueller Input wird im Hintergrund direkt in einen semantischen und sauberen HTML-, CSS- und JavaScript-Code übersetzt. Diese Kombination aus Webdesign, -entwicklung und integriertem Hosting ermöglicht die Gestaltung von responsiven Layouts, individuellen Animationen und ansprechenden Interaktionen.

Während das No-Code Tool sicherlich noch einige Iterationen vor sich hat, bis es der Umsetzung von umfangreichen Corporate Websites wie Semperit gewachsen ist, eignet es sich hervorragend für weniger komplexe Seiten, wie diese hier oder (Kampagnen-) Landingpages, wie jene, die wir für unsere gespendete Kampagne für das Haus der Barmherzigkeit entworfen haben.

Auch beim Website Relaunch von Digitale Mediensysteme, kurz DMS, haben wir uns für die Umsetzung mit Webflow entschieden, da so der Anspruch an Funktionalität, Agilität und Modernität auf allen Ebenen erfüllt werden konnte. Zentrale Aufgabenstellung in der Zusammenarbeit mit DMS war neben dem visuellen Brand Makeover die Gestaltung eines fokussierten und deutlich reduzierten Webauftritts, der die technisch hochkomplexen Lösungen von DMS zur Gestaltung von hybriden Erlebnissen im Bereich Retailing erlebbarer macht.  

Die einzelnen Preis- und Paketmodelle, welche sich in Seiten- und Workspace-Pläne clustern, können in einem monatlichen oder jährlichen, rabattierten Abonnement bezogen werden. Für komplexere Anforderungen oder Seiten, welche nicht mit den verfügbaren Standardmodellen wie dem CMS oder eCommerce-Plan umgesetzt werden können, bietet Webflow eine Enterprise Lösung an. Die unterschiedlichen Abonnements erlauben Anwender*innen dabei genau das Modell zu erwerben, welches für den jeweiligen Use Case der Seite passend ist. Durch den No-Code Ansatz, und einem selbsterhaltendem CMS-System, welches fortlaufend optimiert und weiterentwickelt wird, fallen keine Zusatzkosten für Upgrades an.

Vor- und Nachteile von Webflow im Überblick

  1. On-Page und Technical SEO:  
    Webflow bietet native SEO-Funktionen, welche ebenfalls durch Custom Fields erweitert werden können. Neben der Unterstützung von OpenGraph Meta Tags werden auch Google Dienste wie die Google Search Console und Google Analytics unterstützt sowie eine einfache Einrichtung von 301-Redirects und SSL ermöglicht. Separate Optionen bietet Webflow zur Minimierung von JavaScript-, CSS- und HTML-Codes, um Ladezeiten zu optimieren.
  1. No-Code / Low-Code:  
    Während Programmierkenntnisse im Bereich der Webentwicklung vorteilhaft sind, sind durch den Webflows No-Code Approach wenig bis keine Vorerfahrung erforderlich. Sollte dennoch der Wunsch nach mehr Individualisierung bestehen, kann ein individueller Code über Custom Code Snippets eingebunden werden.  
  1. Das gewisse Etwas:  
    Dank einer Vielzahl an verfügbaren JavaScript Libraries gibt es unzählige Möglichkeiten Websites mit Animationen extra Strahlkraft zu geben und den Fokus von Nutzer*innen durch visuelle Highlights zu lenken. Auch externe Dateitypen wie in AfterEffects erstellte Lottie-Animationen können eingebunden werden.  
  1. Webflow CMS:  
    Webflow bietet in seinem CMS-Siteplan ein natives und intuitiv bedienbares Content Management System, das in sogenannten Collections aufgebaut ist. Neben Texten und Bildern können auch dynamische HTML Embeds eingebunden werden und Inhalte sowohl im Frontend als auch im Backend kollaborativ von unterschiedlichen Member mit nur einem Klick bearbeitet werden – und das alles ohne Programmierkenntnisse.
  1. Kein Bedarf an CMS-, Security- und PHP-Updates:  
    Wie angesprochen ist Webflow bzw. das Webflow-CMS ein No-Code Tool, wodurch Security, PHP- und CMS-Updates obsolet werden. Auch Backups werden automatisch erstellt und können im Ernstfall leicht wieder eingespielt werden.
  1. Unterstützung von Schnittstellen:  
    Webflow bietet eine Vielzahl an möglichen Integrationen wie Shopify, HubSpot, InterCom und MailChimp. Schnittstellen wie auch die Einbettung von Custom Fonts, Google oder Adobe Fonts können durch API-Keys leicht eingebunden werden können.  
  1. Integriertes Hosting:  
    Webflow-Seiten laufen auf einem integrierten, von Webflow bereitgestelltem Content-Delivery-Network-Hosting (CDN), das von Amazon Web Services (AWS) & Fastly betrieben wird. Bereits existierende Domains können in den Seitenprojekt-Einstellungen verbunden werden und nach Umstellung von DNS-Einträgen gepublished werden.
     
  1. Rechtssicherheit:  
    Wenngleich die Server, auf denen Webflow Projekte betrieben werden, außerhalb der EU stehen, kann Webflow bei Abschluss von sogenannten EU-Standardvertragsklauseln DSGVO-konform genutzt werden.
  1. Freelance & Agency Plans:  
    Mithilfe von Agency & Freelance Plans können Websites kollaborativ für und mit Kunden in einem gemeinsamen Workspace erstellt werden und nach Fertigstellung übergeben werden.  
  1. Webflow Expert Program:  
    Als Agentur möchten wir aus dem Potenzial, welches Webflow bietet, für unseren Kunden Kapital schlagen und arbeiten daran, als Professional Partner in das Webflow Experts Program aufgenommen zu werden. Nach erfolgreichem Abschluss der Zertifizierung als Webflow Expert werden wir im nächsten Schritt in das weltweite Webflow Directory aufgenommen und als professioneller Umsetzungspartner vorgeschlagen.
  1. Funktionsumfang:  
    Wenngleich stetig neue Updates und Funktionen in Webflow veröffentlicht werden, weisen die Editor-Funktionen im Backend sowie ein durchdachtes Digital-Asset-Management (DAM) zur Verwaltung von Inhalten noch deutliches Verbesserungspotenzial auf.
  1. Skalierung:  
    Ein weiteres Manko, welches aus unserer Sicht jedoch nur noch eine Frage der Zeit ist, betrifft die Skalierung für die Umsetzung von großen Corporate-Websites.
  1. Fehlende Mehrsprachigkeit:  
    Derzeit müssen Webflow-Anwender*innen sich noch mit einem Workaround behelfen und Mehrsprachigkeit durch Seitenkopie herstellen. Webflow hat im November 2022 jedoch die Einführung nativer Mehrsprachigkeit angekündigt.
  1. Ausbaufähige Unterstützung von Dateitypen:  
    Während gängige Dateitypen wie Bilder (JPG, PNG, SVG, WebP), Dokumente (PDF, Word, Excel) oder Animationen im (dot)Lottie Format bereits unterstützt werden, stellt die Erweiterung der verwendbaren Dateitypen den nächsten logischen Schritt dar, um Anwender*innen die gleiche Flexibilität in der Verwaltung und Einbettung von Files wie im Designprozess zu geben.  

"Auch wenn an den ein oder anderen Stellschrauben sicherlich noch gedreht werden kann – und muss –, öffnet Webflow die Tore zu einer visuelle Spielwiese für die Umsetzung von simplen Websites durch technisch-affine Designer*innen und design-affine Developer*innen.”

– Vincent Helmus, Account Management

Nahtlose Integration in bestehende Prozesse

Die gute Nachricht: Projektteams müssen das Rad nicht neu erfinden, viele bewährte Prozesse und Meilensteine innerhalb des Projektes bleiben gleich, andere können in der Umsetzung mit Webflow optimiert werden. Die Design- und Konzeptionsphase bleibt unverändert: Auf Basis der Kundenziele definieren wir Websitekonzepte und entwickeln eine Designsprache. Im digitalwerk setzen wir seit jeher auf Sketch und Figma als Designplattformen, vom UI-Design und Prototyping bis hin zum Handover.

Beim Development wird es jedoch interessant. Im Gegensatz zu anderen Projekten, bei denen wir uns für eine klassische Entwicklung entscheiden, kommt bei Umsetzungen mit Webflow alles aus einer Hand: Die Designer*innen, die das Interface gestaltet haben, programmieren auch die Website in Webflow. Ein schlankes Team ermöglicht noch effizienteres Arbeiten. Durch visuellen Input entstehen in kürzester Zeit fertige Websites, die in Qualität und Leistung keinen Vergleich scheuen müssen.  

Die Lernkurve ist aufgrund der Benutzerfreundlichkeit und intuitiven Bedienung der Software exponentiell. Ein UI-Designer mit einem Grundwissen über HTML, CSS und JavaScript lernt Webflow innerhalb weniger Wochen und liefert kurz darauf produktionsfertigen Code.

Die Eigenmotivation der Designer*innen ist dabei das A und O. Wir befinden uns in einer Zeit, in der jede Woche bestehende Strukturen hinterfragt und aufgebrochen werden. KI ist das beste Beispiel: Wer hätte noch vor einem Jahr gedacht, dass wir mit wenigen Worten und wirren Phrasen täuschend echte Bilder produzieren können? Dasselbe gilt auch für Websites. No-Code-Tools sind aus unserem Alltag nicht mehr wegzudenken. Integrationen wie Zapier, Airtable und Co. machen aus No-Code-Websites interaktive, lebendige Plattformen. Es ist unabdingbar, diese Trends zu erkennen und sich frühzeitig damit auseinanderzusetzen. Aus diesem Grund schreiben wir neue Positionen für Designer*innen nur noch mit Webflow-Vorkenntnissen aus.

Die Zukunft von No-Code Tools


Die Marketing- und Agenturbranche durchläuft derzeit eine rasante Veränderung, die sich in den letzten Jahren enorm beschleunigt hat.

„Als Gründer einer Digitalagentur habe ich miterlebt, wie sich das Geschäftsmodell innerhalb von nur 10 Jahren dramatisch gewandelt hat. Neue KI-Technologien, Remote/Hybride Teams und Diversität in Unternehmen sind nur einige der Faktoren, die den Wandel vorantreiben.”

– Mike Gattereder, Agenturinhaber

Besonders bemerkenswert ist in den letzten Jahren der Aufstieg von No-Code- und Low-Code-Plattformen wie Webflow und Framer, die herkömmlichen Systeme wie WordPress oder Drupal herausfordern.  

Wir beobachten diese Entwicklungen und die Community mit großem Interesse und versuchen sie aktiv mitzugestalten. Es macht einfach Spaß, die Dinge entstehen zu sehen – diese Eigendynamik und Abwechslung ist gut für unserer Branche und Kunden. Unsere Neugier und der Mut, Neues auszuprobieren ist Bestandteil unsere Philosophie und – to be honest: Eigentlich ist es 5 vor 12 auf diese Technologie zu setzen.

„Ich bin davon überzeugt, dass die besten Ergebnisse erzielt werden können, wenn Designer, Webflow-DevOps und klassische DevOps in der Zukunft je nach Projektdefinition zusammenarbeiten. Obwohl wir von Low Code sprechen, kommt es zurzeit wieder zu einer Spezialisierung von Designer und Webflow DevOPs – vielleicht nicht so extrem wie bei anderen Plattformen.”

– Mike Gattereder, Agenturinhaber

Unser Fokus liegt auf der Entwicklung von Webflow Premium Projekten, die eine hohe Performance und User Experience bieten. Hierbei setzen wir auf die Expertise von UX/UI-Designern, DevOps-Experten und technisch affinen Projektmanagern. Mit den neuen Tools und Möglichkeiten können wir einzigartige User-Erlebnisse schaffen, ohne auf unzählige Plugins zurückgreifen zu müssen. Trotzdem setzen wir nicht alles auf Webflow – eine große Headless E-Commerce oder Corporate Plattform stellt andere Ansprüche an das Ergebnis und benötigt ein größeres Team unterschiedlicher Disziplinen. Entscheidend für den Einsatz von No-Code Plattformen wie Webflow ist und bleibt der einzelne Use-Case.

Let’s get physical, or keep it digital:
Get in touch